@limetech/lime-elements 37.61.2 → 37.61.4

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 (50) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/dist/cjs/limel-form.cjs.entry.js +6 -0
  3. package/dist/cjs/limel-form.cjs.entry.js.map +1 -1
  4. package/dist/cjs/limel-icon_2.cjs.entry.js +17 -15
  5. package/dist/cjs/limel-icon_2.cjs.entry.js.map +1 -1
  6. package/dist/cjs/limel-info-tile.cjs.entry.js +1 -1
  7. package/dist/cjs/limel-info-tile.cjs.entry.js.map +1 -1
  8. package/dist/cjs/limel-markdown.cjs.entry.js +1 -1
  9. package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js +1 -1
  10. package/dist/cjs/{markdown-parser-23fa389f.js → markdown-parser-c4a1ec47.js} +6 -2
  11. package/dist/cjs/markdown-parser-c4a1ec47.js.map +1 -0
  12. package/dist/collection/components/form/adapters/widget-adapter.js +3 -0
  13. package/dist/collection/components/form/adapters/widget-adapter.js.map +1 -1
  14. package/dist/collection/components/form/fields/schema-field.js +3 -0
  15. package/dist/collection/components/form/fields/schema-field.js.map +1 -1
  16. package/dist/collection/components/info-tile/info-tile.js +1 -1
  17. package/dist/collection/components/info-tile/info-tile.js.map +1 -1
  18. package/dist/collection/components/portal/portal.js +17 -15
  19. package/dist/collection/components/portal/portal.js.map +1 -1
  20. package/dist/esm/limel-form.entry.js +6 -0
  21. package/dist/esm/limel-form.entry.js.map +1 -1
  22. package/dist/esm/limel-icon_2.entry.js +17 -15
  23. package/dist/esm/limel-icon_2.entry.js.map +1 -1
  24. package/dist/esm/limel-info-tile.entry.js +1 -1
  25. package/dist/esm/limel-info-tile.entry.js.map +1 -1
  26. package/dist/esm/limel-markdown.entry.js +1 -1
  27. package/dist/esm/limel-prosemirror-adapter.entry.js +1 -1
  28. package/dist/esm/{markdown-parser-4a4cd2c9.js → markdown-parser-108384e8.js} +6 -2
  29. package/dist/esm/markdown-parser-108384e8.js.map +1 -0
  30. package/dist/lime-elements/lime-elements.css +1 -1
  31. package/dist/lime-elements/lime-elements.esm.js +1 -1
  32. package/dist/lime-elements/p-5862b851.entry.js +2 -0
  33. package/dist/lime-elements/p-5862b851.entry.js.map +1 -0
  34. package/dist/lime-elements/{p-31ebf375.js → p-a7fca1dd.js} +2 -2
  35. package/dist/lime-elements/p-a7fca1dd.js.map +1 -0
  36. package/dist/lime-elements/{p-9bb104b1.entry.js → p-b852d3f5.entry.js} +2 -2
  37. package/dist/lime-elements/{p-9bb104b1.entry.js.map → p-b852d3f5.entry.js.map} +1 -1
  38. package/dist/lime-elements/{p-66bea69a.entry.js → p-c864b34b.entry.js} +2 -2
  39. package/dist/lime-elements/{p-66bea69a.entry.js.map → p-c864b34b.entry.js.map} +1 -1
  40. package/dist/lime-elements/{p-cd04c508.entry.js → p-df684b38.entry.js} +2 -2
  41. package/dist/lime-elements/{p-75cfe1e5.entry.js → p-ee74cfff.entry.js} +2 -2
  42. package/dist/types/components/portal/portal.d.ts +3 -1
  43. package/package.json +3 -3
  44. package/dist/cjs/markdown-parser-23fa389f.js.map +0 -1
  45. package/dist/esm/markdown-parser-4a4cd2c9.js.map +0 -1
  46. package/dist/lime-elements/p-31ebf375.js.map +0 -1
  47. package/dist/lime-elements/p-d7c6ba55.entry.js +0 -2
  48. package/dist/lime-elements/p-d7c6ba55.entry.js.map +0 -1
  49. /package/dist/lime-elements/{p-cd04c508.entry.js.map → p-df684b38.entry.js.map} +0 -0
  50. /package/dist/lime-elements/{p-75cfe1e5.entry.js.map → p-ee74cfff.entry.js.map} +0 -0
