OXIESEC PANEL

Name	Size	Modified	Perms
📁 ..	-	02/20/2020 06:40:48 AM	rwxr-xr-x
📄 ComponentApi.ts	2.18 KB	02/20/2020 06:37:43 AM	rw-r--r--
📄 ComposingConfigs.ts	970 bytes	02/20/2020 06:37:43 AM	rw-r--r--
📄 DialogTabHeight.ts	5.23 KB	02/20/2020 06:37:45 AM	rw-r--r--
📄 DisablingConfigs.ts	678 bytes	02/20/2020 06:37:45 AM	rw-r--r--
📄 FieldLabeller.ts	1.87 KB	02/20/2020 06:37:46 AM	rw-r--r--
📄 FlatgridAutodetect.ts	1.16 KB	02/20/2020 06:37:46 AM	rw-r--r--
📄 RepresentingConfigs.ts	2.39 KB	02/20/2020 06:37:47 AM	rw-r--r--
📄 SimpleBehaviours.ts	700 bytes	02/20/2020 06:37:47 AM	rw-r--r--

Editing: FieldLabeller.ts

/**
 * Copyright (c) Tiny Technologies, Inc. All rights reserved.
 * Licensed under the LGPL or a commercial license.
 * For LGPL see License.txt in the project root for license information.
 * For commercial licenses see https://www.tiny.cloud/
 */

import { FormField as AlloyFormField, SketchSpec, RawDomSchema, AlloySpec } from '@ephox/alloy';
// TODO: Export properly from alloy.
import { Option } from '@ephox/katamari';
import { UiFactoryBackstageProviders } from '../../backstage/Backstage';

const renderFormFieldWith = (pLabel: Option<AlloySpec>, pField: AlloySpec, extraClasses: string[]): SketchSpec => {
  const spec = renderFormFieldSpecWith(pLabel, pField, extraClasses);
  return AlloyFormField.sketch(spec);
};

const renderFormField = (pLabel: Option<AlloySpec>, pField: AlloySpec): SketchSpec => {
  return renderFormFieldWith(pLabel, pField, [ ]);
};

const renderFormFieldSpec = (pLabel: Option<AlloySpec>, pField: AlloySpec) => {
  return {
    dom: renderFormFieldDom(),
    components: pLabel.toArray().concat([ pField ])
  };
};

const renderFormFieldSpecWith = (pLabel: Option<AlloySpec>, pField: AlloySpec, extraClasses: string[]) => {
  return {
    dom: renderFormFieldDomWith(extraClasses),
    components: pLabel.toArray().concat([ pField ])
  };
};

const renderFormFieldDom = (): RawDomSchema => {
  return renderFormFieldDomWith([ ]);
};

const renderFormFieldDomWith = (extraClasses): RawDomSchema => {
  return {
    tag: 'div',
    classes: ['tox-form__group'].concat(extraClasses)
  };
};

const renderLabel = (label: string, providersBackstage: UiFactoryBackstageProviders): AlloySpec => {
  return AlloyFormField.parts().label({
    dom: {
      tag: 'label',
      classes: ['tox-label'],
      innerHtml: providersBackstage.translate(label)
    }
  });
};

export {
  renderFormField,
  renderFormFieldWith,
  renderFormFieldSpec,
  renderFormFieldDom,
  renderLabel
};