npm - @limetech/lime-elements - Versions diffs - 37.6.0 → 37.7.1 - Mend

@limetech/lime-elements 37.6.0 → 37.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (145) hide show

package/dist/collection/components/form/form.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form.js","sourceRoot":"","sources":["../../../src/components/form/form.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n Watch,\n} from '@stencil/core';\nimport React from 'react';\nimport { createRoot, Root } from 'react-dom/client';\nimport JSONSchemaForm, { AjvError } from '@rjsf/core';\nimport retargetEvents from 'react-shadow-dom-retarget-events';\nimport { FormError, ValidationError, ValidationStatus } from './form.types';\nimport {\n ArrayFieldTemplate,\n FieldTemplate,\n ObjectFieldTemplate,\n} from './templates';\nimport { SchemaField as CustomSchemaField } from './fields/schema-field';\nimport { ArrayField as CustomArrayField } from './fields/array-field';\nimport { ObjectField as CustomObjectField } from './fields/object-field';\nimport { widgets } from './widgets';\nimport { createRandomString } from '../../util/random-string';\nimport Ajv, { RequiredParams } from 'ajv';\nimport { isInteger } from './validators';\nimport { mapValues } from 'lodash-es';\n\n/*\n @exampleComponent limel-example-form\n * @exampleComponent limel-example-nested-form\n * @exampleComponent limel-example-list-form\n * @exampleComponent limel-example-dynamic-form\n * @exampleComponent limel-example-custom-component-form\n * @exampleComponent limel-example-props-factory-form\n * @exampleComponent limel-example-form-layout\n * @exampleComponent limel-example-form-span-fields\n * @exampleComponent limel-example-custom-error-message\n * @exampleComponent limel-example-server-errors\n * @exampleComponent limel-example-form-with-help\n * @exampleComponent limel-example-form-row-layout\n /\n@Component({\n tag: 'limel-form',\n shadow: true,\n styleUrl: 'form.scss',\n})\nexport class Form {\n /\n The schema used to render the form\n /\n @Prop()\n public schema: {\n id?: string;\n [key: string]: any;\n } = {};\n\n /\n Value of the form\n /\n @Prop()\n public value: object;\n\n /\n Set to `true` to disable the whole form.\n /\n @Prop()\n public disabled = false;\n\n /\n Factory for creating properties for custom form components\n \n When using custom components in the form some properties might have to be\n * set dynamically. If this factory is set, it will be called with the\n * current schema for the field for each custom component in the form. The\n * factory must return an object where each key is the name of the property\n * that should be set, along with its value.\n /\n @Prop()\n public propsFactory?: (schema: Record<string, any>) => Record<string, any>;\n\n /\n Custom function to customize the default error messages\n /\n @Prop()\n public transformErrors?: (errors: FormError[]) => FormError[];\n\n /\n Extra errors to display in the form. Typical use case is asynchronous\n * errors generated server side.\n /\n @Prop()\n public errors: ValidationError;\n\n /\n Emitted when a change is made within the form\n /\n @Event()\n public change: EventEmitter<object>;\n\n /\n Emitted when the validity of the form changes, or when\n * a change is made to an invalid form\n */\n @Event()\n public validate: EventEmitter<ValidationStatus>;\n\n @Element()\n private host: HTMLLimelFormElement;\n\n private isValid = true;\n private modifiedSchema: object;\n private validator: Ajv.ValidateFunction;\n private root: Root;\n\n public constructor() {\n this.handleChange = this.handleChange.bind(this);\n this.getCustomErrorMessages = this.getCustomErrorMessages.bind(this);\n }\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentWillLoad() {\n this.setSchemaId();\n this.createValidator();\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n private initialize() {\n if (!this.host.shadowRoot.querySelector('.root')) {\n return;\n }\n\n this.reactRender();\n retargetEvents(this.host.shadowRoot);\n this.validateForm(this.value);\n }\n\n public componentDidUpdate() {\n this.reactRender();\n this.validateForm(this.value);\n }\n\n public disconnectedCallback() {\n if (this.root) {\n this.root.unmount();\n this.root = undefined;\n }\n }\n\n public render() {\n return <div class=\"root\" />;\n }\n\n private reactRender() {\n if (!this.root) {\n const rootElement = this.host.shadowRoot.querySelector('.root');\n this.root = createRoot(rootElement);\n }\n\n this.root.render(\n React.createElement(\n JSONSchemaForm,\n {\n schema: this.modifiedSchema,\n formData: this.value,\n onChange: this.handleChange,\n widgets: widgets,\n liveValidate: true,\n showErrorList: false,\n extraErrors: this.getExtraErrors(this.errors),\n FieldTemplate: FieldTemplate,\n ArrayFieldTemplate: ArrayFieldTemplate as any,\n ObjectFieldTemplate: ObjectFieldTemplate,\n disabled: this.disabled,\n transformErrors: this.getCustomErrorMessages,\n formContext: {\n schema: this.modifiedSchema,\n rootValue: this.value,\n propsFactory: this.propsFactory,\n },\n fields: {\n SchemaField: CustomSchemaField as any,\n ArrayField: CustomArrayField as any,\n ObjectField: CustomObjectField as any,\n },\n },\n [],\n ),\n );\n }\n\n private handleChange(event: any) {\n this.change.emit(event.formData);\n }\n\n private validateForm(value: object) {\n const isValid = this.validator(value) === true;\n const errors: FormError[] = this.getValidationErrors();\n const status: ValidationStatus = {\n valid: isValid,\n errors: errors,\n };\n\n if (this.isValid !== status.valid \|\| !status.valid) {\n this.validate.emit(status);\n }\n\n this.isValid = status.valid;\n }\n\n @Watch('schema')\n public setSchema() {\n this.setSchemaId();\n this.createValidator();\n }\n\n private setSchemaId() {\n // Due to a bug in react-jsonschema-form, validation will stop working if the schema is updated.\n // A workaround at the moment is to always give it a unique ID\n // https://github.com/rjsf-team/react-jsonschema-form/issues/1563\n const id = `${this.schema.$id}-${createRandomString()}`;\n this.modifiedSchema = {\n ...this.schema,\n id: id,\n $id: id,\n };\n }\n\n private createValidator() {\n const validator = new Ajv({\n unknownFormats: 'ignore',\n allErrors: true,\n multipleOfPrecision: 2,\n }).addFormat('integer', isInteger);\n this.validator = validator.compile(this.schema);\n }\n\n private getValidationErrors(): FormError[] {\n const errors = this.validator.errors \|\| [];\n\n return errors.map((error: Ajv.ErrorObject): FormError => {\n let property = error.dataPath;\n if (error.keyword === 'required') {\n property = (error.params as RequiredParams).missingProperty;\n }\n\n return {\n name: error.keyword,\n property: property,\n message: error.message,\n schemaPath: error.schemaPath,\n };\n });\n }\n\n private getExtraErrors(errors: ValidationError): ExtraError \| undefined {\n if (!errors) {\n return;\n }\n\n return mapValues(errors, (error) => {\n if (Array.isArray(error)) {\n return { __errors: error };\n }\n\n return this.getExtraErrors(error);\n });\n }\n\n private getCustomErrorMessages(originalErrors: AjvError[]): AjvError[] {\n if (!this.transformErrors) {\n return originalErrors;\n }\n\n const errors: FormError[] = originalErrors.map((error: AjvError) => {\n return {\n name: error.name,\n params: error.params,\n property: error.property,\n message: error.message,\n // For some reason 'schemaPath' is missing from the AjvError type definition:\n // https://github.com/rjsf-team/react-jsonschema-form/issues/2140\n // eslint-disable-next-line @typescript-eslint/dot-notation\n schemaPath: error['schemaPath'],\n };\n });\n\n // Use `.call({}, …)` here to bind `this` to an empty object to prevent\n // the consumer submitted `transformErrors` from getting access to our\n // component's internals. /Ads\n return this.transformErrors\n .call({}, errors)\n .map((transformedError: FormError) => {\n const originalError = originalErrors.find((error: AjvError) => {\n return transformedError.property === error.property;\n });\n\n return {\n ...originalError,\n message: transformedError.message,\n };\n });\n }\n}\n\ninterface ExtraError {\n [key: string]:\n \| ExtraError\n \| {\n __errors: string[];\n };\n}\n"]}
1	+ {"version":3,"file":"form.js","sourceRoot":"","sources":["../../../src/components/form/form.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Prop,\n Watch,\n} from '@stencil/core';\nimport React from 'react';\nimport { createRoot, Root } from 'react-dom/client';\nimport JSONSchemaForm, { AjvError } from '@rjsf/core';\nimport retargetEvents from 'react-shadow-dom-retarget-events';\nimport {\n FormError,\n FormSchema,\n ValidationError,\n ValidationStatus,\n} from './form.types';\nimport {\n ArrayFieldTemplate,\n FieldTemplate,\n ObjectFieldTemplate,\n} from './templates';\nimport { SchemaField as CustomSchemaField } from './fields/schema-field';\nimport { ArrayField as CustomArrayField } from './fields/array-field';\nimport { ObjectField as CustomObjectField } from './fields/object-field';\nimport { widgets } from './widgets';\nimport { createRandomString } from '../../util/random-string';\nimport Ajv, { RequiredParams } from 'ajv';\nimport { isInteger } from './validators';\nimport { mapValues } from 'lodash-es';\n\n/*\n @exampleComponent limel-example-form\n * @exampleComponent limel-example-nested-form\n * @exampleComponent limel-example-list-form\n * @exampleComponent limel-example-dynamic-form\n * @exampleComponent limel-example-custom-component-form\n * @exampleComponent limel-example-props-factory-form\n * @exampleComponent limel-example-form-layout\n * @exampleComponent limel-example-form-span-fields\n * @exampleComponent limel-example-custom-error-message\n * @exampleComponent limel-example-server-errors\n * @exampleComponent limel-example-form-with-help\n * @exampleComponent limel-example-form-row-layout\n /\n@Component({\n tag: 'limel-form',\n shadow: true,\n styleUrl: 'form.scss',\n})\nexport class Form {\n /\n The schema used to render the form\n /\n @Prop()\n public schema: FormSchema = {};\n\n /\n Value of the form\n /\n @Prop()\n public value: object;\n\n /\n Set to `true` to disable the whole form.\n /\n @Prop()\n public disabled = false;\n\n /\n Factory for creating properties for custom form components\n \n When using custom components in the form some properties might have to be\n * set dynamically. If this factory is set, it will be called with the\n * current schema for the field for each custom component in the form. The\n * factory must return an object where each key is the name of the property\n * that should be set, along with its value.\n /\n @Prop()\n public propsFactory?: (schema: FormSchema) => Record<string, any>;\n\n /\n Custom function to customize the default error messages\n /\n @Prop()\n public transformErrors?: (errors: FormError[]) => FormError[];\n\n /\n Extra errors to display in the form. Typical use case is asynchronous\n * errors generated server side.\n /\n @Prop()\n public errors: ValidationError;\n\n /\n Emitted when a change is made within the form\n /\n @Event()\n public change: EventEmitter<object>;\n\n /\n Emitted when the validity of the form changes, or when\n * a change is made to an invalid form\n */\n @Event()\n public validate: EventEmitter<ValidationStatus>;\n\n @Element()\n private host: HTMLLimelFormElement;\n\n private isValid = true;\n private modifiedSchema: FormSchema;\n private validator: Ajv.ValidateFunction;\n private root: Root;\n\n public constructor() {\n this.handleChange = this.handleChange.bind(this);\n this.getCustomErrorMessages = this.getCustomErrorMessages.bind(this);\n }\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentWillLoad() {\n this.setSchemaId();\n this.createValidator();\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n private initialize() {\n if (!this.host.shadowRoot.querySelector('.root')) {\n return;\n }\n\n this.reactRender();\n retargetEvents(this.host.shadowRoot);\n this.validateForm(this.value);\n }\n\n public componentDidUpdate() {\n this.reactRender();\n this.validateForm(this.value);\n }\n\n public disconnectedCallback() {\n if (this.root) {\n this.root.unmount();\n this.root = undefined;\n }\n }\n\n public render() {\n return <div class=\"root\" />;\n }\n\n private reactRender() {\n if (!this.root) {\n const rootElement = this.host.shadowRoot.querySelector('.root');\n this.root = createRoot(rootElement);\n }\n\n this.root.render(\n React.createElement(\n JSONSchemaForm,\n {\n schema: this.modifiedSchema,\n formData: this.value,\n onChange: this.handleChange,\n widgets: widgets,\n liveValidate: true,\n showErrorList: false,\n extraErrors: this.getExtraErrors(this.errors),\n FieldTemplate: FieldTemplate,\n ArrayFieldTemplate: ArrayFieldTemplate as any,\n ObjectFieldTemplate: ObjectFieldTemplate,\n disabled: this.disabled,\n transformErrors: this.getCustomErrorMessages,\n formContext: {\n schema: this.modifiedSchema,\n rootValue: this.value,\n propsFactory: this.propsFactory,\n },\n fields: {\n SchemaField: CustomSchemaField as any,\n ArrayField: CustomArrayField as any,\n ObjectField: CustomObjectField as any,\n },\n },\n [],\n ),\n );\n }\n\n private handleChange(event: any) {\n this.change.emit(event.formData);\n }\n\n private validateForm(value: object) {\n const isValid = this.validator(value) === true;\n const errors: FormError[] = this.getValidationErrors();\n const status: ValidationStatus = {\n valid: isValid,\n errors: errors,\n };\n\n if (this.isValid !== status.valid \|\| !status.valid) {\n this.validate.emit(status);\n }\n\n this.isValid = status.valid;\n }\n\n @Watch('schema')\n public setSchema() {\n this.setSchemaId();\n this.createValidator();\n }\n\n private setSchemaId() {\n // Due to a bug in react-jsonschema-form, validation will stop working if the schema is updated.\n // A workaround at the moment is to always give it a unique ID\n // https://github.com/rjsf-team/react-jsonschema-form/issues/1563\n const id = `${this.schema.$id}-${createRandomString()}`;\n this.modifiedSchema = {\n ...this.schema,\n id: id,\n $id: id,\n };\n }\n\n private createValidator() {\n const validator = new Ajv({\n unknownFormats: 'ignore',\n allErrors: true,\n multipleOfPrecision: 2,\n }).addFormat('integer', isInteger);\n this.validator = validator.compile(this.schema);\n }\n\n private getValidationErrors(): FormError[] {\n const errors = this.validator.errors \|\| [];\n\n return errors.map((error: Ajv.ErrorObject): FormError => {\n let property = error.dataPath;\n if (error.keyword === 'required') {\n property = (error.params as RequiredParams).missingProperty;\n }\n\n return {\n name: error.keyword,\n property: property,\n message: error.message,\n schemaPath: error.schemaPath,\n };\n });\n }\n\n private getExtraErrors(errors: ValidationError): ExtraError \| undefined {\n if (!errors) {\n return;\n }\n\n return mapValues(errors, (error) => {\n if (Array.isArray(error)) {\n return { __errors: error };\n }\n\n return this.getExtraErrors(error);\n });\n }\n\n private getCustomErrorMessages(originalErrors: AjvError[]): AjvError[] {\n if (!this.transformErrors) {\n return originalErrors;\n }\n\n const errors: FormError[] = originalErrors.map((error: AjvError) => {\n return {\n name: error.name,\n params: error.params,\n property: error.property,\n message: error.message,\n // For some reason 'schemaPath' is missing from the AjvError type definition:\n // https://github.com/rjsf-team/react-jsonschema-form/issues/2140\n // eslint-disable-next-line @typescript-eslint/dot-notation\n schemaPath: error['schemaPath'],\n };\n });\n\n // Use `.call({}, …)` here to bind `this` to an empty object to prevent\n // the consumer submitted `transformErrors` from getting access to our\n // component's internals. /Ads\n return this.transformErrors\n .call({}, errors)\n .map((transformedError: FormError) => {\n const originalError = originalErrors.find((error: AjvError) => {\n return transformedError.property === error.property;\n });\n\n return {\n ...originalError,\n message: transformedError.message,\n };\n });\n }\n}\n\ninterface ExtraError {\n [key: string]:\n \| ExtraError\n \| {\n __errors: string[];\n };\n}\n"]}