@@ -29,6 +29,9 @@ export class LimeElementsWidgetAdapter extends React.Component {
29
29
  if (Array.isArray(value)) {
30
30
  return !!value.length;
31
31
  }
32
+ if (value instanceof Date) {
33
+ return true;
34
+ }
32
35
  if (typeof value === 'object') {
33
36
  return !!Object.entries(value).length;
34
37
  }
@@ -1 +1 @@
1
- {"version":3,"file":"widget-adapter.js","sourceRoot":"","sources":["../../../../src/components/form/adapters/widget-adapter.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { WidgetProps } from '../widgets/types';\nimport { LimeElementsAdapter } from './base-adapter';\nimport { capitalize } from 'lodash-es';\nimport { getHelpComponent } from '../help';\n\ninterface WidgetAdapterProps {\n name: string;\n value?: any;\n widgetProps: WidgetProps;\n extraProps?: any;\n events?: { [key: string]: (event: any) => void };\n}\n\n/**\n * A widget is a concept in react-jsonschema-form (rjsf).\n * It represents a HTML tag for the user to enter data, eg. input, select, etc.\n *\n * We use the widget adapter exclusively so we can use lime-elements instead of the\n * default input/select/checkbox/etc fields that rjsf provides.\n *\n * Please read the docs for more info.\n * Link: https://react-jsonschema-form.readthedocs.io/\n */\nexport class LimeElementsWidgetAdapter extends React.Component {\n state = {\n modified: false,\n };\n\n constructor(public props: WidgetAdapterProps) {\n super(props);\n\n this.handleBlur = this.handleBlur.bind(this);\n }\n\n private hasValue() {\n const value = this.getValue();\n if (!value) {\n return false;\n }\n\n if (Array.isArray(value)) {\n return !!value.length;\n }\n\n if (typeof value === 'object') {\n return !!Object.entries(value).length;\n }\n\n return true;\n }\n\n private handleBlur() {\n this.setState({ modified: true });\n }\n\n private getLabel() {\n const { schema, label } = this.props.widgetProps;\n\n return label || schema.title;\n }\n\n private isInvalid() {\n const { modified } = this.state;\n const { rawErrors } = this.props.widgetProps;\n\n return (\n !!rawErrors && (modified || this.hasValue() || !this.isRequired())\n );\n }\n\n private isRequired() {\n const { required, schema } = this.props.widgetProps;\n\n return required || schema.minItems > 0;\n }\n\n private getHelperText() {\n const { rawErrors, schema } = this.props.widgetProps;\n\n if (!this.isInvalid()) {\n return schema.description;\n }\n\n if (rawErrors) {\n return capitalize(rawErrors[0]);\n }\n\n return schema.description;\n }\n\n private getValue() {\n const { value } = this.props;\n const { value: widgetValue } = this.props.widgetProps;\n\n // Use widgetValue unless its overriden in widget\n return value || widgetValue;\n }\n\n render() {\n const { name, events, extraProps } = this.props;\n const disabled = this.isDisabled();\n const value = this.getValue();\n const readonly = this.isReadOnly();\n\n const newEvents = {\n change: this.props.widgetProps.onChange,\n blur: this.handleBlur,\n ...events,\n };\n\n return React.createElement(\n React.Fragment,\n {},\n React.createElement(LimeElementsAdapter, {\n name: name,\n elementProps: {\n value: value,\n label: this.getLabel(),\n disabled: disabled,\n readonly: readonly,\n required: this.isRequired(),\n invalid: this.isInvalid(),\n 'helper-text': this.getHelperText(),\n ...extraProps,\n },\n events: newEvents,\n }),\n getHelpComponent(this.props.widgetProps.schema),\n );\n }\n\n private isDisabled() {\n const widgetProps = this.props.widgetProps;\n const options = widgetProps.schema.lime;\n\n return (\n widgetProps.disabled ||\n options?.disabled ||\n options?.component?.props?.disabled\n );\n }\n\n private isReadOnly() {\n const widgetProps = this.props.widgetProps;\n\n return widgetProps.readonly;\n }\n}\n"]}
1
+ {"version":3,"file":"widget-adapter.js","sourceRoot":"","sources":["../../../../src/components/form/adapters/widget-adapter.ts"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { WidgetProps } from '../widgets/types';\nimport { LimeElementsAdapter } from './base-adapter';\nimport { capitalize } from 'lodash-es';\nimport { getHelpComponent } from '../help';\n\ninterface WidgetAdapterProps {\n name: string;\n value?: any;\n widgetProps: WidgetProps;\n extraProps?: any;\n events?: { [key: string]: (event: any) => void };\n}\n\n/**\n * A widget is a concept in react-jsonschema-form (rjsf).\n * It represents a HTML tag for the user to enter data, eg. input, select, etc.\n *\n * We use the widget adapter exclusively so we can use lime-elements instead of the\n * default input/select/checkbox/etc fields that rjsf provides.\n *\n * Please read the docs for more info.\n * Link: https://react-jsonschema-form.readthedocs.io/\n */\nexport class LimeElementsWidgetAdapter extends React.Component {\n state = {\n modified: false,\n };\n\n constructor(public props: WidgetAdapterProps) {\n super(props);\n\n this.handleBlur = this.handleBlur.bind(this);\n }\n\n private hasValue() {\n const value = this.getValue();\n if (!value) {\n return false;\n }\n\n if (Array.isArray(value)) {\n return !!value.length;\n }\n\n if (value instanceof Date) {\n return true;\n }\n\n if (typeof value === 'object') {\n return !!Object.entries(value).length;\n }\n\n return true;\n }\n\n private handleBlur() {\n this.setState({ modified: true });\n }\n\n private getLabel() {\n const { schema, label } = this.props.widgetProps;\n\n return label || schema.title;\n }\n\n private isInvalid() {\n const { modified } = this.state;\n const { rawErrors } = this.props.widgetProps;\n\n return (\n !!rawErrors && (modified || this.hasValue() || !this.isRequired())\n );\n }\n\n private isRequired() {\n const { required, schema } = this.props.widgetProps;\n\n return required || schema.minItems > 0;\n }\n\n private getHelperText() {\n const { rawErrors, schema } = this.props.widgetProps;\n\n if (!this.isInvalid()) {\n return schema.description;\n }\n\n if (rawErrors) {\n return capitalize(rawErrors[0]);\n }\n\n return schema.description;\n }\n\n private getValue() {\n const { value } = this.props;\n const { value: widgetValue } = this.props.widgetProps;\n\n // Use widgetValue unless its overriden in widget\n return value || widgetValue;\n }\n\n render() {\n const { name, events, extraProps } = this.props;\n const disabled = this.isDisabled();\n const value = this.getValue();\n const readonly = this.isReadOnly();\n\n const newEvents = {\n change: this.props.widgetProps.onChange,\n blur: this.handleBlur,\n ...events,\n };\n\n return React.createElement(\n React.Fragment,\n {},\n React.createElement(LimeElementsAdapter, {\n name: name,\n elementProps: {\n value: value,\n label: this.getLabel(),\n disabled: disabled,\n readonly: readonly,\n required: this.isRequired(),\n invalid: this.isInvalid(),\n 'helper-text': this.getHelperText(),\n ...extraProps,\n },\n events: newEvents,\n }),\n getHelpComponent(this.props.widgetProps.schema),\n );\n }\n\n private isDisabled() {\n const widgetProps = this.props.widgetProps;\n const options = widgetProps.schema.lime;\n\n return (\n widgetProps.disabled ||\n options?.disabled ||\n options?.component?.props?.disabled\n );\n }\n\n private isReadOnly() {\n const widgetProps = this.props.widgetProps;\n\n return widgetProps.readonly;\n }\n}\n"]}
@@ -100,6 +100,9 @@ export class SchemaField extends React.Component {
100
100
  if (Array.isArray(value)) {
101
101
  return !!value.length;
102
102
  }
103
+ if (value instanceof Date) {
104
+ return true;
105
+ }
103
106
  if (typeof value === 'object') {
104
107
  return !isEmpty(value);
105
108
  }
@@ -1 +1 @@
1
- {"version":3,"file":"schema-field.js","sourceRoot":"","sources":["../../../../src/components/form/fields/schema-field.ts"],"names":[],"mappings":"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","sourcesContent":["import { LimeElementsAdapter } from '../adapters';\nimport JSONSchemaField from '@rjsf/core/lib/components/fields/SchemaField';\nimport React from 'react';\nimport { FieldProps } from './types';\nimport { isEmpty, capitalize } from 'lodash-es';\nimport { resetDependentFields } from './field-helpers';\nimport { FieldTemplate } from '../templates';\nimport { getHelpComponent } from '../help';\nimport { FormSchema } from '../form.types';\nimport { TimePicker } from '../widgets/time-picker';\n\n/**\n * If given a value and schema, check if the value should be translated\n * from null to undefined to avoid issues with validation\n *\n * This function needs to be used for several reasons:\n * 1. CustomEvent does not allow `detail` to equal `undefined`, but we can call onChange with `undefined` in React\n * 2. `null` is treated as a valid value in a jsonschema and with marshmallow and it has its own type (null)\n * 3. Without changing `null` to `undefined` there would be no way to remove a field from\n * from the submitted form data once it had any data. (when POSTing, undefined is not posted since its not valid json)\n * 4. The only applies to custom web components since widgets handle transforming null/'' to undefined depending on the widget\n * and its purpose.\n *\n * Example:\n * If I have an object `{ name?: string, email?: string }` that I am using a custom web component for `name`,\n * then initially, the formData will be `{}` which is fine because neither name or email are required. Then if i input a\n * value for name the formData will be `{ name: 'some_value' }` which is also fine. But then if I want to remove name\n * from the form data I would delete all the text from the name input field. Web components would emit this empty value\n * as '' or null. If the web component tries to emit `undefined`, null would be emitted instead because CustomEvent has\n * a default `detail` value of null\n *\n * @param value - the value associated with the schema\n * @param schema - the schema for the value\n * @returns whether or not null should be changed to undefined\n */\nconst shouldChangeToUndefined = (value, schema): boolean => {\n return value === null && !schema.type.includes('null');\n};\n\nconst hasCustomComponent = (schema): boolean => {\n const name = schema.lime?.component?.name;\n if (!name) {\n return false;\n }\n\n try {\n verifyCustomComponentIsDefined(name);\n } catch {\n // eslint-disable-next-line no-console\n console.warn(`Custom component ${name} not defined`);\n\n return false;\n }\n\n return true;\n};\n\nconst verifyCustomComponentIsDefined = (elementName): void => {\n const supportsCustomElements = 'customElements' in window;\n\n if (!supportsCustomElements) {\n throw new Error(\n 'Custom form elements are not supported by this browser!',\n );\n }\n\n if (!customElements.get(elementName)) {\n throw new Error(`Custom form element '${elementName}' is not defined!`);\n }\n};\n\nconst getCustomComponent = (\n schema,\n): { name: string; props: { [key: string]: any } } => {\n const name = schema.lime?.component?.name;\n const props = schema.lime?.component?.props || {};\n\n return { name: name, props: props };\n};\n\n/**\n * Create properties from the factory that is set on `limel-form`\n *\n * @param formContext - the form context\n * @param schema - the schema for the current field\n * @returns the properties created by the factory\n */\nexport function getFactoryProps(\n formContext: any,\n schema: FormSchema,\n): Record<string, any> {\n const factory: (schema: FormSchema) => Record<string, any> =\n formContext.propsFactory;\n if (typeof factory !== 'function') {\n return {};\n }\n\n const props = factory(schema);\n if (!props) {\n return {};\n }\n\n return props;\n}\n\nexport class SchemaField extends React.Component<FieldProps> {\n state = {\n modified: false,\n };\n\n constructor(props) {\n super(props);\n this.handleChange = this.handleChange.bind(this);\n this.handleCustomComponentChange =\n this.handleCustomComponentChange.bind(this);\n }\n\n private hasValue() {\n const value = this.getValue();\n if (!value) {\n return false;\n }\n\n if (Array.isArray(value)) {\n return !!value.length;\n }\n\n if (typeof value === 'object') {\n return !isEmpty(value);\n }\n\n return true;\n }\n\n private getLabel() {\n const { schema } = this.props;\n\n return schema.title;\n }\n\n private isInvalid() {\n const { modified } = this.state;\n const { errorSchema } = this.props;\n\n return (\n (modified || this.hasValue() || !this.isRequired()) &&\n !isEmpty(errorSchema)\n );\n }\n\n private isRequired() {\n const { required, schema } = this.props;\n\n return required || schema.minItems > 0;\n }\n\n private getHelperText() {\n const { errorSchema, schema } = this.props;\n\n if (!this.isInvalid()) {\n const helperText = schema.lime?.component?.props?.helperText;\n\n return helperText || schema.description;\n }\n\n if (!isEmpty(errorSchema) && '__errors' in errorSchema) {\n return capitalize(errorSchema.__errors[0]); // eslint-disable-line no-underscore-dangle\n }\n\n return schema.description;\n }\n\n private getValue() {\n const { formData } = this.props;\n\n return formData;\n }\n\n private handleCustomComponentChange(event) {\n const { schema } = this.props;\n event.stopPropagation();\n\n let value = event.detail;\n\n if (shouldChangeToUndefined(value, schema)) {\n value = undefined;\n }\n\n this.handleChange(value);\n }\n\n private handleChange(data) {\n const { formData, schema } = this.props;\n const { rootSchema } = this.props.registry;\n\n this.setState({ modified: true });\n\n const newData = resetDependentFields(\n formData,\n data,\n schema,\n rootSchema,\n );\n\n this.props.onChange(newData);\n }\n\n private buildCustomComponentProps() {\n const {\n disabled,\n readonly,\n name,\n registry,\n schema,\n errorSchema,\n idSchema,\n } = this.props;\n const factoryProps = getFactoryProps(registry.formContext, schema);\n\n return {\n ...factoryProps,\n value: this.getValue(),\n required: this.isRequired(),\n readonly: readonly || schema.readOnly,\n disabled: disabled,\n invalid: this.isInvalid(),\n label: this.getLabel(),\n helperText: this.getHelperText(),\n formInfo: {\n schema: schema,\n rootSchema: registry.formContext.schema,\n errorSchema: errorSchema,\n rootValue: registry.formContext.rootValue,\n name: name,\n schemaPath: this.getSchemaPath(idSchema?.$id),\n },\n };\n }\n\n private renderCustomComponent(props: FieldProps) {\n const { name, props: userDefinedComponentProps } = getCustomComponent(\n props.schema,\n );\n\n verifyCustomComponentIsDefined(name);\n\n const component = React.createElement(LimeElementsAdapter, {\n name: name,\n elementProps: {\n ...userDefinedComponentProps,\n ...this.buildCustomComponentProps(),\n },\n events: {\n change: this.handleCustomComponentChange,\n },\n });\n\n return React.createElement(\n FieldTemplate,\n {\n ...this.props,\n classNames: 'form-group field field-custom',\n },\n component,\n getHelpComponent(props.schema),\n );\n }\n\n render() {\n if (hasCustomComponent(this.props.schema)) {\n return this.renderCustomComponent(this.props);\n }\n\n const fieldProps = {\n ...this.props,\n onChange: this.handleChange,\n };\n\n if (this.props.schema.format === 'time') {\n fieldProps.uiSchema = {\n 'ui:widget': TimePicker,\n ...fieldProps.uiSchema,\n };\n }\n\n return React.createElement(JSONSchemaField, fieldProps);\n }\n\n /**\n * Gets the path to the current property within the schema\n *\n * @param schemaId - the id of the schema\n * @returns an array with the schema path for the current property\n * @example\n * const schemaId = 'root_sections_0_controls_0_name';\n * const schemaPath = getSchemaPath(schemaId);\n * // ➡ ['sections', '0', 'controls', '0', 'name']\n */\n private getSchemaPath(schemaId: string): string[] {\n if (schemaId === undefined) {\n return undefined;\n }\n\n return schemaId.replace('root_', '').split('_');\n }\n}\n"]}
1
+ {"version":3,"file":"schema-field.js","sourceRoot":"","sources":["../../../../src/components/form/fields/schema-field.ts"],"names":[],"mappings":"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","sourcesContent":["import { LimeElementsAdapter } from '../adapters';\nimport JSONSchemaField from '@rjsf/core/lib/components/fields/SchemaField';\nimport React from 'react';\nimport { FieldProps } from './types';\nimport { isEmpty, capitalize } from 'lodash-es';\nimport { resetDependentFields } from './field-helpers';\nimport { FieldTemplate } from '../templates';\nimport { getHelpComponent } from '../help';\nimport { FormSchema } from '../form.types';\nimport { TimePicker } from '../widgets/time-picker';\n\n/**\n * If given a value and schema, check if the value should be translated\n * from null to undefined to avoid issues with validation\n *\n * This function needs to be used for several reasons:\n * 1. CustomEvent does not allow `detail` to equal `undefined`, but we can call onChange with `undefined` in React\n * 2. `null` is treated as a valid value in a jsonschema and with marshmallow and it has its own type (null)\n * 3. Without changing `null` to `undefined` there would be no way to remove a field from\n * from the submitted form data once it had any data. (when POSTing, undefined is not posted since its not valid json)\n * 4. The only applies to custom web components since widgets handle transforming null/'' to undefined depending on the widget\n * and its purpose.\n *\n * Example:\n * If I have an object `{ name?: string, email?: string }` that I am using a custom web component for `name`,\n * then initially, the formData will be `{}` which is fine because neither name or email are required. Then if i input a\n * value for name the formData will be `{ name: 'some_value' }` which is also fine. But then if I want to remove name\n * from the form data I would delete all the text from the name input field. Web components would emit this empty value\n * as '' or null. If the web component tries to emit `undefined`, null would be emitted instead because CustomEvent has\n * a default `detail` value of null\n *\n * @param value - the value associated with the schema\n * @param schema - the schema for the value\n * @returns whether or not null should be changed to undefined\n */\nconst shouldChangeToUndefined = (value, schema): boolean => {\n return value === null && !schema.type.includes('null');\n};\n\nconst hasCustomComponent = (schema): boolean => {\n const name = schema.lime?.component?.name;\n if (!name) {\n return false;\n }\n\n try {\n verifyCustomComponentIsDefined(name);\n } catch {\n // eslint-disable-next-line no-console\n console.warn(`Custom component ${name} not defined`);\n\n return false;\n }\n\n return true;\n};\n\nconst verifyCustomComponentIsDefined = (elementName): void => {\n const supportsCustomElements = 'customElements' in window;\n\n if (!supportsCustomElements) {\n throw new Error(\n 'Custom form elements are not supported by this browser!',\n );\n }\n\n if (!customElements.get(elementName)) {\n throw new Error(`Custom form element '${elementName}' is not defined!`);\n }\n};\n\nconst getCustomComponent = (\n schema,\n): { name: string; props: { [key: string]: any } } => {\n const name = schema.lime?.component?.name;\n const props = schema.lime?.component?.props || {};\n\n return { name: name, props: props };\n};\n\n/**\n * Create properties from the factory that is set on `limel-form`\n *\n * @param formContext - the form context\n * @param schema - the schema for the current field\n * @returns the properties created by the factory\n */\nexport function getFactoryProps(\n formContext: any,\n schema: FormSchema,\n): Record<string, any> {\n const factory: (schema: FormSchema) => Record<string, any> =\n formContext.propsFactory;\n if (typeof factory !== 'function') {\n return {};\n }\n\n const props = factory(schema);\n if (!props) {\n return {};\n }\n\n return props;\n}\n\nexport class SchemaField extends React.Component<FieldProps> {\n state = {\n modified: false,\n };\n\n constructor(props) {\n super(props);\n this.handleChange = this.handleChange.bind(this);\n this.handleCustomComponentChange =\n this.handleCustomComponentChange.bind(this);\n }\n\n private hasValue() {\n const value = this.getValue();\n if (!value) {\n return false;\n }\n\n if (Array.isArray(value)) {\n return !!value.length;\n }\n\n if (value instanceof Date) {\n return true;\n }\n\n if (typeof value === 'object') {\n return !isEmpty(value);\n }\n\n return true;\n }\n\n private getLabel() {\n const { schema } = this.props;\n\n return schema.title;\n }\n\n private isInvalid() {\n const { modified } = this.state;\n const { errorSchema } = this.props;\n\n return (\n (modified || this.hasValue() || !this.isRequired()) &&\n !isEmpty(errorSchema)\n );\n }\n\n private isRequired() {\n const { required, schema } = this.props;\n\n return required || schema.minItems > 0;\n }\n\n private getHelperText() {\n const { errorSchema, schema } = this.props;\n\n if (!this.isInvalid()) {\n const helperText = schema.lime?.component?.props?.helperText;\n\n return helperText || schema.description;\n }\n\n if (!isEmpty(errorSchema) && '__errors' in errorSchema) {\n return capitalize(errorSchema.__errors[0]); // eslint-disable-line no-underscore-dangle\n }\n\n return schema.description;\n }\n\n private getValue() {\n const { formData } = this.props;\n\n return formData;\n }\n\n private handleCustomComponentChange(event) {\n const { schema } = this.props;\n event.stopPropagation();\n\n let value = event.detail;\n\n if (shouldChangeToUndefined(value, schema)) {\n value = undefined;\n }\n\n this.handleChange(value);\n }\n\n private handleChange(data) {\n const { formData, schema } = this.props;\n const { rootSchema } = this.props.registry;\n\n this.setState({ modified: true });\n\n const newData = resetDependentFields(\n formData,\n data,\n schema,\n rootSchema,\n );\n\n this.props.onChange(newData);\n }\n\n private buildCustomComponentProps() {\n const {\n disabled,\n readonly,\n name,\n registry,\n schema,\n errorSchema,\n idSchema,\n } = this.props;\n const factoryProps = getFactoryProps(registry.formContext, schema);\n\n return {\n ...factoryProps,\n value: this.getValue(),\n required: this.isRequired(),\n readonly: readonly || schema.readOnly,\n disabled: disabled,\n invalid: this.isInvalid(),\n label: this.getLabel(),\n helperText: this.getHelperText(),\n formInfo: {\n schema: schema,\n rootSchema: registry.formContext.schema,\n errorSchema: errorSchema,\n rootValue: registry.formContext.rootValue,\n name: name,\n schemaPath: this.getSchemaPath(idSchema?.$id),\n },\n };\n }\n\n private renderCustomComponent(props: FieldProps) {\n const { name, props: userDefinedComponentProps } = getCustomComponent(\n props.schema,\n );\n\n verifyCustomComponentIsDefined(name);\n\n const component = React.createElement(LimeElementsAdapter, {\n name: name,\n elementProps: {\n ...userDefinedComponentProps,\n ...this.buildCustomComponentProps(),\n },\n events: {\n change: this.handleCustomComponentChange,\n },\n });\n\n return React.createElement(\n FieldTemplate,\n {\n ...this.props,\n classNames: 'form-group field field-custom',\n },\n component,\n getHelpComponent(props.schema),\n );\n }\n\n render() {\n if (hasCustomComponent(this.props.schema)) {\n return this.renderCustomComponent(this.props);\n }\n\n const fieldProps = {\n ...this.props,\n onChange: this.handleChange,\n };\n\n if (this.props.schema.format === 'time') {\n fieldProps.uiSchema = {\n 'ui:widget': TimePicker,\n ...fieldProps.uiSchema,\n };\n }\n\n return React.createElement(JSONSchemaField, fieldProps);\n }\n\n /**\n * Gets the path to the current property within the schema\n *\n * @param schemaId - the id of the schema\n * @returns an array with the schema path for the current property\n * @example\n * const schemaId = 'root_sections_0_controls_0_name';\n * const schemaPath = getSchemaPath(schemaId);\n * // ➡ ['sections', '0', 'controls', '0', 'name']\n */\n private getSchemaPath(schemaId: string): string[] {\n if (schemaId === undefined) {\n return undefined;\n }\n\n return schemaId.replace('root_', '').split('_');\n }\n}\n"]}
@@ -90,7 +90,7 @@ export class InfoTile {
90
90
  this.checkProps((_d = this === null || this === void 0 ? void 0 : this.link) === null || _d === void 0 ? void 0 : _d.title);
91
91
  const link = !this.disabled ? (_e = this.link) === null || _e === void 0 ? void 0 : _e.href : '#';
92
92
  return [
93
- h("a", { title: (_f = this.link) === null || _f === void 0 ? void 0 : _f.title, href: link, target: (_g = this.link) === null || _g === void 0 ? void 0 : _g.target, tabindex: "0", "aria-label": extendedAriaLabel, "aria-disabled": this.disabled, class: {
93
+ h("a", { title: (_f = this.link) === null || _f === void 0 ? void 0 : _f.title, href: link, target: (_g = this.link) === null || _g === void 0 ? void 0 : _g.target, tabindex: "0", "aria-label": extendedAriaLabel, "aria-disabled": this.disabled, "aria-busy": this.loading ? 'true' : 'false', "aria-live": "polite", class: {
94
94
  'is-clickable': !!((_h = this.link) === null || _h === void 0 ? void 0 : _h.href) && !this.disabled,
95
95
  'has-circular-progress': !!((_j = this.progress) === null || _j === void 0 ? void 0 : _j.value) || ((_k = this.progress) === null || _k === void 0 ? void 0 : _k.value) === 0,
96
96
  } }, this.renderIcon(), this.renderProgress(), h("div", { class: "value-group" }, this.renderPrefix(), h("div", { class: "value-and-suffix" }, this.renderValue(), this.renderSuffix()), this.renderSpinner()), this.renderLabel()),
@@ -1 +1 @@
1
- {"version":3,"file":"info-tile.js","sourceRoot":"","sources":["../../../src/components/info-tile/info-tile.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { InfoTileProgress } from '../info-tile/info-tile.types';\nimport { Link } from '../../global/shared-types/link.types';\n\n/**\n * This component can be used on places such as a start page or a dashboard.\n * It offers features for visualizing aggregated data along with supplementary\n * information.\n *\n * If clicking on the component should navigate the user to\n * a new screen or web page, you need to provide a URL,\n * using the `link` property.\n *\n * @exampleComponent limel-example-info-tile\n * @exampleComponent limel-example-info-tile-badge\n * @exampleComponent limel-example-info-tile-progress\n * @exampleComponent limel-example-info-tile-loading\n * @exampleComponent limel-example-info-tile-styling\n */\n@Component({\n tag: 'limel-info-tile',\n shadow: true,\n styleUrl: 'info-tile.scss',\n})\nexport class InfoTile {\n /**\n * A piece of text or number that is the main piece of information\n * which the component is intended to visualize.\n */\n @Prop({ reflect: true })\n public value: number | string;\n\n /**\n * Name of icon for the info tile.\n */\n @Prop()\n public icon?: string;\n\n /**\n * The text to show below the info tile. Long labels will be truncated.\n */\n @Prop({ reflect: true })\n public label?: string = null;\n\n /**\n * A string of text that is visually placed before the value.\n */\n @Prop({ reflect: true })\n public prefix?: string;\n\n /**\n * A string of text that is visually placed after the value.\n */\n @Prop({ reflect: true })\n public suffix?: string;\n\n /**\n * Set to `true` if info tile is disabled.\n */\n @Prop({ reflect: true })\n public disabled? = false;\n\n /**\n * If supplied, the info tile will display a notification badge.\n */\n @Prop({ reflect: true })\n public badge?: number | string;\n\n /**\n * Set to `true` to put the component in the `loading` state.\n * This does _not_ disable the link. To do so, the\n * `disabled` property should be set to `true` as well.\n */\n @Prop({ reflect: true })\n public loading? = false;\n\n /**\n * If supplied, the info tile will be a clickable link.\n *\n * Supplying a value also adds an elevated effect using a shadow,\n * as well as `cursor: pointer`, which appears on hover.\n * While we strongly recommend supplying a link whenever the\n * component should act as a link, if this is not possible, and\n * you need to provide interaction through a click handler,\n * you can still get the correct styling by supplying a `Link`\n * object with the `href` property set to `'#'`.\n */\n @Prop()\n public link?: Link;\n\n /**\n * Properties of the optional circular progress bar.\n *\n * Defaults:\n * - `maxValue`: 100\n * - `suffix`: %\n * - `displayPercentageColors`: false\n *\n * Colors change with intervals of 10 %.\n */\n @Prop()\n public progress?: InfoTileProgress;\n\n public render() {\n const extendedAriaLabel =\n this.checkProps(this?.prefix) +\n this.value +\n ' ' +\n this.checkProps(this?.suffix) +\n this.checkProps(this?.label) +\n '. ' +\n this.checkProps(this?.progress?.prefix) +\n this.checkProps(this?.progress?.value) +\n this.checkProps(this?.progress?.suffix) +\n this.checkProps(this?.link?.title);\n\n const link = !this.disabled ? this.link?.href : '#';\n\n return [\n <a\n title={this.link?.title}\n href={link}\n target={this.link?.target}\n tabindex=\"0\"\n aria-label={extendedAriaLabel}\n aria-disabled={this.disabled}\n class={{\n 'is-clickable': !!this.link?.href && !this.disabled,\n 'has-circular-progress':\n !!this.progress?.value || this.progress?.value === 0,\n }}\n >\n {this.renderIcon()}\n {this.renderProgress()}\n <div class=\"value-group\">\n {this.renderPrefix()}\n <div class=\"value-and-suffix\">\n {this.renderValue()}\n {this.renderSuffix()}\n </div>\n {this.renderSpinner()}\n </div>\n {this.renderLabel()}\n </a>,\n this.renderNotification(),\n ];\n }\n\n private checkProps(propValue) {\n return !propValue ? '' : propValue + ' ';\n }\n\n private renderPrefix = () => {\n if (this.prefix) {\n return <span class=\"prefix\">{this.prefix}</span>;\n }\n };\n\n private renderValue = () => {\n const characterCount = (this.value ?? '').toString().length;\n\n if (!this.value && this.loading) {\n return <span class=\"value\">···</span>;\n }\n\n if (this.value) {\n return (\n <span\n class={{\n value: true,\n [`ch-${characterCount}`]: true,\n }}\n >\n {this.value}\n </span>\n );\n }\n };\n\n private renderSuffix = () => {\n if (this.suffix) {\n return <span class=\"suffix\">{this.suffix}</span>;\n }\n };\n\n private renderIcon = () => {\n if (this.icon) {\n return <limel-icon class=\"icon\" name={this.icon} />;\n }\n };\n\n private renderProgress = () => {\n if (this.progress?.value || this.progress?.value === 0) {\n return (\n <limel-circular-progress\n class=\"progress\"\n prefix={this.progress.prefix}\n value={this.progress.value}\n suffix={this.progress.suffix}\n maxValue={this.progress.maxValue}\n displayPercentageColors={\n this.progress.displayPercentageColors\n }\n />\n );\n }\n };\n\n private renderLabel = () => {\n if (this.label) {\n return <span class=\"label\">{this.label}</span>;\n }\n };\n\n private renderNotification = () => {\n if (this.badge) {\n return <limel-badge label={this.badge} />;\n }\n };\n\n private renderSpinner = () => {\n if (this.loading) {\n return <limel-linear-progress indeterminate={true} />;\n }\n };\n}\n"]}
1
+ {"version":3,"file":"info-tile.js","sourceRoot":"","sources":["../../../src/components/info-tile/info-tile.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAInD;;;;;;;;;;;;;;GAcG;AAMH,MAAM,OAAO,QAAQ;;IAkIT,iBAAY,GAAG,GAAG,EAAE;MACxB,IAAI,IAAI,CAAC,MAAM,EAAE;QACb,OAAO,YAAM,KAAK,EAAC,QAAQ,IAAE,IAAI,CAAC,MAAM,CAAQ,CAAC;OACpD;IACL,CAAC,CAAC;IAEM,gBAAW,GAAG,GAAG,EAAE;;MACvB,MAAM,cAAc,GAAG,CAAC,MAAA,IAAI,CAAC,KAAK,mCAAI,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC,MAAM,CAAC;MAE5D,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,OAAO,EAAE;QAC7B,OAAO,YAAM,KAAK,EAAC,OAAO,yBAAW,CAAC;OACzC;MAED,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAO,CACH,YACI,KAAK,EAAE;YACH,KAAK,EAAE,IAAI;YACX,CAAC,MAAM,cAAc,EAAE,CAAC,EAAE,IAAI;WACjC,IAEA,IAAI,CAAC,KAAK,CACR,CACV,CAAC;OACL;IACL,CAAC,CAAC;IAEM,iBAAY,GAAG,GAAG,EAAE;MACxB,IAAI,IAAI,CAAC,MAAM,EAAE;QACb,OAAO,YAAM,KAAK,EAAC,QAAQ,IAAE,IAAI,CAAC,MAAM,CAAQ,CAAC;OACpD;IACL,CAAC,CAAC;IAEM,eAAU,GAAG,GAAG,EAAE;MACtB,IAAI,IAAI,CAAC,IAAI,EAAE;QACX,OAAO,kBAAY,KAAK,EAAC,MAAM,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,CAAC;OACvD;IACL,CAAC,CAAC;IAEM,mBAAc,GAAG,GAAG,EAAE;;MAC1B,IAAI,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,KAAI,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,MAAK,CAAC,EAAE;QACpD,OAAO,CACH,+BACI,KAAK,EAAC,UAAU,EAChB,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,EAC5B,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,EAC1B,MAAM,EAAE,IAAI,CAAC,QAAQ,CAAC,MAAM,EAC5B,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAChC,uBAAuB,EACnB,IAAI,CAAC,QAAQ,CAAC,uBAAuB,GAE3C,CACL,CAAC;OACL;IACL,CAAC,CAAC;IAEM,gBAAW,GAAG,GAAG,EAAE;MACvB,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAO,YAAM,KAAK,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAAC;OAClD;IACL,CAAC,CAAC;IAEM,uBAAkB,GAAG,GAAG,EAAE;MAC9B,IAAI,IAAI,CAAC,KAAK,EAAE;QACZ,OAAO,mBAAa,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CAAC;OAC7C;IACL,CAAC,CAAC;IAEM,kBAAa,GAAG,GAAG,EAAE;MACzB,IAAI,IAAI,CAAC,OAAO,EAAE;QACd,OAAO,6BAAuB,aAAa,EAAE,IAAI,GAAI,CAAC;OACzD;IACL,CAAC,CAAC;;;iBAxLsB,IAAI;;;oBAkBT,KAAK;;mBAcN,KAAK;;;;EA6BhB,MAAM;;IACT,MAAM,iBAAiB,GACnB,IAAI,CAAC,UAAU,CAAC,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,CAAC;MAC7B,IAAI,CAAC,KAAK;MACV,GAAG;MACH,IAAI,CAAC,UAAU,CAAC,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,CAAC;MAC7B,IAAI,CAAC,UAAU,CAAC,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,CAAC;MAC5B,IAAI;MACJ,IAAI,CAAC,UAAU,CAAC,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,QAAQ,0CAAE,MAAM,CAAC;MACvC,IAAI,CAAC,UAAU,CAAC,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,QAAQ,0CAAE,KAAK,CAAC;MACtC,IAAI,CAAC,UAAU,CAAC,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,QAAQ,0CAAE,MAAM,CAAC;MACvC,IAAI,CAAC,UAAU,CAAC,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,0CAAE,KAAK,CAAC,CAAC;IAEvC,MAAM,IAAI,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC;IAEpD,OAAO;MACH,SACI,KAAK,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,EACvB,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAA,IAAI,CAAC,IAAI,0CAAE,MAAM,EACzB,QAAQ,EAAC,GAAG,gBACA,iBAAiB,mBACd,IAAI,CAAC,QAAQ,eACjB,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,eAChC,QAAQ,EAClB,KAAK,EAAE;UACH,cAAc,EAAE,CAAC,CAAC,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,IAAI,CAAA,IAAI,CAAC,IAAI,CAAC,QAAQ;UACnD,uBAAuB,EACnB,CAAC,CAAC,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,CAAA,IAAI,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,MAAK,CAAC;SAC3D;QAEA,IAAI,CAAC,UAAU,EAAE;QACjB,IAAI,CAAC,cAAc,EAAE;QACtB,WAAK,KAAK,EAAC,aAAa;UACnB,IAAI,CAAC,YAAY,EAAE;UACpB,WAAK,KAAK,EAAC,kBAAkB;YACxB,IAAI,CAAC,WAAW,EAAE;YAClB,IAAI,CAAC,YAAY,EAAE,CAClB;UACL,IAAI,CAAC,aAAa,EAAE,CACnB;QACL,IAAI,CAAC,WAAW,EAAE,CACnB;MACJ,IAAI,CAAC,kBAAkB,EAAE;KAC5B,CAAC;EACN,CAAC;EAEO,UAAU,CAAC,SAAS;IACxB,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,GAAG,GAAG,CAAC;EAC7C,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2EJ","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport { InfoTileProgress } from '../info-tile/info-tile.types';\nimport { Link } from '../../global/shared-types/link.types';\n\n/**\n * This component can be used on places such as a start page or a dashboard.\n * It offers features for visualizing aggregated data along with supplementary\n * information.\n *\n * If clicking on the component should navigate the user to\n * a new screen or web page, you need to provide a URL,\n * using the `link` property.\n *\n * @exampleComponent limel-example-info-tile\n * @exampleComponent limel-example-info-tile-badge\n * @exampleComponent limel-example-info-tile-progress\n * @exampleComponent limel-example-info-tile-loading\n * @exampleComponent limel-example-info-tile-styling\n */\n@Component({\n tag: 'limel-info-tile',\n shadow: true,\n styleUrl: 'info-tile.scss',\n})\nexport class InfoTile {\n /**\n * A piece of text or number that is the main piece of information\n * which the component is intended to visualize.\n */\n @Prop({ reflect: true })\n public value: number | string;\n\n /**\n * Name of icon for the info tile.\n */\n @Prop()\n public icon?: string;\n\n /**\n * The text to show below the info tile. Long labels will be truncated.\n */\n @Prop({ reflect: true })\n public label?: string = null;\n\n /**\n * A string of text that is visually placed before the value.\n */\n @Prop({ reflect: true })\n public prefix?: string;\n\n /**\n * A string of text that is visually placed after the value.\n */\n @Prop({ reflect: true })\n public suffix?: string;\n\n /**\n * Set to `true` if info tile is disabled.\n */\n @Prop({ reflect: true })\n public disabled? = false;\n\n /**\n * If supplied, the info tile will display a notification badge.\n */\n @Prop({ reflect: true })\n public badge?: number | string;\n\n /**\n * Set to `true` to put the component in the `loading` state.\n * This does _not_ disable the link. To do so, the\n * `disabled` property should be set to `true` as well.\n */\n @Prop({ reflect: true })\n public loading? = false;\n\n /**\n * If supplied, the info tile will be a clickable link.\n *\n * Supplying a value also adds an elevated effect using a shadow,\n * as well as `cursor: pointer`, which appears on hover.\n * While we strongly recommend supplying a link whenever the\n * component should act as a link, if this is not possible, and\n * you need to provide interaction through a click handler,\n * you can still get the correct styling by supplying a `Link`\n * object with the `href` property set to `'#'`.\n */\n @Prop()\n public link?: Link;\n\n /**\n * Properties of the optional circular progress bar.\n *\n * Defaults:\n * - `maxValue`: 100\n * - `suffix`: %\n * - `displayPercentageColors`: false\n *\n * Colors change with intervals of 10 %.\n */\n @Prop()\n public progress?: InfoTileProgress;\n\n public render() {\n const extendedAriaLabel =\n this.checkProps(this?.prefix) +\n this.value +\n ' ' +\n this.checkProps(this?.suffix) +\n this.checkProps(this?.label) +\n '. ' +\n this.checkProps(this?.progress?.prefix) +\n this.checkProps(this?.progress?.value) +\n this.checkProps(this?.progress?.suffix) +\n this.checkProps(this?.link?.title);\n\n const link = !this.disabled ? this.link?.href : '#';\n\n return [\n <a\n title={this.link?.title}\n href={link}\n target={this.link?.target}\n tabindex=\"0\"\n aria-label={extendedAriaLabel}\n aria-disabled={this.disabled}\n aria-busy={this.loading ? 'true' : 'false'}\n aria-live=\"polite\"\n class={{\n 'is-clickable': !!this.link?.href && !this.disabled,\n 'has-circular-progress':\n !!this.progress?.value || this.progress?.value === 0,\n }}\n >\n {this.renderIcon()}\n {this.renderProgress()}\n <div class=\"value-group\">\n {this.renderPrefix()}\n <div class=\"value-and-suffix\">\n {this.renderValue()}\n {this.renderSuffix()}\n </div>\n {this.renderSpinner()}\n </div>\n {this.renderLabel()}\n </a>,\n this.renderNotification(),\n ];\n }\n\n private checkProps(propValue) {\n return !propValue ? '' : propValue + ' ';\n }\n\n private renderPrefix = () => {\n if (this.prefix) {\n return <span class=\"prefix\">{this.prefix}</span>;\n }\n };\n\n private renderValue = () => {\n const characterCount = (this.value ?? '').toString().length;\n\n if (!this.value && this.loading) {\n return <span class=\"value\">···</span>;\n }\n\n if (this.value) {\n return (\n <span\n class={{\n value: true,\n [`ch-${characterCount}`]: true,\n }}\n >\n {this.value}\n </span>\n );\n }\n };\n\n private renderSuffix = () => {\n if (this.suffix) {\n return <span class=\"suffix\">{this.suffix}</span>;\n }\n };\n\n private renderIcon = () => {\n if (this.icon) {\n return <limel-icon class=\"icon\" name={this.icon} />;\n }\n };\n\n private renderProgress = () => {\n if (this.progress?.value || this.progress?.value === 0) {\n return (\n <limel-circular-progress\n class=\"progress\"\n prefix={this.progress.prefix}\n value={this.progress.value}\n suffix={this.progress.suffix}\n maxValue={this.progress.maxValue}\n displayPercentageColors={\n this.progress.displayPercentageColors\n }\n />\n );\n }\n };\n\n private renderLabel = () => {\n if (this.label) {\n return <span class=\"label\">{this.label}</span>;\n }\n };\n\n private renderNotification = () => {\n if (this.badge) {\n return <limel-badge label={this.badge} />;\n }\n };\n\n private renderSpinner = () => {\n if (this.loading) {\n return <limel-linear-progress indeterminate={true} />;\n }\n };\n}\n"]}
@@ -1,5 +1,6 @@
1
1
  import { h } from '@stencil/core';
2
2
  import { createPopper, } from '@popperjs/core';
3
+ const IS_VISIBLE_CLASS = 'is-visible';
3
4
  /**
4
5
  * The portal component provides a way to render children into a DOM node that
5
6
  * exist outside the DOM hierarchy of the parent component.
@@ -116,8 +117,6 @@ export class Portal {
116
117
  this.container = document.createElement('div');
117
118
  this.container.setAttribute('id', this.containerId);
118
119
  this.container.setAttribute('class', 'limel-portal--container');
119
- this.container.style.fontFamily =
120
- 'var(--limel-portal-font-family, inherit)';
121
120
  Object.assign(this.container, {
122
121
  portalSource: this.host,
123
122
  });
@@ -144,19 +143,21 @@ export class Portal {
144
143
  this.container.parentElement.removeChild(this.container);
145
144
  }
146
145
  hideContainer() {
147
- this.container.style.opacity = '0';
146
+ if (!this.container) {
147
+ return;
148
+ }
149
+ this.container.classList.remove(IS_VISIBLE_CLASS);
148
150
  }
149
151
  showContainer() {
150
- this.container.style.opacity = '1';
152
+ this.container.classList.add(IS_VISIBLE_CLASS);
151
153
  }
152
154
  styleContainer() {
155
+ this.setContainerWidth();
156
+ this.setContainerHeight();
157
+ this.setContainerStyles();
158
+ }
159
+ setContainerWidth() {
153
160
  const hostWidth = this.host.getBoundingClientRect().width;
154
- if (this.visible) {
155
- this.container.style.display = 'block';
156
- }
157
- else {
158
- this.container.style.display = 'none';
159
- }
160
161
  if (this.inheritParentWidth) {
161
162
  const containerWidth = this.getContentWidth(this.container);
162
163
  let width = containerWidth;
@@ -165,10 +166,6 @@ export class Portal {
165
166
  }
166
167
  this.container.style.width = `${width}px`;
167
168
  }
168
- this.ensureContainerFitsInViewPort();
169
- Object.keys(this.containerStyle).forEach((property) => {
170
- this.container.style[property] = this.containerStyle[property];
171
- });
172
169
  }
173
170
  getContentWidth(element) {
174
171
  if (!element) {
@@ -181,6 +178,11 @@ export class Portal {
181
178
  const elementContent = element.querySelector('*');
182
179
  return this.getContentWidth(elementContent);
183
180
  }
181
+ setContainerStyles() {
182
+ Object.keys(this.containerStyle).forEach((property) => {
183
+ this.container.style[property] = this.containerStyle[property];
184
+ });
185
+ }
184
186
  createPopper() {
185
187
  const config = this.createPopperConfig();
186
188
  this.popperInstance = createPopper(this.anchor || this.host, this.container, config);
@@ -240,7 +242,7 @@ export class Portal {
240
242
  };
241
243
  return flipPlacements[direction];
242
244
  }
243
- ensureContainerFitsInViewPort() {
245
+ setContainerHeight() {
244
246
  const viewHeight = Math.max(document.documentElement.clientHeight || 0, window.innerHeight || 0);
245
247
  const { top, bottom } = this.host.getBoundingClientRect();
246
248
  const spaceAboveTopOfSurface = Math.max(top, 0);
@@ -1 +1 @@
1
- {"version":3,"file":"portal.js","sourceRoot":"","sources":["../../../src/components/portal/portal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Prop, Watch } from '@stencil/core';\nimport { OpenDirection } from '../menu/menu.types';\nimport {\n createPopper,\n Instance,\n OptionsGeneric,\n Placement,\n} from '@popperjs/core';\nimport { FlipModifier } from '@popperjs/core/lib/modifiers/flip';\n\n/**\n * The portal component provides a way to render children into a DOM node that\n * exist outside the DOM hierarchy of the parent component.\n *\n * When the limel-portal component is used, it creates a new DOM node (a div element)\n * and appends it to a parent element (by default, the body of the document).\n * The child elements of the limel-portal are then moved from\n * their original location in the DOM to this new div element.\n *\n * This technique is often used to overcome CSS stacking context issues,\n * or to render UI elements like modals, dropdowns, tooltips, etc.,\n * that need to visually \"break out\" of their container.\n *\n * Using this component, we ensure that the content is always rendered in the\n * correct position, and never covers its own trigger, or another component\n * that is opened in the stacking layer. This way, we don't need to worry about\n * z-indexes, or other stacking context issues.\n *\n * :::important\n * There are some caveats when using this component\n *\n * 1. Events might not bubble up as expected since the content is moved out to\n * another DOM node.\n * 2. Any styling that is applied to content from the parent will be lost, if the\n * content is just another web-component it will work without any issues.\n * Alternatively, use the `style=\"\"` html attribute.\n * 3. Any component that is placed inside the container must have a style of\n * `max-height: inherit`. This ensures that its placement is calculated\n * correctly in relation to the trigger, and that it never covers its own\n * trigger.\n * 4. When the node is moved in the DOM, `disconnectedCallback` and\n * `connectedCallback` will be invoked, so if `disconnectedCallback` is used\n * to do any tear-down, the appropriate setup will have to be done again on\n * `connectedCallback`.\n * :::\n *\n * @slot - Content to put inside the portal\n * @private\n * @exampleComponent limel-example-portal-basic\n */\n@Component({\n tag: 'limel-portal',\n shadow: true,\n styleUrl: 'portal.scss',\n})\nexport class Portal {\n /**\n * Decides which direction the portal content should open.\n */\n @Prop({ reflect: true })\n public openDirection: OpenDirection = 'bottom';\n\n /**\n * Position of the content.\n */\n @Prop({ reflect: true })\n public position: 'fixed' | 'absolute' = 'absolute';\n\n /**\n * A unique ID.\n */\n @Prop({ reflect: true })\n public containerId: string;\n\n /**\n * Dynamic styling that can be applied to the container holding the content.\n */\n @Prop()\n public containerStyle: object = {};\n\n /**\n * The `parent` property specifies the parent element where the content\n * of the portal will be moved to.\n * By default, it is set to `document.body`, meaning the content\n * will be appended as a child of the body element in the DOM.\n * If you want the content to be appended to a different element,\n * you can specify that element by setting this property.\n * Please note that the specified parent element should exist\n * in the DOM at the time of rendering the portal.\n */\n @Prop()\n public parent: HTMLElement = document.body;\n\n /**\n * Used to make a dropdown have the same width as the trigger, for example\n * in `limel-picker`.\n */\n @Prop({ reflect: true })\n public inheritParentWidth = false;\n\n /**\n * True if the content within the portal should be visible.\n *\n * If the content is from within a dialog for instance, this can be set to\n * true from false when the dialog opens to position the content properly.\n */\n @Prop({ reflect: true })\n public visible = false;\n\n /**\n * The element that the content should be positioned relative to.\n * Defaults to the limel-portal element.\n */\n @Prop()\n public anchor?: HTMLElement = null;\n\n @Element()\n private host: HTMLLimelPortalElement;\n\n private parents: WeakMap<HTMLElement, HTMLElement>;\n private container: HTMLElement;\n private popperInstance: Instance;\n private loaded = false;\n private observer: ResizeObserver;\n\n constructor() {\n this.parents = new WeakMap();\n }\n\n public disconnectedCallback() {\n this.removeContainer();\n this.destroyPopper();\n if (this.observer) {\n this.observer.unobserve(this.container);\n }\n }\n\n public connectedCallback() {\n if (!this.loaded) {\n return;\n }\n\n if (this.visible) {\n this.init();\n }\n }\n\n public componentDidLoad() {\n this.loaded = true;\n this.connectedCallback();\n }\n\n private init() {\n this.createContainer();\n this.hideContainer();\n this.attachContainer();\n this.styleContainer();\n\n if (this.visible) {\n this.createPopper();\n this.showContainer();\n }\n\n if ('ResizeObserver' in window) {\n const observer = new ResizeObserver(() => {\n if (this.popperInstance) {\n this.styleContainer();\n this.popperInstance.update();\n }\n });\n observer.observe(this.container);\n }\n }\n\n public render() {\n return <slot />;\n }\n\n @Watch('visible')\n protected onVisible() {\n if (!this.container && this.visible) {\n this.init();\n }\n\n if (!this.visible) {\n this.hideContainer();\n this.styleContainer();\n this.destroyPopper();\n\n return;\n }\n\n this.styleContainer();\n this.createPopper();\n requestAnimationFrame(() => {\n this.showContainer();\n });\n }\n\n private createContainer() {\n const slot: HTMLSlotElement =\n this.host.shadowRoot.querySelector('slot');\n const content =\n (slot.assignedElements && slot.assignedElements()) || [];\n\n this.container = document.createElement('div');\n this.container.setAttribute('id', this.containerId);\n this.container.setAttribute('class', 'limel-portal--container');\n this.container.style.fontFamily =\n 'var(--limel-portal-font-family, inherit)';\n Object.assign(this.container, {\n portalSource: this.host,\n });\n\n content.forEach((element: HTMLElement) => {\n this.parents.set(element, element.parentElement);\n this.container.appendChild(element);\n });\n }\n\n private attachContainer() {\n this.parent.appendChild(this.container);\n }\n\n private removeContainer() {\n if (!this.container) {\n return;\n }\n\n Array.from(this.container.children).forEach((element: HTMLElement) => {\n const parent = this.parents.get(element);\n if (!parent) {\n return;\n }\n\n parent.appendChild(element);\n });\n\n this.hideContainer();\n this.container.parentElement.removeChild(this.container);\n }\n\n private hideContainer() {\n this.container.style.opacity = '0';\n }\n\n private showContainer() {\n this.container.style.opacity = '1';\n }\n\n private styleContainer() {\n const hostWidth = this.host.getBoundingClientRect().width;\n\n if (this.visible) {\n this.container.style.display = 'block';\n } else {\n this.container.style.display = 'none';\n }\n\n if (this.inheritParentWidth) {\n const containerWidth = this.getContentWidth(this.container);\n let width = containerWidth;\n if (hostWidth > 0) {\n width = hostWidth;\n }\n\n this.container.style.width = `${width}px`;\n }\n\n this.ensureContainerFitsInViewPort();\n\n Object.keys(this.containerStyle).forEach((property) => {\n this.container.style[property] = this.containerStyle[property];\n });\n }\n\n private getContentWidth(element: HTMLElement | Element) {\n if (!element) {\n return null;\n }\n\n const width = element.getBoundingClientRect().width;\n if (width !== 0) {\n return width;\n }\n\n const elementContent = element.querySelector('*');\n\n return this.getContentWidth(elementContent);\n }\n\n private createPopper() {\n const config = this.createPopperConfig();\n\n this.popperInstance = createPopper(\n this.anchor || this.host,\n this.container,\n config,\n );\n }\n\n private destroyPopper() {\n this.popperInstance?.destroy();\n this.popperInstance = null;\n }\n\n private createPopperConfig(): Partial<\n OptionsGeneric<Partial<FlipModifier>>\n > {\n const placement = this.getPlacement(this.openDirection);\n const flipPlacement = this.getFlipPlacement(this.openDirection);\n\n return {\n strategy: this.position,\n placement: placement,\n modifiers: [\n {\n name: 'flip',\n options: {\n fallbackPlacements: [flipPlacement],\n },\n },\n ],\n };\n }\n\n private getPlacement(direction: OpenDirection): Placement {\n const placements: Record<OpenDirection, Placement> = {\n 'left-start': 'left-start',\n left: 'left',\n 'left-end': 'left-end',\n 'right-start': 'right-start',\n right: 'right',\n 'right-end': 'right-end',\n 'top-start': 'top-start',\n top: 'top',\n 'top-end': 'top-end',\n 'bottom-start': 'bottom-start',\n bottom: 'bottom',\n 'bottom-end': 'bottom-end',\n };\n\n return placements[direction];\n }\n\n private getFlipPlacement(direction: OpenDirection): Placement {\n const flipPlacements: Record<OpenDirection, Placement> = {\n 'left-start': 'right-start',\n left: 'right',\n 'left-end': 'right-end',\n 'right-start': 'left-start',\n right: 'left',\n 'right-end': 'left-end',\n 'top-start': 'bottom-start',\n top: 'bottom',\n 'top-end': 'bottom-end',\n 'bottom-start': 'top-start',\n bottom: 'top',\n 'bottom-end': 'top-end',\n };\n\n return flipPlacements[direction];\n }\n\n private ensureContainerFitsInViewPort() {\n const viewHeight = Math.max(\n document.documentElement.clientHeight || 0,\n window.innerHeight || 0,\n );\n\n const { top, bottom } = this.host.getBoundingClientRect();\n const spaceAboveTopOfSurface = Math.max(top, 0);\n const spaceBelowTopOfSurface = Math.max(viewHeight - bottom, 0);\n const extraCosmeticSpace = 16;\n const maxHeight =\n Math.max(spaceAboveTopOfSurface, spaceBelowTopOfSurface) -\n extraCosmeticSpace;\n\n this.container.style.maxHeight = `${maxHeight}px`;\n }\n}\n"]}
1
+ {"version":3,"file":"portal.js","sourceRoot":"","sources":["../../../src/components/portal/portal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Prop, Watch } from '@stencil/core';\nimport { OpenDirection } from '../menu/menu.types';\nimport {\n createPopper,\n Instance,\n OptionsGeneric,\n Placement,\n} from '@popperjs/core';\nimport { FlipModifier } from '@popperjs/core/lib/modifiers/flip';\n\nconst IS_VISIBLE_CLASS = 'is-visible';\n\n/**\n * The portal component provides a way to render children into a DOM node that\n * exist outside the DOM hierarchy of the parent component.\n *\n * When the limel-portal component is used, it creates a new DOM node (a div element)\n * and appends it to a parent element (by default, the body of the document).\n * The child elements of the limel-portal are then moved from\n * their original location in the DOM to this new div element.\n *\n * This technique is often used to overcome CSS stacking context issues,\n * or to render UI elements like modals, dropdowns, tooltips, etc.,\n * that need to visually \"break out\" of their container.\n *\n * Using this component, we ensure that the content is always rendered in the\n * correct position, and never covers its own trigger, or another component\n * that is opened in the stacking layer. This way, we don't need to worry about\n * z-indexes, or other stacking context issues.\n *\n * :::important\n * There are some caveats when using this component\n *\n * 1. Events might not bubble up as expected since the content is moved out to\n * another DOM node.\n * 2. Any styling that is applied to content from the parent will be lost, if the\n * content is just another web-component it will work without any issues.\n * Alternatively, use the `style=\"\"` html attribute.\n * 3. Any component that is placed inside the container must have a style of\n * `max-height: inherit`. This ensures that its placement is calculated\n * correctly in relation to the trigger, and that it never covers its own\n * trigger.\n * 4. When the node is moved in the DOM, `disconnectedCallback` and\n * `connectedCallback` will be invoked, so if `disconnectedCallback` is used\n * to do any tear-down, the appropriate setup will have to be done again on\n * `connectedCallback`.\n * :::\n *\n * @slot - Content to put inside the portal\n * @private\n * @exampleComponent limel-example-portal-basic\n */\n@Component({\n tag: 'limel-portal',\n shadow: true,\n styleUrl: 'portal.scss',\n})\nexport class Portal {\n /**\n * Decides which direction the portal content should open.\n */\n @Prop({ reflect: true })\n public openDirection: OpenDirection = 'bottom';\n\n /**\n * Position of the content.\n */\n @Prop({ reflect: true })\n public position: 'fixed' | 'absolute' = 'absolute';\n\n /**\n * A unique ID.\n */\n @Prop({ reflect: true })\n public containerId: string;\n\n /**\n * Dynamic styling that can be applied to the container holding the content.\n */\n @Prop()\n public containerStyle: object = {};\n\n /**\n * The `parent` property specifies the parent element where the content\n * of the portal will be moved to.\n * By default, it is set to `document.body`, meaning the content\n * will be appended as a child of the body element in the DOM.\n * If you want the content to be appended to a different element,\n * you can specify that element by setting this property.\n * Please note that the specified parent element should exist\n * in the DOM at the time of rendering the portal.\n */\n @Prop()\n public parent: HTMLElement = document.body;\n\n /**\n * Used to make a dropdown have the same width as the trigger, for example\n * in `limel-picker`.\n */\n @Prop({ reflect: true })\n public inheritParentWidth = false;\n\n /**\n * True if the content within the portal should be visible.\n *\n * If the content is from within a dialog for instance, this can be set to\n * true from false when the dialog opens to position the content properly.\n */\n @Prop({ reflect: true })\n public visible = false;\n\n /**\n * The element that the content should be positioned relative to.\n * Defaults to the limel-portal element.\n */\n @Prop()\n public anchor?: HTMLElement = null;\n\n @Element()\n private host: HTMLLimelPortalElement;\n\n private parents: WeakMap<HTMLElement, HTMLElement>;\n private container: HTMLElement;\n private popperInstance: Instance;\n private loaded = false;\n private observer: ResizeObserver;\n\n constructor() {\n this.parents = new WeakMap();\n }\n\n public disconnectedCallback() {\n this.removeContainer();\n this.destroyPopper();\n if (this.observer) {\n this.observer.unobserve(this.container);\n }\n }\n\n public connectedCallback() {\n if (!this.loaded) {\n return;\n }\n\n if (this.visible) {\n this.init();\n }\n }\n\n public componentDidLoad() {\n this.loaded = true;\n this.connectedCallback();\n }\n\n private init() {\n this.createContainer();\n this.hideContainer();\n this.attachContainer();\n this.styleContainer();\n\n if (this.visible) {\n this.createPopper();\n this.showContainer();\n }\n\n if ('ResizeObserver' in window) {\n const observer = new ResizeObserver(() => {\n if (this.popperInstance) {\n this.styleContainer();\n this.popperInstance.update();\n }\n });\n observer.observe(this.container);\n }\n }\n\n public render() {\n return <slot />;\n }\n\n @Watch('visible')\n protected onVisible() {\n if (!this.container && this.visible) {\n this.init();\n }\n\n if (!this.visible) {\n this.hideContainer();\n this.styleContainer();\n this.destroyPopper();\n\n return;\n }\n\n this.styleContainer();\n this.createPopper();\n requestAnimationFrame(() => {\n this.showContainer();\n });\n }\n\n private createContainer() {\n const slot: HTMLSlotElement =\n this.host.shadowRoot.querySelector('slot');\n const content =\n (slot.assignedElements && slot.assignedElements()) || [];\n\n this.container = document.createElement('div');\n this.container.setAttribute('id', this.containerId);\n this.container.setAttribute('class', 'limel-portal--container');\n Object.assign(this.container, {\n portalSource: this.host,\n });\n\n content.forEach((element: HTMLElement) => {\n this.parents.set(element, element.parentElement);\n this.container.appendChild(element);\n });\n }\n\n private attachContainer() {\n this.parent.appendChild(this.container);\n }\n\n private removeContainer() {\n if (!this.container) {\n return;\n }\n\n Array.from(this.container.children).forEach((element: HTMLElement) => {\n const parent = this.parents.get(element);\n if (!parent) {\n return;\n }\n\n parent.appendChild(element);\n });\n\n this.hideContainer();\n this.container.parentElement.removeChild(this.container);\n }\n\n private hideContainer() {\n if (!this.container) {\n return;\n }\n\n this.container.classList.remove(IS_VISIBLE_CLASS);\n }\n\n private showContainer() {\n this.container.classList.add(IS_VISIBLE_CLASS);\n }\n\n private styleContainer() {\n this.setContainerWidth();\n this.setContainerHeight();\n this.setContainerStyles();\n }\n\n private setContainerWidth() {\n const hostWidth = this.host.getBoundingClientRect().width;\n\n if (this.inheritParentWidth) {\n const containerWidth = this.getContentWidth(this.container);\n let width = containerWidth;\n if (hostWidth > 0) {\n width = hostWidth;\n }\n\n this.container.style.width = `${width}px`;\n }\n }\n\n private getContentWidth(element: HTMLElement | Element) {\n if (!element) {\n return null;\n }\n\n const width = element.getBoundingClientRect().width;\n if (width !== 0) {\n return width;\n }\n\n const elementContent = element.querySelector('*');\n\n return this.getContentWidth(elementContent);\n }\n\n private setContainerStyles() {\n Object.keys(this.containerStyle).forEach((property) => {\n this.container.style[property] = this.containerStyle[property];\n });\n }\n\n private createPopper() {\n const config = this.createPopperConfig();\n\n this.popperInstance = createPopper(\n this.anchor || this.host,\n this.container,\n config,\n );\n }\n\n private destroyPopper() {\n this.popperInstance?.destroy();\n this.popperInstance = null;\n }\n\n private createPopperConfig(): Partial<\n OptionsGeneric<Partial<FlipModifier>>\n > {\n const placement = this.getPlacement(this.openDirection);\n const flipPlacement = this.getFlipPlacement(this.openDirection);\n\n return {\n strategy: this.position,\n placement: placement,\n modifiers: [\n {\n name: 'flip',\n options: {\n fallbackPlacements: [flipPlacement],\n },\n },\n ],\n };\n }\n\n private getPlacement(direction: OpenDirection): Placement {\n const placements: Record<OpenDirection, Placement> = {\n 'left-start': 'left-start',\n left: 'left',\n 'left-end': 'left-end',\n 'right-start': 'right-start',\n right: 'right',\n 'right-end': 'right-end',\n 'top-start': 'top-start',\n top: 'top',\n 'top-end': 'top-end',\n 'bottom-start': 'bottom-start',\n bottom: 'bottom',\n 'bottom-end': 'bottom-end',\n };\n\n return placements[direction];\n }\n\n private getFlipPlacement(direction: OpenDirection): Placement {\n const flipPlacements: Record<OpenDirection, Placement> = {\n 'left-start': 'right-start',\n left: 'right',\n 'left-end': 'right-end',\n 'right-start': 'left-start',\n right: 'left',\n 'right-end': 'left-end',\n 'top-start': 'bottom-start',\n top: 'bottom',\n 'top-end': 'bottom-end',\n 'bottom-start': 'top-start',\n bottom: 'top',\n 'bottom-end': 'top-end',\n };\n\n return flipPlacements[direction];\n }\n\n private setContainerHeight() {\n const viewHeight = Math.max(\n document.documentElement.clientHeight || 0,\n window.innerHeight || 0,\n );\n\n const { top, bottom } = this.host.getBoundingClientRect();\n const spaceAboveTopOfSurface = Math.max(top, 0);\n const spaceBelowTopOfSurface = Math.max(viewHeight - bottom, 0);\n const extraCosmeticSpace = 16;\n const maxHeight =\n Math.max(spaceAboveTopOfSurface, spaceBelowTopOfSurface) -\n extraCosmeticSpace;\n\n this.container.style.maxHeight = `${maxHeight}px`;\n }\n}\n"]}
@@ -24344,6 +24344,9 @@ class LimeElementsWidgetAdapter extends react.Component {
24344
24344
  if (Array.isArray(value)) {
24345
24345
  return !!value.length;
24346
24346
  }
24347
+ if (value instanceof Date) {
24348
+ return true;
24349
+ }
24347
24350
  if (typeof value === 'object') {
24348
24351
  return !!Object.entries(value).length;
24349
24352
  }
@@ -29049,6 +29052,9 @@ class SchemaField extends react.Component {
29049
29052
  if (Array.isArray(value)) {
29050
29053
  return !!value.length;
29051
29054
  }
29055
+ if (value instanceof Date) {
29056
+ return true;
29057
+ }
29052
29058
  if (typeof value === 'object') {
29053
29059
  return !isEmpty$1(value);
29054
29060
  }