package/dist/collection/components/form/form.types.js CHANGED Viewed

@@ -1,5 +1,6 @@
 /**
  * @public
+ * Represents the layout types for a form.
  */
 export var FormLayoutType;
 (function (FormLayoutType) {

package/dist/collection/components/form/form.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"form.types.js","sourceRoot":"","sources":["../../../src/components/form/form.types.ts"],"names":[],"mappings":"~~AAqQA;;GAEG~~;AACH,MAAM,CAAN,IAAY,cAmBX;AAnBD,WAAY,cAAc;EACtB;;KAEG;EACH,qCAAmB,CAAA;EAEnB;;KAEG;EACH,+BAAa,CAAA;EAEb;;;;;;KAMG;EACH,6BAAW,CAAA;AACf,CAAC,EAnBW,cAAc,KAAd,cAAc,QAmBzB","sourcesContent":["import { Help } from '../help/help.types';\nimport { EventEmitter } from '@stencil/core';\n\n/*\n @public\n /\nexport interface ValidationStatus {\n /\n True if the form is valid, false otherwise\n \n If the form is invalid, any errors can be found on the `errors` property\n /\n valid: boolean;\n\n /\n List of validation errors\n /\n errors?: FormError[];\n}\n\n/\n @public\n /\nexport interface FormError {\n /\n Name of the error\n /\n name: string;\n\n /\n Params of the error\n /\n params?: unknown;\n\n /\n Name of the invalid property\n /\n property: string;\n\n /\n Path to the property within the schema\n /\n schemaPath: string;\n\n /\n String describing the error\n /\n message: string;\n}\n\n/\n @public\n /\nexport type ValidationError = {\n /\n Name of the field the error belongs to\n /\n [key: string]: string[] \| ValidationError;\n};\n\n/\n @public\n /\nexport interface FormComponent<T = any> {\n /\n The value of the current property\n /\n value: T;\n\n /\n Whether or not the current property is required\n /\n required?: boolean;\n\n /\n Whether or not the current property is readonly\n /\n readonly?: boolean;\n\n /\n Whether or not the current property is disabled\n /\n disabled?: boolean;\n\n /\n The label of the current property\n /\n label?: string;\n\n /\n The helper text for the current property\n /\n helperText?: string;\n\n /\n Additional contextual information about the form\n /\n formInfo?: FormInfo;\n\n /\n The event to emit when the value of the current property has changed\n /\n change: EventEmitter<T>;\n}\n\n/\n @public\n /\nexport interface FormInfo {\n /\n The schema of the current property\n /\n schema?: ~~object~~;\n\n /\n The schema of the whole form\n /\n rootSchema?: ~~object~~;\n\n /\n A tree of errors for this property and its children\n /\n errorSchema?: object;\n\n /\n The value of the whole form\n /\n rootValue?: any;\n\n /\n The name of the current property\n /\n name?: string;\n\n /\n Path to the property within the schema\n /\n schemaPath?: string[];\n}\n\n/\n Lime elements specific options that can be specified under the `lime` key in\n * a schema, e.g.\n \n ```ts\n * const schema = {\n * type: 'object',\n * lime: {\n * collapsible: true,\n * },\n * };\n * ```\n \n @public\n /\nexport interface LimeSchemaOptions {\n /\n When specified on an object it will render all sub components inside a\n * collapsible section\n /\n collapsible?: boolean;\n\n /\n When `collapsible` is `true`, set this to `false` to make the\n * collapsible section load in the open state.\n * Defaults to `true`.\n /\n collapsed?: boolean;\n\n /\n Will render the field using the specified component. The component\n * should implement the `FormComponent` interface\n /\n component?: FormComponentOptions;\n\n /\n When specified on an object it will render the sub components with the\n * specified layout\n /\n layout?: ~~FormLayoutOptions<any>;\~~n\n /\n Mark the field as disabled\n /\n disabled?: boolean;\n\n help?: string \| Help;\n}\n\n/\n Options for a component to be rendered inside a form\n \n @public\n /\nexport interface FormComponentOptions {\n /\n Name of the component\n /\n name?: string;\n\n /\n Extra properties to give the component in addition to the properties\n * specified on the `FormComponent` interface\n /\n props?: Record<string, any>;\n}\n\n/\n @public\n /\nexport interface FormLayoutOptions<T = FormLayoutType.Default> {\n /\n The type of layout to use\n /\n type: T;\n}\n\n/\n @public\n /\nexport interface GridLayoutOptions\n extends FormLayoutOptions<FormLayoutType~~.Grid>~~ {\n /\n When specified on a component within the grid, the component will take\n * up the the specified number of columns in the form\n /\n // eslint-disable-next-line no-magic-numbers\n colSpan?: 1 \| 2 \| 3 \| 4 \| 5 \| 'all';\n\n /\n When specified on a component within the grid, the component will take\n * up the the specified number of rows in the form\n /\n rowSpan?: number;\n\n /\n Number of columns to use in the layout\n /\n // eslint-disable-next-line no-magic-numbers\n columns?: 1 \| 2 \| 3 \| 4 \| 5;\n\n /\n Attempts to fill in holes earlier in the grid, if smaller items come up\n * later. This may cause items to appear out-of-order, when doing so would\n * fill holes left by larger items. Defaults to `true`.\n /\n dense?: boolean;\n}\n\n/\n @public\n /\nexport interface RowLayoutOptions\n extends FormLayoutOptions<FormLayoutType~~.Row>~~ {\n /\n When specified on a field, the chosen icon will be displayed\n * on the left side of the row, beside the title.\n /\n icon?: string;\n}\n\n/\n @public\n /\nexport enum FormLayoutType {\n /\n The default layout\n /\n Default = 'default',\n\n /\n Render the form fields using a responsive grid layout\n /\n Grid = 'grid',\n\n /\n Render the form fields in full-width rows.\n * Each row can have a leading `icon`, and a field.\n * `title` and `description` provided by the schema will be placed\n * on the row itself, and not on the field.\n * This layout is good for creating UIs for user settings pages.\n */\n Row = 'row',\n}\n"]}
1	+ {"version":3,"file":"form.types.js","sourceRoot":"","sources":["../../../src/components/form/form.types.ts"],"names":[],"mappings":"AAwSA;;;GAGG;AACH,MAAM,CAAN,IAAY,cAmBX;AAnBD,WAAY,cAAc;EACtB;;KAEG;EACH,qCAAmB,CAAA;EAEnB;;KAEG;EACH,+BAAa,CAAA;EAEb;;;;;;KAMG;EACH,6BAAW,CAAA;AACf,CAAC,EAnBW,cAAc,KAAd,cAAc,QAmBzB","sourcesContent":["import { JSONSchema7 } from 'json-schema';\nimport { Help } from '../help/help.types';\nimport { EventEmitter } from '@stencil/core';\n\n/*\n EventEmitter from `@stencil/core`.\n \n @public\n /\nexport { EventEmitter } from '@stencil/core';\n\ndeclare module 'json-schema' {\n interface JSONSchema7 {\n /\n @internal\n * Unique identifier for the schema\n /\n id?: string;\n\n /\n Lime elements specific options that can be specified in a schema\n /\n lime?: Omit<LimeSchemaOptions, 'layout'> & {\n layout?: Partial<LimeLayoutOptions>;\n };\n }\n}\n\n/\n @public\n /\nexport interface ValidationStatus {\n /\n True if the form is valid, false otherwise\n \n If the form is invalid, any errors can be found on the `errors` property\n /\n valid: boolean;\n\n /\n List of validation errors\n /\n errors?: FormError[];\n}\n\n/\n @public\n /\nexport interface FormError {\n /\n Name of the error\n /\n name: string;\n\n /\n Params of the error\n /\n params?: unknown;\n\n /\n Name of the invalid property\n /\n property: string;\n\n /\n Path to the property within the schema\n /\n schemaPath: string;\n\n /\n String describing the error\n /\n message: string;\n}\n\n/\n @public\n /\nexport type ValidationError = {\n /\n Name of the field the error belongs to\n /\n [key: string]: string[] \| ValidationError;\n};\n\n/\n @public\n /\nexport interface FormComponent<T = any> {\n /\n The value of the current property\n /\n value: T;\n\n /\n Whether or not the current property is required\n /\n required?: boolean;\n\n /\n Whether or not the current property is readonly\n /\n readonly?: boolean;\n\n /\n Whether or not the current property is disabled\n /\n disabled?: boolean;\n\n /\n The label of the current property\n /\n label?: string;\n\n /\n The helper text for the current property\n /\n helperText?: string;\n\n /\n Additional contextual information about the form\n /\n formInfo?: FormInfo;\n\n /\n The event to emit when the value of the current property has changed\n /\n change: EventEmitter<T>;\n}\n\n/\n @public\n /\nexport interface FormInfo {\n /\n The schema of the current property\n /\n schema?: FormSchema;\n\n /\n The schema of the whole form\n /\n rootSchema?: FormSchema;\n\n /\n A tree of errors for this property and its children\n /\n errorSchema?: object;\n\n /\n The value of the whole form\n /\n rootValue?: any;\n\n /\n The name of the current property\n /\n name?: string;\n\n /\n Path to the property within the schema\n /\n schemaPath?: string[];\n}\n\n/\n Lime elements specific options that can be specified under the `lime` key in\n * a schema, e.g.\n \n ```ts\n * const schema = {\n * type: 'object',\n * lime: {\n * collapsible: true,\n * },\n * };\n * ```\n \n @public\n /\nexport interface LimeSchemaOptions {\n /\n When specified on an object it will render all sub components inside a\n * collapsible section\n /\n collapsible?: boolean;\n\n /\n When `collapsible` is `true`, set this to `false` to make the\n * collapsible section load in the open state.\n * Defaults to `true`.\n /\n collapsed?: boolean;\n\n /\n Will render the field using the specified component. The component\n * should implement the `FormComponent` interface\n /\n component?: FormComponentOptions;\n\n /\n When specified on an object it will render the sub components with the\n * specified layout\n /\n layout?: LimeLayoutOptions;\n\n /\n Mark the field as disabled\n /\n disabled?: boolean;\n\n help?: string \| Partial<Help>;\n}\n\n/\n @public\n * Options for a layout to be used in a form\n /\nexport type LimeLayoutOptions = GridLayoutOptions & RowLayoutOptions;\n\n/\n Options for a component to be rendered inside a form\n \n @public\n /\nexport interface FormComponentOptions {\n /\n Name of the component\n /\n name?: string;\n\n /\n Extra properties to give the component in addition to the properties\n * specified on the `FormComponent` interface\n /\n props?: Record<string, any>;\n}\n\n/\n @public\n /\nexport interface FormLayoutOptions<\n T extends FormLayoutType \| `${FormLayoutType}` = FormLayoutType.Default,\n> {\n /\n The type of layout to use\n /\n type: T;\n}\n\n/\n @public\n * Layout options for a grid layout\n /\nexport interface GridLayoutOptions\n extends FormLayoutOptions<FormLayoutType \| `${FormLayoutType}`> {\n /\n When specified on a component within the grid, the component will take\n * up the the specified number of columns in the form\n /\n // eslint-disable-next-line no-magic-numbers\n colSpan?: 1 \| 2 \| 3 \| 4 \| 5 \| 'all';\n\n /\n When specified on a component within the grid, the component will take\n * up the the specified number of rows in the form\n /\n rowSpan?: number;\n\n /\n Number of columns to use in the layout\n /\n // eslint-disable-next-line no-magic-numbers\n columns?: 1 \| 2 \| 3 \| 4 \| 5;\n\n /\n Attempts to fill in holes earlier in the grid, if smaller items come up\n * later. This may cause items to appear out-of-order, when doing so would\n * fill holes left by larger items. Defaults to `true`.\n /\n dense?: boolean;\n}\n\n/\n @public\n * Layout options for a row layout\n /\nexport interface RowLayoutOptions\n extends FormLayoutOptions<FormLayoutType \| `${FormLayoutType}`> {\n /\n When specified on a field, the chosen icon will be displayed\n * on the left side of the row, beside the title.\n /\n icon?: string;\n}\n\n/\n @public\n * Represents the layout types for a form.\n /\nexport enum FormLayoutType {\n /\n The default layout\n /\n Default = 'default',\n\n /\n Render the form fields using a responsive grid layout\n /\n Grid = 'grid',\n\n /\n Render the form fields in full-width rows.\n * Each row can have a leading `icon`, and a field.\n * `title` and `description` provided by the schema will be placed\n * on the row itself, and not on the field.\n * This layout is good for creating UIs for user settings pages.\n /\n Row = 'row',\n}\n\n/\n @public\n * Represents the JSON schema with Lime specific options\n */\nexport interface FormSchema extends JSONSchema7 {}\n"]}

package/dist/collection/components/form/help/help.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"help.js","sourceRoot":"","sources":["../../../../src/components/form/help/help.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAG/D,MAAM,UAAU,gBAAgB,CAAC,~~MAAsB~~;;~~EACnD~~,MAAM,IAAI,GAAG,MAAA,MAAM,CAAC,IAAI,0CAAE,IAAI,CAAC;EAE/B,IAAI,CAAC,IAAI,EAAE;IACP,OAAO;GACV;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,KAAK,CAAC,aAAa,CAAC,YAAY,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;GAC7D;EAED,MAAM,SAAS,GAAG,IAAI,CAAC;EAEvB,OAAO,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE;IAC5C,IAAI,EAAE,YAAY;IAClB,YAAY,EAAE,SAAS;GAC1B,CAAC,CAAC;AACP,CAAC","sourcesContent":["import React from 'react';\nimport { LimeElementsAdapter } from '../adapters/base-adapter';\nimport { ~~LimeJSONSchema~~ } from '../~~internal~~.types';\n\nexport function getHelpComponent(schema: ~~LimeJSONSchema~~) {\n const help = schema.lime?.help;\n\n if (!help) {\n return;\n }\n\n if (typeof help === 'string') {\n return React.createElement('limel-help', { value: help });\n }\n\n const helpProps = help;\n\n return React.createElement(LimeElementsAdapter, {\n name: 'limel-help',\n elementProps: helpProps,\n });\n}\n"]}
1	+ {"version":3,"file":"help.js","sourceRoot":"","sources":["../../../../src/components/form/help/help.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAG/D,MAAM,UAAU,gBAAgB,CAAC,MAAkB;;EAC/C,MAAM,IAAI,GAAG,MAAA,MAAM,CAAC,IAAI,0CAAE,IAAI,CAAC;EAE/B,IAAI,CAAC,IAAI,EAAE;IACP,OAAO;GACV;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,KAAK,CAAC,aAAa,CAAC,YAAY,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;GAC7D;EAED,MAAM,SAAS,GAAG,IAAI,CAAC;EAEvB,OAAO,KAAK,CAAC,aAAa,CAAC,mBAAmB,EAAE;IAC5C,IAAI,EAAE,YAAY;IAClB,YAAY,EAAE,SAAS;GAC1B,CAAC,CAAC;AACP,CAAC","sourcesContent":["import React from 'react';\nimport { LimeElementsAdapter } from '../adapters/base-adapter';\nimport { FormSchema } from '../form.types';\n\nexport function getHelpComponent(schema: FormSchema) {\n const help = schema.lime?.help;\n\n if (!help) {\n return;\n }\n\n if (typeof help === 'string') {\n return React.createElement('limel-help', { value: help });\n }\n\n const helpProps = help;\n\n return React.createElement(LimeElementsAdapter, {\n name: 'limel-help',\n elementProps: helpProps,\n });\n}\n"]}

package/dist/collection/components/form/templates/object-field.js CHANGED Viewed

@@ -1,5 +1,4 @@
 import React from 'react';
-import { FormLayoutType } from '../form.types';
 import { renderDescription, renderTitle } from './common';
 import { GridLayout } from './grid-layout';
 import { RowLayout } from './row-layout';
@@ -38,7 +37,7 @@ function renderProperties(properties, schema) {
   return renderLayout(properties, layout);
 }
 function renderLayout(properties, layout) {
-  const type = (layout === null || layout === void 0 ? void 0 : layout.type) || FormLayoutType.Default;
+  const type = (layout === null || layout === void 0 ? void 0 : layout.type) || 'default';
   const layouts = {
     default: renderDefaultLayout,
     grid: renderGridLayout,

package/dist/collection/components/form/templates/object-field.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"object-field.js","sourceRoot":"","sources":["../../../../src/components/form/templates/object-field.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;~~AAC1B~~,OAAO,~~EAAqB,cAAc,~~EAAE,~~MAAM,eAAe,CAAC;AAElE,OAAO,EAAE,~~iBAAiB,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzC,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,KAAmC,EAAE,EAAE;EACvE,MAAM,EAAE,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC;EAC9B,IAAI,EAAE,KAAK,MAAM,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;IAC/C,OAAO,oBAAoB,CAAC,KAAK,CAAC,CAAC;GACtC;EAED,IAAI,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;IAC7B,OAAO,sBAAsB,CAAC,KAAK,CAAC,CAAC;GACxC;EAED,OAAO,gBAAgB,CAAC,KAAK,CAAC,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;AAC5D,CAAC,CAAC;AAEF,SAAS,oBAAoB,CAAC,KAAmC;EAC7D,OAAO,KAAK,CAAC,aAAa,CACtB,KAAK,CAAC,QAAQ,EACd,EAAE,EACF,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,EACxB,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,EACpC,gBAAgB,CAAC,KAAK,CAAC,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,CACnD,CAAC;AACN,CAAC;AAED,SAAS,sBAAsB,CAAC,KAAmC;EAC/D,MAAM,WAAW,GAAG,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;EAE/C,OAAO,KAAK,CAAC,aAAa,CACtB,2BAA2B,EAC3B;IACI,MAAM,EAAE,KAAK,CAAC,KAAK;IACnB,EAAE,EAAE,2BAA2B,CAC3B,KAAK,CAAC,WAAW,CAAC,MAAM,EACxB,KAAK,CAAC,QAAQ,CACjB;IACD,SAAS,EAAE,WAAW;GACzB,EACD,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,EACpC,gBAAgB,CAAC,KAAK,CAAC,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,CACnD,CAAC;AACN,CAAC;AAED,SAAS,2BAA2B,CAAC,MAAW,EAAE,~~SAAyB~~;;~~EACvE~~,MAAM,eAAe,GAAG,CAAC,CAAC;EAC1B,MAAM,sBAAsB,GAAG,KAAK,CAAC;EACrC,MAAM,QAAQ,GAAG,MAAC,MAAM,CAAC,IAAe,0CAClC,OAAO,CAAC,sBAAsB,EAAE,GAAG,EACpC,KAAK,CAAC,eAAe,CAAC,CAAC;EAC5B,MAAM,aAAa,GAAG,MAAA,SAAS,CAAC,GAAG,0CAAE,OAAO,CAAC,GAAG,EAAE,cAAc,CAAC,CAAC;EAElE,OAAO,aAAa,CAAC,OAAO,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;AACnD,CAAC;AAED,SAAS,gBAAgB,CACrB,UAAiC,EACjC,~~MAAsB~~;;~~EAEtB~~,MAAM,MAAM,~~GAAsB~~,MAAA,MAAM,CAAC,IAAI,0CAAE,MAAM,CAAC;~~EAEtD~~,OAAO,YAAY,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;AAC5C,CAAC;AAED,SAAS,YAAY,CACjB,UAAiC,EACjC,~~MAAyB~~;~~EAEzB~~,MAAM,IAAI,GAAG,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,IAAI,KAAI,~~cAAc~~,CAAC~~,OAAO,CAAC~~;~~EACpD~~,MAAM,OAAO,GAAqC;IAC9C,OAAO,EAAE,mBAAmB;IAC5B,IAAI,EAAE,gBAAgB;IACtB,GAAG,EAAE,eAAe;GACvB,CAAC;EAEF,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC,UAAU,EAAE,MAAM,CAAC,CAAC;AAC7C,CAAC;AAED,SAAS,mBAAmB,CAAC,UAAiC;EAC1D,OAAO,KAAK,CAAC,aAAa,CACtB,KAAK,EACL;IACI,SAAS,EAAE,4BAA4B;GAC1C,EACD,UAAU,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,CAC/C,CAAC;AACN,CAAC;AAED,SAAS,gBAAgB,CACrB,UAAiC,EACjC,MAAyB;EAEzB,OAAO,KAAK,CAAC,aAAa,CACtB,UAAU,EACV;IACI,OAAO,EAAE,MAAM;GAClB,EACD,UAAU,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,CAC/C,CAAC;AACN,CAAC;AAED,SAAS,eAAe,CAAC,UAAiC;EACtD,OAAO,KAAK,CAAC,aAAa,CACtB,SAAS,EACT,EAAE,EACF,UAAU,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,CAC/C,CAAC;AACN,CAAC;AAED,SAAS,aAAa,CAAC,~~MAAsB~~;;~~EACzC~~,OAAO,CAAC,CAAC,CAAA,MAAA,MAAM,CAAC,IAAI,0CAAE,WAAW,CAAA,CAAC;AACtC,CAAC;AAED,SAAS,WAAW,CAAC,~~MAAsB~~;~~EACvC~~,OAAO,MAAM,CAAC,IAAI,CAAC,SAAS,KAAK,KAAK,CAAC;AAC3C,CAAC","sourcesContent":["import React from 'react';\nimport { FormLayoutOptions~~, FormLayoutType~~ } from '../form.types';\nimport { ~~LimeJSONSchema } from '../internal.types';\nimport {~~ renderDescription, renderTitle } from './common';\nimport { GridLayout } from './grid-layout';\nimport { RowLayout } from './row-layout';\nimport { LimeObjectFieldTemplateProps, ObjectFieldProperty } from './types';\n\nexport const ObjectFieldTemplate = (props: LimeObjectFieldTemplateProps) => {\n const id = props.idSchema.$id;\n if (id === 'root' \|\| !isCollapsible(props.schema)) {\n return renderFieldWithTitle(props);\n }\n\n if (isCollapsible(props.schema)) {\n return renderCollapsibleField(props);\n }\n\n return renderProperties(props.properties, props.schema);\n};\n\nfunction renderFieldWithTitle(props: LimeObjectFieldTemplateProps) {\n return React.createElement(\n React.Fragment,\n {},\n renderTitle(props.title),\n renderDescription(props.description),\n renderProperties(props.properties, props.schema),\n );\n}\n\nfunction renderCollapsibleField(props: LimeObjectFieldTemplateProps) {\n const defaultOpen = !isCollapsed(props.schema);\n\n return React.createElement(\n 'limel-collapsible-section',\n {\n header: props.title,\n id: getSchemaObjectPropertyPath(\n props.formContext.schema,\n props.idSchema,\n ),\n 'is-open': defaultOpen,\n },\n renderDescription(props.description),\n renderProperties(props.properties, props.schema),\n );\n}\n\nfunction getSchemaObjectPropertyPath(schema: any, subSchema: ~~LimeJSONSchema~~) {\n const refPrefixLength = 2;\n const matchAllForwardSlashes = /\\//g;\n const rootPath = (schema.$ref as string)\n ?.replace(matchAllForwardSlashes, '.')\n .slice(refPrefixLength);\n const subSchemaPath = subSchema.$id?.replace('_', '.properties.');\n\n return subSchemaPath.replace('root', rootPath);\n}\n\nfunction renderProperties(\n properties: ObjectFieldProperty[],\n schema: ~~LimeJSONSchema~~,\n) {\n const layout: ~~FormLayoutOptions~~ = schema.lime?.layout;\n\n return renderLayout(properties, layout);\n}\n\nfunction renderLayout(\n properties: ObjectFieldProperty[],\n layout: ~~FormLayoutOptions,\~~n) {\n const type = layout?.type \|\| ~~FormLayoutType.Default~~;\n const layouts: Record<FormLayoutType, Function> = {\n default: renderDefaultLayout,\n grid: renderGridLayout,\n row: renderRowLayout,\n };\n\n return layouts[type](properties, layout);\n}\n\nfunction renderDefaultLayout(properties: ObjectFieldProperty[]) {\n return React.createElement(\n 'div',\n {\n className: 'limel-form-layout--default',\n },\n properties.map((element) => element.content),\n );\n}\n\nfunction renderGridLayout(\n properties: ObjectFieldProperty[],\n layout: FormLayoutOptions,\n) {\n return React.createElement(\n GridLayout,\n {\n options: layout,\n },\n properties.map((element) => element.content),\n );\n}\n\nfunction renderRowLayout(properties: ObjectFieldProperty[]) {\n return React.createElement(\n RowLayout,\n {},\n properties.map((element) => element.content),\n );\n}\n\nfunction isCollapsible(schema: ~~LimeJSONSchema~~) {\n return !!schema.lime?.collapsible;\n}\n\nfunction isCollapsed(schema: ~~LimeJSONSchema~~) {\n return schema.lime.collapsed !== false;\n}\n"]}
1	+ {"version":3,"file":"object-field.js","sourceRoot":"","sources":["../../../../src/components/form/templates/object-field.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport {\n FormLayoutType,\n FormSchema,\n LimeLayoutOptions,\n FormLayoutOptions,\n} from '../form.types';\nimport { renderDescription, renderTitle } from './common';\nimport { GridLayout } from './grid-layout';\nimport { RowLayout } from './row-layout';\nimport { LimeObjectFieldTemplateProps, ObjectFieldProperty } from './types';\n\nexport const ObjectFieldTemplate = (props: LimeObjectFieldTemplateProps) => {\n const id = props.idSchema.$id;\n if (id === 'root' \|\| !isCollapsible(props.schema)) {\n return renderFieldWithTitle(props);\n }\n\n if (isCollapsible(props.schema)) {\n return renderCollapsibleField(props);\n }\n\n return renderProperties(props.properties, props.schema);\n};\n\nfunction renderFieldWithTitle(props: LimeObjectFieldTemplateProps) {\n return React.createElement(\n React.Fragment,\n {},\n renderTitle(props.title),\n renderDescription(props.description),\n renderProperties(props.properties, props.schema),\n );\n}\n\nfunction renderCollapsibleField(props: LimeObjectFieldTemplateProps) {\n const defaultOpen = !isCollapsed(props.schema);\n\n return React.createElement(\n 'limel-collapsible-section',\n {\n header: props.title,\n id: getSchemaObjectPropertyPath(\n props.formContext.schema,\n props.idSchema,\n ),\n 'is-open': defaultOpen,\n },\n renderDescription(props.description),\n renderProperties(props.properties, props.schema),\n );\n}\n\nfunction getSchemaObjectPropertyPath(schema: any, subSchema: FormSchema) {\n const refPrefixLength = 2;\n const matchAllForwardSlashes = /\\//g;\n const rootPath = (schema.$ref as string)\n ?.replace(matchAllForwardSlashes, '.')\n .slice(refPrefixLength);\n const subSchemaPath = subSchema.$id?.replace('_', '.properties.');\n\n return subSchemaPath.replace('root', rootPath);\n}\n\nfunction renderProperties(\n properties: ObjectFieldProperty[],\n schema: FormSchema,\n) {\n const layout = schema.lime?.layout;\n\n return renderLayout(properties, layout);\n}\n\nfunction renderLayout(\n properties: ObjectFieldProperty[],\n layout: Partial<LimeLayoutOptions>,\n) {\n const type = layout?.type \|\| 'default';\n const layouts: Record<FormLayoutType, Function> = {\n default: renderDefaultLayout,\n grid: renderGridLayout,\n row: renderRowLayout,\n };\n\n return layouts[type](properties, layout);\n}\n\nfunction renderDefaultLayout(properties: ObjectFieldProperty[]) {\n return React.createElement(\n 'div',\n {\n className: 'limel-form-layout--default',\n },\n properties.map((element) => element.content),\n );\n}\n\nfunction renderGridLayout(\n properties: ObjectFieldProperty[],\n layout: FormLayoutOptions,\n) {\n return React.createElement(\n GridLayout,\n {\n options: layout,\n },\n properties.map((element) => element.content),\n );\n}\n\nfunction renderRowLayout(properties: ObjectFieldProperty[]) {\n return React.createElement(\n RowLayout,\n {},\n properties.map((element) => element.content),\n );\n}\n\nfunction isCollapsible(schema: FormSchema) {\n return !!schema.lime?.collapsible;\n}\n\nfunction isCollapsed(schema: FormSchema) {\n return schema.lime.collapsed !== false;\n}\n"]}

package/dist/collection/components/form/templates/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/form/templates/types.ts"],"names":[],"mappings":"","sourcesContent":["import { ObjectFieldTemplateProps, ArrayFieldTemplateProps } from '@rjsf/core';\nimport { ~~LimeJSONSchema~~ } from '../~~internal~~.types';\nexport { FieldTemplateProps, ArrayFieldTemplateProps } from '@rjsf/core';\n\nexport type TemplateProps = ObjectFieldTemplateProps \| ArrayFieldTemplateProps;\n\nexport type ObjectFieldProperty = ObjectFieldTemplateProps['properties'][0];\n\nexport type ArrayFieldItem = ArrayFieldTemplateProps['items'][0];\n\nexport interface LimeObjectFieldTemplateProps extends ObjectFieldTemplateProps {\n schema: ~~LimeJSONSchema~~;\n}\n\nexport interface Runnable {\n run: (event: any) => void;\n}\n\nexport interface RowProps {\n children?: any;\n}\n"]}
1	+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/form/templates/types.ts"],"names":[],"mappings":"","sourcesContent":["import { ObjectFieldTemplateProps, ArrayFieldTemplateProps } from '@rjsf/core';\nimport { FormSchema } from '../form.types';\nexport { FieldTemplateProps, ArrayFieldTemplateProps } from '@rjsf/core';\n\nexport type TemplateProps = ObjectFieldTemplateProps \| ArrayFieldTemplateProps;\n\nexport type ObjectFieldProperty = ObjectFieldTemplateProps['properties'][0];\n\nexport type ArrayFieldItem = ArrayFieldTemplateProps['items'][0];\n\nexport interface LimeObjectFieldTemplateProps extends ObjectFieldTemplateProps {\n schema: FormSchema;\n}\n\nexport interface Runnable {\n run: (event: any) => void;\n}\n\nexport interface RowProps {\n children?: any;\n}\n"]}

package/dist/collection/components/form/widgets/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/form/widgets/types.ts"],"names":[],"mappings":"","sourcesContent":["import { WidgetProps as RjsfWidgetProps } from '@rjsf/core';\nimport { ~~LimeJSONSchema~~ } from '../~~internal~~.types';\n\nexport interface WidgetProps extends RjsfWidgetProps {\n schema: ~~LimeJSONSchema~~;\n}\n"]}
1	+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/form/widgets/types.ts"],"names":[],"mappings":"","sourcesContent":["import { WidgetProps as RjsfWidgetProps } from '@rjsf/core';\nimport { FormSchema } from '../form.types';\n\nexport interface WidgetProps extends RjsfWidgetProps {\n schema: FormSchema;\n}\n"]}

package/dist/collection/components/header/header.js CHANGED Viewed

@@ -108,7 +108,7 @@ export class Header {
           "references": {
             "Icon": {
               "location": "import",
-              "path": "../../interface"
+              "path": "../../global/shared-types/icon.types"
             }
           }
         },

package/dist/collection/components/header/header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"header.js","sourceRoot":"","sources":["../../../src/components/header/header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AAMH,MAAM,OAAO,MAAM;;;;;;6BA8BqB,GAAG;;EAEhC,MAAM;IACT,OAAO;MACH,WAAK,KAAK,EAAC,aAAa;QACnB,IAAI,CAAC,UAAU,EAAE;QAClB,WAAK,KAAK,EAAC,UAAU;UACjB,UAAI,KAAK,EAAC,SAAS,EAAC,KAAK,EAAE,IAAI,CAAC,OAAO,IAClC,IAAI,CAAC,OAAO,CACZ;UACL,UAAI,KAAK,EAAC,YAAY,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU;YACxC,IAAI,CAAC,UAAU;YACf,IAAI,CAAC,oBAAoB,EAAE,CAC3B,CACH,CACJ;MACN,YAAM,IAAI,EAAC,SAAS;QAChB,eAAQ,CACL;KACV,CAAC;EACN,CAAC;EAEO,UAAU;IACd,MAAM,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAEpC,IAAI,CAAC,IAAI,EAAE;MACP,OAAO;KACV;IAED,OAAO,kBAAY,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,GAAI,CAAC;EAChE,CAAC;EAEO,oBAAoB;IACxB,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;MACtB,OAAO;KACV;IAED,OAAO,CACH,YAAM,KAAK,EAAC,6BAA6B;MACpC,IAAI,CAAC,uBAAuB,EAAE;MAC9B,IAAI,CAAC,cAAc,CACjB,CACV,CAAC;EACN,CAAC;EAEO,uBAAuB;IAC3B,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE;MACzB,OAAO;KACV;IAED,OAAO,gBAAO,IAAI,CAAC,iBAAiB,CAAQ,CAAC;EACjD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\nimport { Icon } from '../../~~interface~~';\nimport { getIconName } from '../icon/get-icon-props';\n\n/*\n A header is the top most visual element in a component, page, card, or a view.\n \n ## Usage\n * A header is the first thing that clarifies a context for users.\n * Due to their positions in the UI hierarchy, headers are the most\n * prominent elements of a user interface; and because of that, they carry both\n * vital information and fundamental controls for the area of the interface\n * they represent.\n \n For example, when a header is placed on top of a card, it should quickly\n * explain the card to the user. When placed on top of a modal, it should easily\n * clarify what the modal is about. When displayed on top of a fullscreen view,\n * it should indicate where in the system users are, and what part of the app\n * they are looking at.\n \n \n * ## Layout\n * The vital information in a header is usually manifested in form of an icon,\n * and a heading. A subheading also could be added to provide supplementary\n * information. There is also a third place for displaying supplementary information\n * or \"supporting text\", which will be rendered as a part of the subheading.\n * Along with this information, headers can also include actions, controls, or\n * menus.\n \n :::important\n * Such actions or menus must affect the entire section of the interface\n * which the header is representing. For example, a _Delete_ button on a card\n * header must delete that entire card and its respective contents all together,\n * not for example a selected item which is visible in the content of that card.\n * :::\n \n \n * :::warning\n * Do not user background color on icons in the headers. It is much better and\n * much easier for the eye if your icon itself has a color.\n * Background colors behind icons make them look like \"call to action\" buttons\n * and take a lot of attention from users.\n * :::\n \n @exampleComponent limel-example-header\n * @exampleComponent limel-example-header-slot-actions\n * @exampleComponent limel-example-header-colors\n * @exampleComponent limel-example-header-responsive\n * @exampleComponent limel-example-header-narrow\n * @slot actions - Content (actions) to be put inside the far right surface of\n * the header\n * @slot [no name] - DEPRECATED. The `actions` slot used to be unnamed. This\n * behavior has been deprecated, and support will be dropped in a future\n * version. Please add `slot=\"actions\"` to your elements to ensure your code\n * will continue to work with future versions of Lime Elements.\n /\n@Component({\n tag: 'limel-header',\n shadow: true,\n styleUrl: 'header.scss',\n})\nexport class Header {\n /\n Icon to display\n /\n @Prop()\n public icon?: string \| Icon;\n\n /\n Title to display\n /\n @Prop()\n public heading?: string;\n\n /\n Subheading to display\n /\n @Prop()\n public subheading?: string;\n\n /\n An extra string of text to display along with with the Subheading\n /\n @Prop()\n public supportingText?: string;\n\n /\n The visual divider that separates the `subheading` and the `supportingText`.\n * It must be a single character such as `-` or `,`.\n */\n @Prop()\n public subheadingDivider?: string = '·';\n\n public render() {\n return [\n <div class=\"information\">\n {this.renderIcon()}\n <div class=\"headings\">\n <h1 class=\"heading\" title={this.heading}>\n {this.heading}\n </h1>\n <h2 class=\"subheading\" title={this.subheading}>\n {this.subheading}\n {this.renderSupportingText()}\n </h2>\n </div>\n </div>,\n <slot name=\"actions\">\n <slot />\n </slot>,\n ];\n }\n\n private renderIcon() {\n const icon = getIconName(this.icon);\n\n if (!icon) {\n return;\n }\n\n return <limel-icon class=\"icon\" badge={true} name={icon} />;\n }\n\n private renderSupportingText() {\n if (!this.supportingText) {\n return;\n }\n\n return (\n <span class=\"subheading__supporting-text\">\n {this.renderSubheadingDivider()}\n {this.supportingText}\n </span>\n );\n }\n\n private renderSubheadingDivider() {\n if (!this.subheadingDivider) {\n return;\n }\n\n return <span>{this.subheadingDivider}</span>;\n }\n}\n"]}
1	+ {"version":3,"file":"header.js","sourceRoot":"","sources":["../../../src/components/header/header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAErD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AAMH,MAAM,OAAO,MAAM;;;;;;6BA8BqB,GAAG;;EAEhC,MAAM;IACT,OAAO;MACH,WAAK,KAAK,EAAC,aAAa;QACnB,IAAI,CAAC,UAAU,EAAE;QAClB,WAAK,KAAK,EAAC,UAAU;UACjB,UAAI,KAAK,EAAC,SAAS,EAAC,KAAK,EAAE,IAAI,CAAC,OAAO,IAClC,IAAI,CAAC,OAAO,CACZ;UACL,UAAI,KAAK,EAAC,YAAY,EAAC,KAAK,EAAE,IAAI,CAAC,UAAU;YACxC,IAAI,CAAC,UAAU;YACf,IAAI,CAAC,oBAAoB,EAAE,CAC3B,CACH,CACJ;MACN,YAAM,IAAI,EAAC,SAAS;QAChB,eAAQ,CACL;KACV,CAAC;EACN,CAAC;EAEO,UAAU;IACd,MAAM,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAEpC,IAAI,CAAC,IAAI,EAAE;MACP,OAAO;KACV;IAED,OAAO,kBAAY,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,GAAI,CAAC;EAChE,CAAC;EAEO,oBAAoB;IACxB,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;MACtB,OAAO;KACV;IAED,OAAO,CACH,YAAM,KAAK,EAAC,6BAA6B;MACpC,IAAI,CAAC,uBAAuB,EAAE;MAC9B,IAAI,CAAC,cAAc,CACjB,CACV,CAAC;EACN,CAAC;EAEO,uBAAuB;IAC3B,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE;MACzB,OAAO;KACV;IAED,OAAO,gBAAO,IAAI,CAAC,iBAAiB,CAAQ,CAAC;EACjD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\nimport { Icon } from '../../global/shared-types/icon.types';\nimport { getIconName } from '../icon/get-icon-props';\n\n/*\n A header is the top most visual element in a component, page, card, or a view.\n \n ## Usage\n * A header is the first thing that clarifies a context for users.\n * Due to their positions in the UI hierarchy, headers are the most\n * prominent elements of a user interface; and because of that, they carry both\n * vital information and fundamental controls for the area of the interface\n * they represent.\n \n For example, when a header is placed on top of a card, it should quickly\n * explain the card to the user. When placed on top of a modal, it should easily\n * clarify what the modal is about. When displayed on top of a fullscreen view,\n * it should indicate where in the system users are, and what part of the app\n * they are looking at.\n \n \n * ## Layout\n * The vital information in a header is usually manifested in form of an icon,\n * and a heading. A subheading also could be added to provide supplementary\n * information. There is also a third place for displaying supplementary information\n * or \"supporting text\", which will be rendered as a part of the subheading.\n * Along with this information, headers can also include actions, controls, or\n * menus.\n \n :::important\n * Such actions or menus must affect the entire section of the interface\n * which the header is representing. For example, a _Delete_ button on a card\n * header must delete that entire card and its respective contents all together,\n * not for example a selected item which is visible in the content of that card.\n * :::\n \n \n * :::warning\n * Do not user background color on icons in the headers. It is much better and\n * much easier for the eye if your icon itself has a color.\n * Background colors behind icons make them look like \"call to action\" buttons\n * and take a lot of attention from users.\n * :::\n \n @exampleComponent limel-example-header\n * @exampleComponent limel-example-header-slot-actions\n * @exampleComponent limel-example-header-colors\n * @exampleComponent limel-example-header-responsive\n * @exampleComponent limel-example-header-narrow\n * @slot actions - Content (actions) to be put inside the far right surface of\n * the header\n * @slot [no name] - DEPRECATED. The `actions` slot used to be unnamed. This\n * behavior has been deprecated, and support will be dropped in a future\n * version. Please add `slot=\"actions\"` to your elements to ensure your code\n * will continue to work with future versions of Lime Elements.\n /\n@Component({\n tag: 'limel-header',\n shadow: true,\n styleUrl: 'header.scss',\n})\nexport class Header {\n /\n Icon to display\n /\n @Prop()\n public icon?: string \| Icon;\n\n /\n Title to display\n /\n @Prop()\n public heading?: string;\n\n /\n Subheading to display\n /\n @Prop()\n public subheading?: string;\n\n /\n An extra string of text to display along with with the Subheading\n /\n @Prop()\n public supportingText?: string;\n\n /\n The visual divider that separates the `subheading` and the `supportingText`.\n * It must be a single character such as `-` or `,`.\n */\n @Prop()\n public subheadingDivider?: string = '·';\n\n public render() {\n return [\n <div class=\"information\">\n {this.renderIcon()}\n <div class=\"headings\">\n <h1 class=\"heading\" title={this.heading}>\n {this.heading}\n </h1>\n <h2 class=\"subheading\" title={this.subheading}>\n {this.subheading}\n {this.renderSupportingText()}\n </h2>\n </div>\n </div>,\n <slot name=\"actions\">\n <slot />\n </slot>,\n ];\n }\n\n private renderIcon() {\n const icon = getIconName(this.icon);\n\n if (!icon) {\n return;\n }\n\n return <limel-icon class=\"icon\" badge={true} name={icon} />;\n }\n\n private renderSupportingText() {\n if (!this.supportingText) {\n return;\n }\n\n return (\n <span class=\"subheading__supporting-text\">\n {this.renderSubheadingDivider()}\n {this.supportingText}\n </span>\n );\n }\n\n private renderSubheadingDivider() {\n if (!this.subheadingDivider) {\n return;\n }\n\n return <span>{this.subheadingDivider}</span>;\n }\n}\n"]}

package/dist/collection/components/help/help-content.js CHANGED Viewed

@@ -66,7 +66,7 @@ export class HelpContent {
           "references": {
             "Link": {
               "location": "import",
-              "path": "../../interface"
+              "path": "../../global/shared-types/link.types"
             }
           }
         },

package/dist/collection/components/help/help-content.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"help-content.js","sourceRoot":"","sources":["../../../src/components/help/help-content.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAGnD;;;;;;;;GAQG;AAMH,MAAM,OAAO,WAAW;;IAcZ,uBAAkB,GAAG,GAAG,EAAE;;MAC9B,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;QACpB,OAAO;OACV;MAED,OAAO,CACH;QACI,SACI,IAAI,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,EAC7B,MAAM,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,MAAM,EACjC,KAAK,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,KAAK,EAC/B,QAAQ,EAAC,GAAG,IAEX,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CACxB,CACD,CACV,CAAC;IACN,CAAC,CAAC;;;;EAxBK,MAAM;IACT,OAAO;MACH,sBAAgB,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI;MACrC,IAAI,CAAC,kBAAkB,EAAE;KAC5B,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoBJ","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { Link } from '../../~~interface~~';\n\n/*\n Help content\n * This is scrollable content that is placed in the popover of the Help component.\n * Moved here mostly to avoid having inlined styles in the parent component.\n * Since you cannot send styles to the Portal component, we need to have this\n * child component.\n \n @private\n */\n@Component({\n tag: 'limel-help-content',\n shadow: true,\n styleUrl: 'limel-help-content.scss',\n})\nexport class HelpContent {\n @Prop()\n public value: string;\n\n @Prop()\n public readMoreLink?: Link;\n\n public render() {\n return [\n <limel-markdown value={this.value} />,\n this.renderReadMoreLink(),\n ];\n }\n\n private renderReadMoreLink = () => {\n if (!this.readMoreLink) {\n return;\n }\n\n return (\n <span>\n <a\n href={this.readMoreLink?.href}\n target={this.readMoreLink?.target}\n title={this.readMoreLink?.title}\n tabindex=\"0\"\n >\n {this.readMoreLink?.text}\n </a>\n </span>\n );\n };\n}\n"]}
1	+ {"version":3,"file":"help-content.js","sourceRoot":"","sources":["../../../src/components/help/help-content.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAGnD;;;;;;;;GAQG;AAMH,MAAM,OAAO,WAAW;;IAcZ,uBAAkB,GAAG,GAAG,EAAE;;MAC9B,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;QACpB,OAAO;OACV;MAED,OAAO,CACH;QACI,SACI,IAAI,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,EAC7B,MAAM,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,MAAM,EACjC,KAAK,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,KAAK,EAC/B,QAAQ,EAAC,GAAG,IAEX,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,CACxB,CACD,CACV,CAAC;IACN,CAAC,CAAC;;;;EAxBK,MAAM;IACT,OAAO;MACH,sBAAgB,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI;MACrC,IAAI,CAAC,kBAAkB,EAAE;KAC5B,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoBJ","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { Link } from '../../global/shared-types/link.types';\n\n/*\n Help content\n * This is scrollable content that is placed in the popover of the Help component.\n * Moved here mostly to avoid having inlined styles in the parent component.\n * Since you cannot send styles to the Portal component, we need to have this\n * child component.\n \n @private\n */\n@Component({\n tag: 'limel-help-content',\n shadow: true,\n styleUrl: 'limel-help-content.scss',\n})\nexport class HelpContent {\n @Prop()\n public value: string;\n\n @Prop()\n public readMoreLink?: Link;\n\n public render() {\n return [\n <limel-markdown value={this.value} />,\n this.renderReadMoreLink(),\n ];\n }\n\n private renderReadMoreLink = () => {\n if (!this.readMoreLink) {\n return;\n }\n\n return (\n <span>\n <a\n href={this.readMoreLink?.href}\n target={this.readMoreLink?.target}\n title={this.readMoreLink?.title}\n tabindex=\"0\"\n >\n {this.readMoreLink?.text}\n </a>\n </span>\n );\n };\n}\n"]}

package/dist/collection/components/help/help.js CHANGED Viewed

@@ -101,7 +101,7 @@ export class HelpComponent {
           "references": {
             "Link": {
               "location": "import",
-              "path": "../../interface"
+              "path": "../../global/shared-types/link.types"
             }
           }
         },

package/dist/collection/components/help/help.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"help.js","sourceRoot":"","sources":["../../../src/components/help/help.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;~~AAI1D~~;;;;;;;;;;;;;;;;;;;;GAoBG;AAMH,MAAM,OAAO,aAAa;;IAoDd,gBAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;MACxC,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;IACvB,CAAC,CAAC;IAEM,mBAAc,GAAG,CAAC,KAAkB,EAAE,EAAE;MAC5C,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;IACxB,CAAC,CAAC;;mBAjDuB,GAAG;;yBAYU,WAAW;kBAGhC,KAAK;;EAEf,MAAM;IACT,OAAO;MACH,qBACI,IAAI,EAAE,IAAI,CAAC,MAAM,EACjB,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,aAAa,EAAE,IAAI,CAAC,aAAa;QAEjC,cACI,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE;YACH,SAAS,EAAE,IAAI,CAAC,MAAM;WACzB,IAEA,IAAI,CAAC,OAAO,CACR;QACT,0BACI,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,YAAY,EAAE,IAAI,CAAC,YAAY,GACjC,CACU;KACnB,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAWJ","sourcesContent":["import { Component, h, Prop, State } from '@stencil/core';\nimport { OpenDirection } from '../menu/menu.types';\nimport { Help, Link } from '../../~~interface~~';\n\n/*\n A good design is self-explanatory! However, sometimes concepts are\n * too complex to understand, no matter how well-designed a user interface is.\n * In such cases, contextual help can be a great way to provide users with\n * help precisely where and when users need it.\n \n In app interface design, providing contextual help emerges as a viable practice\n * for enhancing user experience and usability.\n * Contextual help serves as a quick-to-access guiding,\n * empowering users to more easily understand and navigate through\n * the intricacies of an application.\n \n Using this component designers empower users to grasp the functionality\n * of an app more effortlessly, minimizes the learning curve,\n * transforming complex features into accessible opportunities for exploration.\n \n @exampleComponent limel-example-help\n * @exampleComponent limel-example-read-more\n * @exampleComponent limel-example-open-direction\n * @exampleComponent limel-example-placement\n /\n@Component({\n tag: 'limel-help',\n shadow: true,\n styleUrl: 'help.scss',\n})\nexport class HelpComponent implements Help {\n /\n {@inheritdoc Help.value}\n /\n @Prop()\n public value: string;\n\n /\n {@inheritdoc Help.trigger}\n /\n @Prop()\n public trigger: string = '?';\n\n /\n {@inheritdoc Help.readMoreLink}\n /\n @Prop()\n public readMoreLink?: Link;\n\n /\n {@inheritdoc Help.openDirection}\n */\n @Prop({ reflect: true })\n public openDirection: OpenDirection = 'top-start';\n\n @State()\n private isOpen = false;\n\n public render() {\n return [\n <limel-popover\n open={this.isOpen}\n onClose={this.onPopoverClose}\n openDirection={this.openDirection}\n >\n <button\n slot=\"trigger\"\n onClick={this.openPopover}\n class={{\n 'is-open': this.isOpen,\n }}\n >\n {this.trigger}\n </button>\n <limel-help-content\n value={this.value}\n readMoreLink={this.readMoreLink}\n />\n </limel-popover>,\n ];\n }\n\n private openPopover = (event: MouseEvent) => {\n event.stopPropagation();\n this.isOpen = true;\n };\n\n private onPopoverClose = (event: CustomEvent) => {\n event.stopPropagation();\n this.isOpen = false;\n };\n}\n"]}
1	+ {"version":3,"file":"help.js","sourceRoot":"","sources":["../../../src/components/help/help.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAK1D;;;;;;;;;;;;;;;;;;;;GAoBG;AAMH,MAAM,OAAO,aAAa;;IAoDd,gBAAW,GAAG,CAAC,KAAiB,EAAE,EAAE;MACxC,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;IACvB,CAAC,CAAC;IAEM,mBAAc,GAAG,CAAC,KAAkB,EAAE,EAAE;MAC5C,KAAK,CAAC,eAAe,EAAE,CAAC;MACxB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;IACxB,CAAC,CAAC;;mBAjDuB,GAAG;;yBAYU,WAAW;kBAGhC,KAAK;;EAEf,MAAM;IACT,OAAO;MACH,qBACI,IAAI,EAAE,IAAI,CAAC,MAAM,EACjB,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,aAAa,EAAE,IAAI,CAAC,aAAa;QAEjC,cACI,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE;YACH,SAAS,EAAE,IAAI,CAAC,MAAM;WACzB,IAEA,IAAI,CAAC,OAAO,CACR;QACT,0BACI,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,YAAY,EAAE,IAAI,CAAC,YAAY,GACjC,CACU;KACnB,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAWJ","sourcesContent":["import { Component, h, Prop, State } from '@stencil/core';\nimport { OpenDirection } from '../menu/menu.types';\nimport { Help } from '../help/help.types';\nimport { Link } from '../../global/shared-types/link.types';\n\n/*\n A good design is self-explanatory! However, sometimes concepts are\n * too complex to understand, no matter how well-designed a user interface is.\n * In such cases, contextual help can be a great way to provide users with\n * help precisely where and when users need it.\n \n In app interface design, providing contextual help emerges as a viable practice\n * for enhancing user experience and usability.\n * Contextual help serves as a quick-to-access guiding,\n * empowering users to more easily understand and navigate through\n * the intricacies of an application.\n \n Using this component designers empower users to grasp the functionality\n * of an app more effortlessly, minimizes the learning curve,\n * transforming complex features into accessible opportunities for exploration.\n \n @exampleComponent limel-example-help\n * @exampleComponent limel-example-read-more\n * @exampleComponent limel-example-open-direction\n * @exampleComponent limel-example-placement\n /\n@Component({\n tag: 'limel-help',\n shadow: true,\n styleUrl: 'help.scss',\n})\nexport class HelpComponent implements Help {\n /\n {@inheritdoc Help.value}\n /\n @Prop()\n public value: string;\n\n /\n {@inheritdoc Help.trigger}\n /\n @Prop()\n public trigger: string = '?';\n\n /\n {@inheritdoc Help.readMoreLink}\n /\n @Prop()\n public readMoreLink?: Link;\n\n /\n {@inheritdoc Help.openDirection}\n */\n @Prop({ reflect: true })\n public openDirection: OpenDirection = 'top-start';\n\n @State()\n private isOpen = false;\n\n public render() {\n return [\n <limel-popover\n open={this.isOpen}\n onClose={this.onPopoverClose}\n openDirection={this.openDirection}\n >\n <button\n slot=\"trigger\"\n onClick={this.openPopover}\n class={{\n 'is-open': this.isOpen,\n }}\n >\n {this.trigger}\n </button>\n <limel-help-content\n value={this.value}\n readMoreLink={this.readMoreLink}\n />\n </limel-popover>,\n ];\n }\n\n private openPopover = (event: MouseEvent) => {\n event.stopPropagation();\n this.isOpen = true;\n };\n\n private onPopoverClose = (event: CustomEvent) => {\n event.stopPropagation();\n this.isOpen = false;\n };\n}\n"]}

package/dist/collection/components/help/help.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"help.types.js","sourceRoot":"","sources":["../../../src/components/help/help.types.ts"],"names":[],"mappings":"","sourcesContent":["import { OpenDirection } from '../menu/menu.types';\nimport { Link } from '../../~~interface~~';\n\nexport interface Help {\n /*\n Decides the popover's location in relation to the trigger.\n /\n openDirection: OpenDirection;\n\n /\n If supplied, it will render a \"Read more\" link at the bottom of the content.\n * Even though you can add a link anywhere in the content, it is recommended to\n * use the read more link. Because it will always be displayed at the bottom\n * of the popover after the content, does not scroll away with the content,\n * and it will be styled in a consistent way.\n /\n readMoreLink?: Link;\n\n /\n Visualizes the trigger element. Defaults to: ?\n * :::important\n * Be consistent across the product if you want to change it to a custom character.\n * All instances of the help component should have the same trigger visualization.\n * :::\n /\n trigger: string;\n\n /\n The markdown content that will be displayed in the popover.\n */\n value: string;\n}\n"]}
1	+ {"version":3,"file":"help.types.js","sourceRoot":"","sources":["../../../src/components/help/help.types.ts"],"names":[],"mappings":"","sourcesContent":["import { OpenDirection } from '../menu/menu.types';\nimport { Link } from '../../global/shared-types/link.types';\n\n/*\n This interface represents the properties that can be passed to the\n * `limel-help` component.\n \n @public\n /\nexport interface Help {\n /\n Decides the popover's location in relation to the trigger.\n /\n openDirection: OpenDirection;\n\n /\n If supplied, it will render a \"Read more\" link at the bottom of the content.\n * Even though you can add a link anywhere in the content, it is recommended to\n * use the read more link. Because it will always be displayed at the bottom\n * of the popover after the content, does not scroll away with the content,\n * and it will be styled in a consistent way.\n /\n readMoreLink?: Link;\n\n /\n Visualizes the trigger element. Defaults to: ?\n * :::important\n * Be consistent across the product if you want to change it to a custom character.\n * All instances of the help component should have the same trigger visualization.\n * :::\n /\n trigger: string;\n\n /\n The markdown content that will be displayed in the popover.\n */\n value: string;\n}\n"]}

package/dist/collection/components/icon/get-icon-props.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"get-icon-props.js","sourceRoot":"","sources":["../../../src/components/icon/get-icon-props.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AACH,MAAM,UAAU,WAAW,CACvB,IAA+B;EAE/B,IAAI,CAAC,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,MAAM,IAAI,IAAI,EAAE;IACtD,OAAO,IAAI,CAAC,IAAI,CAAC;GACpB;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,IAAI,CAAC;GACf;EAED,OAAO,SAAS,CAAC;AACrB,CAAC;AAED;;;;;;;;;;GAUG;AACH,MAAM,UAAU,YAAY,CACxB,IAA+B,EAC/B,SAA8B;EAE9B,IAAI,CAAC,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,OAAO,IAAI,IAAI,EAAE;IACvD,OAAO,IAAI,CAAC,KAAK,CAAC;GACrB;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,SAAS,CAAC;GACpB;EAED,OAAO,SAAS,CAAC;AACrB,CAAC;AAED;;;;;;;;;;GAUG;AACH,MAAM,UAAU,gBAAgB,CAC5B,IAA+B,EAC/B,aAAkC;EAElC,IAAI,CAAC,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,OAAO,IAAI,IAAI,EAAE;IACvD,OAAO,IAAI,CAAC,KAAK,CAAC;GACrB;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,aAAa,CAAC;GACxB;EAED,OAAO,SAAS,CAAC;AACrB,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,UAAU,sBAAsB,CAClC,IAA+B,EAC/B,mBAAwC;EAExC,IAAI,CAAC,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,iBAAiB,IAAI,IAAI,EAAE;IACjE,OAAO,IAAI,CAAC,eAAe,CAAC;GAC/B;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,mBAAmB,CAAC;GAC9B;EAED,OAAO,SAAS,CAAC;AACrB,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAU,YAAY,CACxB,IAA+B,EAC/B,SAA8B;EAE9B,IAAI,CAAC,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,OAAO,IAAI,IAAI,EAAE;IACvD,OAAO,IAAI,CAAC,KAAK,CAAC;GACrB;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,SAAS,CAAC;GACpB;EAED,OAAO,SAAS,CAAC;AACrB,CAAC","sourcesContent":["import { Icon } from '../../~~interface~~';\n\n/*\n Get the icon name.\n * This helps in setting the right icon, both if the consumer only types `icon: string`,\n * and if they use the `Icon` interface for writing the icon name.\n \n @param icon - The icon to retrieve the name from.\n * @returns - The icon name or the provided string, or `undefined` if `icon` is falsy.\n /\nexport function getIconName(\n icon: string \| Icon \| undefined,\n): string \| undefined {\n if (!!icon && typeof icon === 'object' && 'name' in icon) {\n return icon.name;\n }\n\n if (typeof icon === 'string') {\n return icon;\n }\n\n return undefined;\n}\n\n/\n Get the icon color.\n * This is added because the old way of specifying `iconColor`\n * deprecated in our components. So consumers should now use the new\n * `Icon` interface instead. But our components must still support the\n * old way of writing `iconColor: string`.\n \n @param icon - The icon to retrieve the color from.\n * @param iconColor - The color to use when the deprecated `iconColor` is used.\n * @returns - The icon color or the provided color string, or `undefined` if `iconColor` is falsy.\n /\nexport function getIconColor(\n icon: string \| Icon \| undefined,\n iconColor?: string \| undefined,\n): string \| undefined {\n if (!!icon && typeof icon === 'object' && 'color' in icon) {\n return icon.color;\n }\n\n if (typeof icon === 'string') {\n return iconColor;\n }\n\n return undefined;\n}\n\n/\n Get the icon color.\n * This is added because the old way of specifying `iconFillColor` is\n * deprecated in our components. So consumers should now use the new\n * `Icon` interface instead. But our components must still support the\n * old way of writing `iconFillColor: string`.\n \n @param icon - The icon to retrieve the color from.\n * @param iconFillColor - The color to use when `iconFillColor` is used.\n * @returns - The icon color or the provided color string, or `undefined` if `iconColor` is falsy.\n /\nexport function getIconFillColor(\n icon: string \| Icon \| undefined,\n iconFillColor?: string \| undefined,\n): string \| undefined {\n if (!!icon && typeof icon === 'object' && 'color' in icon) {\n return icon.color;\n }\n\n if (typeof icon === 'string') {\n return iconFillColor;\n }\n\n return undefined;\n}\n\n/\n Get the icon background color.\n * This function is used to retrieve the background color associated with an icon,\n * whether provided as a string or using the `Icon` interface.\n \n @param icon - The icon to retrieve the background color from.\n * @param iconBackgroundColor - The background color to use when provided explicitly.\n * @returns - The icon background color or the provided background color string, or `undefined` if `iconBackgroundColor` is falsy.\n /\nexport function getIconBackgroundColor(\n icon: string \| Icon \| undefined,\n iconBackgroundColor?: string \| undefined,\n): string \| undefined {\n if (!!icon && typeof icon === 'object' && 'backgroundColor' in icon) {\n return icon.backgroundColor;\n }\n\n if (typeof icon === 'string') {\n return iconBackgroundColor;\n }\n\n return undefined;\n}\n\n/\n Get the icon title.\n * This function is used to retrieve the title associated with an icon, whether provided as a string or using the `Icon` interface.\n \n @param icon - The icon to retrieve the title from.\n * @param iconTitle - The title to use when provided explicitly.\n * @returns - The icon title or the provided title string, or `undefined` if `iconTitle` is falsy.\n */\nexport function getIconTitle(\n icon: string \| Icon \| undefined,\n iconTitle?: string \| undefined,\n): string \| undefined {\n if (!!icon && typeof icon === 'object' && 'title' in icon) {\n return icon.title;\n }\n\n if (typeof icon === 'string') {\n return iconTitle;\n }\n\n return undefined;\n}\n"]}
1	+ {"version":3,"file":"get-icon-props.js","sourceRoot":"","sources":["../../../src/components/icon/get-icon-props.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AACH,MAAM,UAAU,WAAW,CACvB,IAA+B;EAE/B,IAAI,CAAC,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,MAAM,IAAI,IAAI,EAAE;IACtD,OAAO,IAAI,CAAC,IAAI,CAAC;GACpB;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,IAAI,CAAC;GACf;EAED,OAAO,SAAS,CAAC;AACrB,CAAC;AAED;;;;;;;;;;GAUG;AACH,MAAM,UAAU,YAAY,CACxB,IAA+B,EAC/B,SAA8B;EAE9B,IAAI,CAAC,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,OAAO,IAAI,IAAI,EAAE;IACvD,OAAO,IAAI,CAAC,KAAK,CAAC;GACrB;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,SAAS,CAAC;GACpB;EAED,OAAO,SAAS,CAAC;AACrB,CAAC;AAED;;;;;;;;;;GAUG;AACH,MAAM,UAAU,gBAAgB,CAC5B,IAA+B,EAC/B,aAAkC;EAElC,IAAI,CAAC,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,OAAO,IAAI,IAAI,EAAE;IACvD,OAAO,IAAI,CAAC,KAAK,CAAC;GACrB;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,aAAa,CAAC;GACxB;EAED,OAAO,SAAS,CAAC;AACrB,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,UAAU,sBAAsB,CAClC,IAA+B,EAC/B,mBAAwC;EAExC,IAAI,CAAC,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,iBAAiB,IAAI,IAAI,EAAE;IACjE,OAAO,IAAI,CAAC,eAAe,CAAC;GAC/B;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,mBAAmB,CAAC;GAC9B;EAED,OAAO,SAAS,CAAC;AACrB,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAU,YAAY,CACxB,IAA+B,EAC/B,SAA8B;EAE9B,IAAI,CAAC,CAAC,IAAI,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,OAAO,IAAI,IAAI,EAAE;IACvD,OAAO,IAAI,CAAC,KAAK,CAAC;GACrB;EAED,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE;IAC1B,OAAO,SAAS,CAAC;GACpB;EAED,OAAO,SAAS,CAAC;AACrB,CAAC","sourcesContent":["import { Icon } from '../../global/shared-types/icon.types';\n\n/*\n Get the icon name.\n * This helps in setting the right icon, both if the consumer only types `icon: string`,\n * and if they use the `Icon` interface for writing the icon name.\n \n @param icon - The icon to retrieve the name from.\n * @returns - The icon name or the provided string, or `undefined` if `icon` is falsy.\n /\nexport function getIconName(\n icon: string \| Icon \| undefined,\n): string \| undefined {\n if (!!icon && typeof icon === 'object' && 'name' in icon) {\n return icon.name;\n }\n\n if (typeof icon === 'string') {\n return icon;\n }\n\n return undefined;\n}\n\n/\n Get the icon color.\n * This is added because the old way of specifying `iconColor`\n * deprecated in our components. So consumers should now use the new\n * `Icon` interface instead. But our components must still support the\n * old way of writing `iconColor: string`.\n \n @param icon - The icon to retrieve the color from.\n * @param iconColor - The color to use when the deprecated `iconColor` is used.\n * @returns - The icon color or the provided color string, or `undefined` if `iconColor` is falsy.\n /\nexport function getIconColor(\n icon: string \| Icon \| undefined,\n iconColor?: string \| undefined,\n): string \| undefined {\n if (!!icon && typeof icon === 'object' && 'color' in icon) {\n return icon.color;\n }\n\n if (typeof icon === 'string') {\n return iconColor;\n }\n\n return undefined;\n}\n\n/\n Get the icon color.\n * This is added because the old way of specifying `iconFillColor` is\n * deprecated in our components. So consumers should now use the new\n * `Icon` interface instead. But our components must still support the\n * old way of writing `iconFillColor: string`.\n \n @param icon - The icon to retrieve the color from.\n * @param iconFillColor - The color to use when `iconFillColor` is used.\n * @returns - The icon color or the provided color string, or `undefined` if `iconColor` is falsy.\n /\nexport function getIconFillColor(\n icon: string \| Icon \| undefined,\n iconFillColor?: string \| undefined,\n): string \| undefined {\n if (!!icon && typeof icon === 'object' && 'color' in icon) {\n return icon.color;\n }\n\n if (typeof icon === 'string') {\n return iconFillColor;\n }\n\n return undefined;\n}\n\n/\n Get the icon background color.\n * This function is used to retrieve the background color associated with an icon,\n * whether provided as a string or using the `Icon` interface.\n \n @param icon - The icon to retrieve the background color from.\n * @param iconBackgroundColor - The background color to use when provided explicitly.\n * @returns - The icon background color or the provided background color string, or `undefined` if `iconBackgroundColor` is falsy.\n /\nexport function getIconBackgroundColor(\n icon: string \| Icon \| undefined,\n iconBackgroundColor?: string \| undefined,\n): string \| undefined {\n if (!!icon && typeof icon === 'object' && 'backgroundColor' in icon) {\n return icon.backgroundColor;\n }\n\n if (typeof icon === 'string') {\n return iconBackgroundColor;\n }\n\n return undefined;\n}\n\n/\n Get the icon title.\n * This function is used to retrieve the title associated with an icon, whether provided as a string or using the `Icon` interface.\n \n @param icon - The icon to retrieve the title from.\n * @param iconTitle - The title to use when provided explicitly.\n * @returns - The icon title or the provided title string, or `undefined` if `iconTitle` is falsy.\n */\nexport function getIconTitle(\n icon: string \| Icon \| undefined,\n iconTitle?: string \| undefined,\n): string \| undefined {\n if (!!icon && typeof icon === 'object' && 'title' in icon) {\n return icon.title;\n }\n\n if (typeof icon === 'string') {\n return iconTitle;\n }\n\n return undefined;\n}\n"]}

package/dist/collection/components/icon-button/icon-button.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { h, Host } from '@stencil/core';
-import { makeEnterClickable, removeEnterClickable, } from 'src/util/make-enter-clickable';
+import { makeEnterClickable, removeEnterClickable, } from '../../util/make-enter-clickable';
 import { createRandomString } from '../../util/random-string';
 /**
  * @exampleComponent limel-example-icon-button-basic

package/dist/collection/components/icon-button/icon-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../../src/components/icon-button/icon-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EACH,kBAAkB,EAClB,oBAAoB,GACvB,MAAM~~,+BAA+B~~,CAAC;~~AACvC~~,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAE9D;;;;;;GAMG;AAMH,MAAM,OAAO,UAAU;;IA6CX,cAAS,GAAG,kBAAkB,EAAE,CAAC;IAmCjC,4BAAuB,GAAG,CAAC,CAAC,EAAE,EAAE;MACpC,IAAI,IAAI,CAAC,QAAQ,EAAE;QACf,CAAC,CAAC,cAAc,EAAE,CAAC;OACtB;IACL,CAAC,CAAC;;oBAxEgB,KAAK;;oBAYL,KAAK;;EAKhB,iBAAiB;IACpB,IAAI,CAAC,UAAU,EAAE,CAAC;EACtB,CAAC;EAEM,iBAAiB;IACpB,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EAClC,CAAC;EAEM,oBAAoB;IACvB,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EACpC,CAAC;EAEM,gBAAgB;IACnB,IAAI,CAAC,UAAU,EAAE,CAAC;EACtB,CAAC;EAIO,UAAU;IACd,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;IACvE,IAAI,CAAC,OAAO,EAAE;MACV,OAAO;KACV;EACL,CAAC;EAEM,MAAM;IACT,MAAM,gBAAgB,GAA0B,EAAE,CAAC;IAEnD,IAAI,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,EAAE;MACpC,gBAAgB,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;KAClE;IAED,OAAO,CACH,EAAC,IAAI,IAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB;MACvC,4BACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,IAAI,CAAC,SAAS,IACd,gBAAgB;QAEpB,kBAAY,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,GAAI;QAC3C,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,CAC9B,CACN,CACV,CAAC;EACN,CAAC;EACO,aAAa,CAAC,SAAS;IAC3B,IAAI,IAAI,CAAC,KAAK,EAAE;MACZ,OAAO,qBAAe,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CAAC;KACrE;EACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOJ","sourcesContent":["import { Component, Element, h, Host, Prop } from '@stencil/core';\nimport {\n makeEnterClickable,\n removeEnterClickable,\n} from '~~src/~~util/make-enter-clickable';\nimport { createRandomString } from '../../util/random-string';\n\n/*\n @exampleComponent limel-example-icon-button-basic\n * @exampleComponent limel-example-icon-button-disabled\n * @exampleComponent limel-example-icon-button-elevated\n * @exampleComponent limel-example-icon-button-toggle-state\n * @exampleComponent limel-example-icon-button-composite\n /\n@Component({\n tag: 'limel-icon-button',\n shadow: true,\n styleUrl: 'icon-button.scss',\n})\nexport class IconButton {\n /\n The icon to display.\n /\n @Prop({ reflect: true })\n public icon: string;\n\n /\n Set to `true` to give the button our standard \"elevated\" look, lifting\n * it off the flat layout.\n /\n @Prop({ reflect: true })\n public elevated = false;\n\n /\n The text to show to screenreaders and other assistive tech.\n /\n @Prop({ reflect: true })\n public label: string;\n\n /\n Set to `true` to disable the button.\n */\n @Prop({ reflect: true })\n public disabled = false;\n\n @Element()\n private host: HTMLLimelIconButtonElement;\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentWillLoad() {\n makeEnterClickable(this.host);\n }\n\n public disconnectedCallback() {\n removeEnterClickable(this.host);\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n private tooltipId = createRandomString();\n\n private initialize() {\n const element = this.host.shadowRoot.querySelector('.mdc-icon-button');\n if (!element) {\n return;\n }\n }\n\n public render() {\n const buttonAttributes: { tabindex?: string } = {};\n\n if (this.host.hasAttribute('tabindex')) {\n buttonAttributes.tabindex = this.host.getAttribute('tabindex');\n }\n\n return (\n <Host onClick={this.filterClickWhenDisabled}>\n <button\n disabled={this.disabled}\n id={this.tooltipId}\n {...buttonAttributes}\n >\n <limel-icon name={this.icon} badge={true} />\n {this.renderTooltip(this.tooltipId)}\n </button>\n </Host>\n );\n }\n private renderTooltip(tooltipId) {\n if (this.label) {\n return <limel-tooltip elementId={tooltipId} label={this.label} />;\n }\n }\n\n private filterClickWhenDisabled = (e) => {\n if (this.disabled) {\n e.preventDefault();\n }\n };\n}\n"]}
1	+ {"version":3,"file":"icon-button.js","sourceRoot":"","sources":["../../../src/components/icon-button/icon-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAClE,OAAO,EACH,kBAAkB,EAClB,oBAAoB,GACvB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAE9D;;;;;;GAMG;AAMH,MAAM,OAAO,UAAU;;IA6CX,cAAS,GAAG,kBAAkB,EAAE,CAAC;IAmCjC,4BAAuB,GAAG,CAAC,CAAC,EAAE,EAAE;MACpC,IAAI,IAAI,CAAC,QAAQ,EAAE;QACf,CAAC,CAAC,cAAc,EAAE,CAAC;OACtB;IACL,CAAC,CAAC;;oBAxEgB,KAAK;;oBAYL,KAAK;;EAKhB,iBAAiB;IACpB,IAAI,CAAC,UAAU,EAAE,CAAC;EACtB,CAAC;EAEM,iBAAiB;IACpB,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EAClC,CAAC;EAEM,oBAAoB;IACvB,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EACpC,CAAC;EAEM,gBAAgB;IACnB,IAAI,CAAC,UAAU,EAAE,CAAC;EACtB,CAAC;EAIO,UAAU;IACd,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;IACvE,IAAI,CAAC,OAAO,EAAE;MACV,OAAO;KACV;EACL,CAAC;EAEM,MAAM;IACT,MAAM,gBAAgB,GAA0B,EAAE,CAAC;IAEnD,IAAI,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,EAAE;MACpC,gBAAgB,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;KAClE;IAED,OAAO,CACH,EAAC,IAAI,IAAC,OAAO,EAAE,IAAI,CAAC,uBAAuB;MACvC,4BACI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,IAAI,CAAC,SAAS,IACd,gBAAgB;QAEpB,kBAAY,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,GAAI;QAC3C,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,CAC9B,CACN,CACV,CAAC;EACN,CAAC;EACO,aAAa,CAAC,SAAS;IAC3B,IAAI,IAAI,CAAC,KAAK,EAAE;MACZ,OAAO,qBAAe,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CAAC;KACrE;EACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOJ","sourcesContent":["import { Component, Element, h, Host, Prop } from '@stencil/core';\nimport {\n makeEnterClickable,\n removeEnterClickable,\n} from '../../util/make-enter-clickable';\nimport { createRandomString } from '../../util/random-string';\n\n/*\n @exampleComponent limel-example-icon-button-basic\n * @exampleComponent limel-example-icon-button-disabled\n * @exampleComponent limel-example-icon-button-elevated\n * @exampleComponent limel-example-icon-button-toggle-state\n * @exampleComponent limel-example-icon-button-composite\n /\n@Component({\n tag: 'limel-icon-button',\n shadow: true,\n styleUrl: 'icon-button.scss',\n})\nexport class IconButton {\n /\n The icon to display.\n /\n @Prop({ reflect: true })\n public icon: string;\n\n /\n Set to `true` to give the button our standard \"elevated\" look, lifting\n * it off the flat layout.\n /\n @Prop({ reflect: true })\n public elevated = false;\n\n /\n The text to show to screenreaders and other assistive tech.\n /\n @Prop({ reflect: true })\n public label: string;\n\n /\n Set to `true` to disable the button.\n */\n @Prop({ reflect: true })\n public disabled = false;\n\n @Element()\n private host: HTMLLimelIconButtonElement;\n\n public connectedCallback() {\n this.initialize();\n }\n\n public componentWillLoad() {\n makeEnterClickable(this.host);\n }\n\n public disconnectedCallback() {\n removeEnterClickable(this.host);\n }\n\n public componentDidLoad() {\n this.initialize();\n }\n\n private tooltipId = createRandomString();\n\n private initialize() {\n const element = this.host.shadowRoot.querySelector('.mdc-icon-button');\n if (!element) {\n return;\n }\n }\n\n public render() {\n const buttonAttributes: { tabindex?: string } = {};\n\n if (this.host.hasAttribute('tabindex')) {\n buttonAttributes.tabindex = this.host.getAttribute('tabindex');\n }\n\n return (\n <Host onClick={this.filterClickWhenDisabled}>\n <button\n disabled={this.disabled}\n id={this.tooltipId}\n {...buttonAttributes}\n >\n <limel-icon name={this.icon} badge={true} />\n {this.renderTooltip(this.tooltipId)}\n </button>\n </Host>\n );\n }\n private renderTooltip(tooltipId) {\n if (this.label) {\n return <limel-tooltip elementId={tooltipId} label={this.label} />;\n }\n }\n\n private filterClickWhenDisabled = (e) => {\n if (this.disabled) {\n e.preventDefault();\n }\n };\n}\n"]}