@limetech/lime-elements 40.22.0 → 40.24.0

package/dist/esm/limel-form.entry.js

@@ -45163,6 +45163,21 @@ class LimeElementsWidgetAdapter extends React.Component {
 }
 LimeElementsWidgetAdapter.contextType = RowLayoutContext;
 
+/**
+ * Listens for `invalidInput` from the element or from inside it, such as
+ * a `limel-date-picker` in a custom component's shadow root.
+ * @param element - the field's element
+ * @param report - called with each message
+ * @returns a function that stops listening
+ */
+function listenForInvalidInput(element, report) {
+    const listener = (event) => {
+        report(event.detail);
+    };
+    element.addEventListener('invalidInput', listener);
+    return () => element.removeEventListener('invalidInput', listener);
+}
+
 var __rest$3 = (undefined && undefined.__rest) || function (s, e) {
     var t = {};
     for (var p in s)
@@ -45182,6 +45197,7 @@ class DatePicker extends React.Component {
         this.state = {
             modified: false,
         };
+        this.watchInvalidInput = (element) => listenForInvalidInput(element, (message) => { var _a, _b; return (_b = (_a = this.props.options) === null || _a === void 0 ? void 0 : _a.onInvalidInput) === null || _b === void 0 ? void 0 : _b.call(_a, message); });
         this.handleChange = this.handleChange.bind(this);
     }
     render() {
@@ -45194,7 +45210,7 @@ class DatePicker extends React.Component {
                 change: this.handleChange,
             },
             widgetProps: props,
-            extraProps: Object.assign({ type: type }, (_b = (_a = props.schema.lime) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.props),
+            extraProps: Object.assign(Object.assign({ type: type }, (_b = (_a = props.schema.lime) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.props), { ref: this.watchInvalidInput }),
         });
     }
     getValue() {
@@ -45245,6 +45261,7 @@ const TimePicker = (_a) => {
 const timeStringPattern = /^\d\d:\d\d/;
 
 const { fields: defaultFields$2 } = getDefaultRegistry();
+const DATE_FORMATS = new Set(['date', 'date-time', 'time']);
 const BaseSchemaField = defaultFields$2.SchemaField;
 /**
  * If given a value and schema, check if the value should be translated
@@ -45323,10 +45340,23 @@ class SchemaField extends React.Component {
         this.state = {
             modified: false,
         };
+        // The date picker never emits text it rejects, so the value stays valid
+        // while the field shows an error.
+        this.reportInvalidInput = (message) => {
+            var _a, _b;
+            const { registry, fieldPathId } = this.props;
+            if (!fieldPathId) {
+                return;
+            }
+            (_b = (_a = registry.formContext) === null || _a === void 0 ? void 0 : _a.setInvalidInput) === null || _b === void 0 ? void 0 : _b.call(_a, fieldPathId.path, message);
+        };
         this.handleChange = this.handleChange.bind(this);
         this.handleCustomComponentChange =
             this.handleCustomComponentChange.bind(this);
     }
+    componentWillUnmount() {
+        this.reportInvalidInput(null);
+    }
     isInvalid() {
         var _a;
         const { modified } = this.state;
@@ -45401,7 +45431,7 @@ class SchemaField extends React.Component {
                     name: name,
                     schemaPath: (_a = fieldPathId === null || fieldPathId === void 0 ? void 0 : fieldPathId.path) === null || _a === void 0 ? void 0 : _a.map(String),
                 };
-                return () => { };
+                return listenForInvalidInput(element, this.reportInvalidInput);
             } });
     }
     renderCustomComponent(props) {
@@ -45426,6 +45456,9 @@ class SchemaField extends React.Component {
         if (this.props.schema.format === 'time') {
             fieldProps.uiSchema = Object.assign({ 'ui:widget': TimePicker }, fieldProps.uiSchema);
         }
+        if (DATE_FORMATS.has(this.props.schema.format)) {
+            fieldProps.uiSchema = Object.assign(Object.assign({}, fieldProps.uiSchema), { 'ui:onInvalidInput': this.reportInvalidInput });
+        }
         // Our text widget renders a native `<input type="number">` for numeric
         // schemas. `@rjsf/core` otherwise rewrites the value to the locale's
         // decimal separator, which such an input cannot display.
@@ -46171,6 +46204,138 @@ function nextFrame() {
     return new Promise((resolve) => requestAnimationFrame(() => resolve()));
 }
 
+/**
+ * The value without the defaults that were filled into the value the form was
+ * given, as long as they still hold their default. A default the user changed
+ * stays, and so do the defaults of what the user added, such as a list item.
+ *
+ * @param value - the value the form holds, with the defaults filled in
+ * @param filled - the value the form was given, with the defaults filled in
+ * @param given - the value the form was given
+ * @returns the value without the defaults that were filled in
+ */
+function withoutFilledDefaults(value, filled, given) {
+    // A change can bring in objects that hold nothing, which mean nothing
+    if (isPlainObject$1(value)) {
+        return withoutFilledProperties(value, isPlainObject$1(filled) ? filled : {}, given);
+    }
+    if (Array.isArray(value)) {
+        return withoutFilledItems(value, Array.isArray(filled) ? filled : [], given);
+    }
+    return given === undefined && isEqual(value, filled) ? undefined : value;
+}
+function withoutFilledProperties(value, filled, given) {
+    const givenProperties = isPlainObject$1(given)
+        ? given
+        : {};
+    // In the order they were given, so a saved value keeps its key order
+    const keys = new Set([
+        ...Object.keys(givenProperties),
+        ...Object.keys(value),
+    ]);
+    const result = {};
+    for (const key of keys) {
+        if (!Object.hasOwn(value, key)) {
+            continue;
+        }
+        const kept = withoutFilledDefaults(value[key], filled[key], givenProperties[key]);
+        if (kept !== undefined) {
+            result[key] = kept;
+        }
+    }
+    return isEmpty(result) && given == null ? given : result;
+}
+// Items are paired with the ones the form was given by content, so a removed
+// or moved item does not shift the others onto the defaults of their
+// neighbors. An item that no longer equals any of them is paired with the one
+// it has the most in common with, so an edited item still loses its defaults
+function withoutFilledItems(items, filled, given) {
+    // A list that was not given is a default as a whole: once the user
+    // changes it, it is the user's
+    if (!Array.isArray(given)) {
+        return isEqual(items, filled) ? given : items;
+    }
+    const givenItems = given;
+    const matches = pairItems(items, filled);
+    const result = [];
+    for (const [index, item] of items.entries()) {
+        const match = matches.get(index);
+        if (match === undefined) {
+            result.push(item);
+            continue;
+        }
+        const kept = withoutFilledDefaults(item, filled[match], givenItems[match]);
+        if (kept !== undefined) {
+            result.push(kept);
+        }
+    }
+    return result;
+}
+function pairItems(items, filled) {
+    const matches = new Map();
+    const unmatched = new Set(filled.keys());
+    const pair = (index, match) => {
+        matches.set(index, match);
+        unmatched.delete(match);
+    };
+    for (const [index, item] of items.entries()) {
+        if (unmatched.has(index) && isEqual(item, filled[index])) {
+            pair(index, index);
+        }
+    }
+    for (const [index, item] of items.entries()) {
+        if (matches.has(index)) {
+            continue;
+        }
+        const same = [...unmatched].find((i) => isEqual(item, filled[i]));
+        if (same !== undefined) {
+            pair(index, same);
+        }
+    }
+    for (const [index, item] of items.entries()) {
+        if (matches.has(index)) {
+            continue;
+        }
+        const closest = findClosest(item, filled, unmatched);
+        if (closest !== undefined) {
+            pair(index, closest);
+        }
+    }
+    return matches;
+}
+// The one item that shares the most equal properties, if it shares any at
+// all. When several share as many there is no telling which the item was, and
+// it is left as it is, since a kept default means the same as a missing one
+// while a lost value does not
+function findClosest(item, filled, candidates) {
+    if (!isPlainObject$1(item)) {
+        return undefined;
+    }
+    let closest;
+    let best = 0;
+    let isTied = false;
+    for (const candidate of candidates) {
+        const score = sharedProperties(item, filled[candidate]);
+        if (score === best) {
+            isTied = true;
+            continue;
+        }
+        if (score < best) {
+            continue;
+        }
+        best = score;
+        closest = candidate;
+        isTied = false;
+    }
+    return isTied ? undefined : closest;
+}
+function sharedProperties(item, other) {
+    if (!isPlainObject$1(other)) {
+        return 0;
+    }
+    return Object.entries(item).filter(([key, value]) => isEqual(value, other[key])).length;
+}
+
 const formCss = () => `@charset "UTF-8";.limel-form-row--layout{--limel-form-row-border-radius:0.375rem;--limel-form-row-icon-size:1.75rem;--limel-form-row-main-information-gap:0.5rem;display:flex;flex-direction:column}.limel-form-row--layout .row{display:flex;gap:0.5rem;flex-direction:column;padding:0.5rem 1rem}.limel-form-row--layout .row:nth-child(odd){background-color:var(--form-background-color-of-odd-rows, rgb(var(--contrast-200)))}.limel-form-row--layout .row:nth-child(even){background-color:var(--form-background-color-of-even-rows, transparent)}.limel-form-row--layout .row:first-child{border-radius:var(--limel-form-row-border-radius) var(--limel-form-row-border-radius) 0 0}.limel-form-row--layout .row:last-child{border-radius:0 0 var(--limel-form-row-border-radius) var(--limel-form-row-border-radius)}.limel-form-row--layout .main-information{position:relative;display:flex;flex-direction:row;align-items:center;gap:var(--limel-form-row-main-information-gap);min-width:0}.limel-form-row--layout .main-information{position:relative}.limel-form-row--layout .main-information>.rjsf-field{position:unset}.limel-form-row--layout .main-information>.rjsf-field limel-help{top:0}.limel-form-row--layout limel-icon{color:rgb(var(--contrast-1200));width:var(--limel-form-row-icon-size);flex-shrink:0;min-width:0}.limel-form-row--layout .title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin:0;font-weight:normal;flex-grow:1;color:var(--limel-theme-on-surface-color);font-size:0.875rem}.limel-form-row--layout .description{margin:0;color:var(--limel-theme-text-secondary-on-background-color);font-size:var(--limel-theme-default-small-font-size);line-height:1.5}.limel-form-row--layout .has-icon .description{padding-left:calc(var(--limel-form-row-icon-size) + var(--limel-form-row-main-information-gap))}.limel-form-row--layout .rjsf-field{flex-shrink:0;display:flex;align-content:center}.limel-form-row--layout .rjsf-field limel-slider{min-width:8rem;display:block}*,*::after,*::before{box-sizing:border-box}.rjsf-field{min-width:0}.limel-form-array-item--simple{display:flex;align-items:center;padding:0.25rem}.limel-form-array-item--simple>*:first-child{flex:1;min-width:0}.array-items{isolation:isolate;display:flex;flex-direction:column;row-gap:var(--form-row-gap, 0.5rem);margin-top:1rem}.array-items.has-an-item-which-is-being-dragged limel-collapsible-section{--limel-cs-grid-template-rows:0fr;--limel-cs-opacity-transition-speed:0.2s;--limel-cs-grid-template-rows-transition-speed:0.2s;--limel-cs-open-header-bottom-border-radius:0.75rem}.array-item:has(limel-drag-handle:hover),.array-item:has(limel-drag-handle:focus-within),.array-item.is-elevated,.array-item.sortable-chosen{will-change:transform, box-shadow, border-radius, background-color}.array-item.sortable-ghost{border-radius:0.5rem;box-shadow:var(--shadow-depth-64), 0 0.65rem 0.75rem -0.425rem rgb(var(--color-black), 0.3)}.array-item.sortable-chosen{border-radius:0.5rem;background-color:var(--lime-elevated-surface-background-color)}.array-item.is-elevated[draggable=false]{animation:sit-here 0.8s forwards}@keyframes sit-here{0%{border-radius:0.5rem;background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--shadow-depth-64), 0 0.65rem 0.75rem -0.425rem rgb(var(--color-black), 0.3)}100%{box-shadow:none}}limel-drag-handle{order:10}limel-collapsible-section.is-being-dragged{border-radius:0.75rem !important}.limel-form-layout--default{display:grid;column-gap:var(--form-column-gap, 1rem);row-gap:var(--form-row-gap, 1rem);padding:var(--form-body-padding, 1rem)}.limel-form-layout--grid{--min-height-of-one-row:2.5rem;display:grid;column-gap:var(--form-column-gap, 1rem);row-gap:var(--form-row-gap, 1rem);padding:var(--form-body-padding, 1rem);grid-template-columns:repeat(var(--number-of-columns), minmax(0, 1fr))}.limel-form-layout--grid.auto-reorder-to-avoid-empty-cells{grid-auto-flow:dense}.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--1,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--2,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--3,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-1-columns .limel-form-layout-colspan--5{grid-column:span 1}.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--2,.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--3,.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-2-columns .limel-form-layout-colspan--5{grid-column:span 2}.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--2{grid-column:span 2}.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--3,.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-3-columns .limel-form-layout-colspan--5{grid-column:span 3}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--2{grid-column:span 2}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--3{grid-column:span 3}.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--4,.limel-form-layout--grid.layout-4-columns .limel-form-layout-colspan--5{grid-column:span 4}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--1{grid-column:span 1}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--2{grid-column:span 2}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--3{grid-column:span 3}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--4{grid-column:span 4}.limel-form-layout--grid.layout-5-columns .limel-form-layout-colspan--5{grid-column:span 5}.limel-form-layout--grid .limel-form-layout-colspan--all{grid-column:1/-1}.limel-form-layout--grid limel-checkbox,.limel-form-layout--grid limel-switch{min-height:var(--min-height-of-one-row)}.limel-form-layout--grid limel-checkbox{display:block}.limel-form-layout--grid limel-switch{margin-left:0.5rem}.form-error{color:var(--limel-theme-error-color);font-size:0.6875rem;line-height:1.5;visibility:inherit;padding-right:1rem;padding-left:1rem;padding-top:0.25rem}.button-add-new{margin-top:0.5rem;width:100%}:is(h1,h2,h3,h4,h5,h6){position:relative;margin-top:0;margin-bottom:0;word-break:break-word;hyphens:auto;-webkit-hyphens:auto;text-wrap:balance;font-size:var(--limel-form-heading-font-size);line-height:calc(var(--limel-form-heading-font-size) * 1.42857);letter-spacing:-0.01rem;font-weight:500}limel-markdown{display:block;margin-bottom:0.5rem}.rjsf-field{position:relative}.rjsf-field limel-help{position:absolute;top:calc(var(--form-row-gap, 1rem) * -0.5);left:calc(var(--form-column-gap, 1rem) * -0.5)}.rjsf-field :is(h1,h2,h3,h4,h5,h6){color:rgb(var(--contrast-1400), 0.8)}.rjsf-field :is(h1,h2,h3,h4,h5,h6){--limel-form-heading-font-size:1.476rem;font-weight:800}.rjsf-field .rjsf-field :is(h1,h2,h3,h4,h5,h6){--limel-form-heading-font-size:1.383rem;font-weight:700}.rjsf-field .rjsf-field :is(h1,h2,h3,h4,h5,h6):before{content:"";display:block;position:absolute;top:0;bottom:0;margin:auto;left:-0.75rem;background-color:var(--lime-primary-color, var(--limel-theme-primary-color));width:0.125rem;height:1.5rem;border-radius:0.125rem;opacity:0.6}.rjsf-field .rjsf-field .rjsf-field :is(h1,h2,h3,h4,h5,h6){--limel-form-heading-font-size:1.296rem;font-weight:600}.rjsf-field .rjsf-field .rjsf-field :is(h1,h2,h3,h4,h5,h6):before{display:none}.rjsf-field .rjsf-field .rjsf-field .rjsf-field :is(h1,h2,h3,h4,h5,h6){--limel-form-heading-font-size:1.215rem}.rjsf-field .rjsf-field .rjsf-field .rjsf-field :is(h1,h2,h3,h4,h5,h6):before{display:none}.rjsf-field .rjsf-field .rjsf-field .rjsf-field .rjsf-field :is(h1,h2,h3,h4,h5,h6){--limel-form-heading-font-size:1.138rem}.rjsf-field .rjsf-field .rjsf-field .rjsf-field .rjsf-field :is(h1,h2,h3,h4,h5,h6):before{display:none}.rjsf-field .rjsf-field .rjsf-field .rjsf-field .rjsf-field .rjsf-field :is(h1,h2,h3,h4,h5,h6){--limel-form-heading-font-size:1.067rem}.rjsf-field .rjsf-field .rjsf-field .rjsf-field .rjsf-field .rjsf-field :is(h1,h2,h3,h4,h5,h6):before{display:none}.limel-form-field--highlighted{position:relative}.limel-form-field--highlighted::after{content:"";position:absolute;inset:-0.25rem;border-radius:0.5rem;pointer-events:none;animation-name:highlight-field-background, highlight-field-shadow;animation-duration:6s;animation-delay:0.1s, 0.3s;animation-timing-function:ease-in-out}@media (prefers-reduced-motion){.limel-form-field--highlighted::after{animation-duration:4s;animation-delay:0s}}@keyframes highlight-field-background{0%{background-color:transparent}12.5%{background-color:color-mix(in srgb, var(--lime-primary-color, var(--limel-theme-primary-color)), transparent 65%)}45%,100%{background-color:transparent}}@keyframes highlight-field-shadow{0%,25%,50%{box-shadow:none}12.5%,37.5%{box-shadow:var(--shadow-depth-8-focused)}62.5%,72.5%{box-shadow:var(--shadow-depth-8-focused);animation-timing-function:ease-out}100%{box-shadow:none}}@media (prefers-reduced-motion){@keyframes highlight-field-shadow{0%,25%{box-shadow:var(--shadow-depth-8-focused);animation-timing-function:ease-out}100%{box-shadow:none}}}`;
 
 var __rest = (undefined && undefined.__rest) || function (s, e) {
@@ -46185,6 +46350,15 @@ var __rest = (undefined && undefined.__rest) || function (s, e) {
         }
     return t;
 };
+// `@rjsf/core` v6 treats a `const` inside `oneOf`/`anyOf` as a default and
+// auto-selects the first option, so an optional enum can never be left empty
+// (clearing it just gets repopulated on the next render). `skipOneOf` keeps this
+// off for enums while still applying genuine `default` values, matching the
+// pre-v6 behavior.
+const FILL_DEFAULTS = {
+    constAsDefaults: 'skipOneOf',
+    requiredBooleanDefault: 'skip',
+};
 const Form = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -46216,17 +46390,41 @@ const Form = class {
          * which keeps untouched required-empty fields silent.
          */
         this.revealErrors = false;
+        /**
+         * Set to `false` to leave the defaults of the schema out of the value,
+         * so that it stays as it was given until the user changes something. The
+         * form still shows the defaults. A default the user changes is in the
+         * value from then on, and so are the defaults that a change brings in,
+         * such as those of a new list item or of fields that depend on the
+         * changed one. Pass the value the form emits back in as `value`.
+         * The form validates what it shows, defaults included. When the user
+         * changes everything back, the value is what the form was given, also
+         * when that is `null` or `undefined`.
+         */
+        this.includeDefaults = true;
         this.isValid = true;
+        // Their value is still the last valid one, so the schema can't tell.
+        this.invalidInputErrors = new Map();
         this.initialized = false;
         this.handleChange = this.handleChange.bind(this);
         this.getCustomErrorMessages = this.getCustomErrorMessages.bind(this);
+        this.setInvalidInput = this.setInvalidInput.bind(this);
     }
     connectedCallback() {
         this.initialize();
     }
     componentWillLoad() {
+        this.currentValue = this.value;
         this.warnIfHeadingLevelIsInvalid();
     }
+    handleValueChange() {
+        // The host usually hands back the value the form emitted, as a new
+        // object, which is not a new value to leave the defaults out of
+        if (!isEqual(this.value, this.currentValue)) {
+            this.givenValue = undefined;
+        }
+        this.currentValue = this.value;
+    }
     componentDidLoad() {
         this.initialize();
         this.showHighlightedField();
@@ -46268,7 +46466,7 @@ const Form = class {
         this.initialized = false;
     }
     render() {
-        return h$1("div", { key: '549ba8cd825aadedc4ec9e696f6d03bee028cb89', class: "root" });
+        return h$1("div", { key: 'c6f8c1df8165c5ac23b133a369ebb0f58563d74f', class: "root" });
     }
     reactRender() {
         if (!this.root) {
@@ -46281,21 +46479,12 @@ const Form = class {
                 : 1,
         }, React.createElement(Form$1, {
             schema: this.prepareSchema(this.schema),
-            formData: this.value,
+            formData: this.currentValue,
             onChange: this.handleChange,
             widgets: widgets,
             validator: rjsfValidator,
             liveValidate: 'onChange',
-            // `@rjsf/core` v6 treats a `const` inside `oneOf`/`anyOf`
-            // as a default and auto-selects the first option, so an
-            // optional enum can never be left empty (clearing it just
-            // gets repopulated on the next render). `skipOneOf` keeps
-            // this off for enums while still applying genuine
-            // `default` values, matching the pre-v6 behavior.
-            experimental_defaultFormStateBehavior: {
-                constAsDefaults: 'skipOneOf',
-                requiredBooleanDefault: 'skip',
-            },
+            experimental_defaultFormStateBehavior: FILL_DEFAULTS,
             showErrorList: false,
             extraErrors: this.getExtraErrors(this.errors),
             templates: {
@@ -46311,6 +46500,7 @@ const Form = class {
                 rootValue: this.value,
                 propsFactory: this.propsFactory,
                 revealErrors: this.revealErrors,
+                setInvalidInput: this.setInvalidInput,
             },
             fields: {
                 SchemaField: SchemaField,
@@ -46329,11 +46519,42 @@ const Form = class {
         return this.host.shadowRoot.querySelector('.root');
     }
     handleChange(event) {
-        this.change.emit(event.formData);
+        if (this.includeDefaults) {
+            this.currentValue = event.formData;
+            this.change.emit(event.formData);
+            return;
+        }
+        const { given, filled } = this.getGivenValue();
+        this.givenValue.held = event.formData;
+        const value = withoutFilledDefaults(event.formData, filled, given);
+        if (isEqual(value, this.currentValue)) {
+            // What the form holds changed, even though the value did not
+            this.emitValidationStatus(event.errors);
+            return;
+        }
+        this.currentValue = value;
+        this.change.emit(this.currentValue);
     }
-    validateFormData() {
+    getGivenValue() {
         var _a;
-        const { errors } = rjsfValidator.validateFormData((_a = this.value) !== null && _a !== void 0 ? _a : {}, this.prepareSchema(this.schema));
+        const schema = this.prepareSchema(this.schema);
+        if (((_a = this.givenValue) === null || _a === void 0 ? void 0 : _a.schemaId) !== schema.$id) {
+            const filled = getDefaultFormState(rjsfValidator, schema, this.currentValue, schema, false, FILL_DEFAULTS);
+            this.givenValue = {
+                schemaId: schema.$id,
+                given: this.currentValue,
+                filled,
+                held: filled,
+            };
+        }
+        return this.givenValue;
+    }
+    validateFormData() {
+        // With the defaults left out of the value, the form holds more than it
+        const value = this.includeDefaults
+            ? this.value
+            : this.getGivenValue().held;
+        const { errors } = rjsfValidator.validateFormData(value !== null && value !== void 0 ? value : {}, this.prepareSchema(this.schema));
         this.emitValidationStatus(errors);
     }
     /**
@@ -46361,12 +46582,35 @@ const Form = class {
         const contentId = (fingerprint >>> 0).toString(36);
         return Object.assign(Object.assign({}, schema), { $id: $id ? `${$id}-${contentId}` : contentId });
     }
+    setInvalidInput(path, message) {
+        var _a;
+        const property = `.${path.join('.')}`;
+        const current = this.invalidInputErrors.get(property);
+        if (((_a = current === null || current === void 0 ? void 0 : current.message) !== null && _a !== void 0 ? _a : null) === message) {
+            return;
+        }
+        if (message === null) {
+            this.invalidInputErrors.delete(property);
+        }
+        else {
+            this.invalidInputErrors.set(property, {
+                name: 'invalidInput',
+                property: property,
+                message: message,
+                schemaPath: '',
+            });
+        }
+        this.validateFormData();
+    }
     hasExtraErrors() {
         return !!this.errors && Object.keys(this.errors).length > 0;
     }
     emitValidationStatus(errors) {
-        const valid = (!errors || errors.length === 0) && !this.hasExtraErrors();
-        const formErrors = this.mapErrors(errors !== null && errors !== void 0 ? errors : []);
+        const formErrors = [
+            ...this.mapErrors(errors !== null && errors !== void 0 ? errors : []),
+            ...this.invalidInputErrors.values(),
+        ];
+        const valid = formErrors.length === 0 && !this.hasExtraErrors();
         const status = { valid: valid, errors: formErrors };
         if (this.isValid !== valid || !valid) {
             this.validate.emit(status);
@@ -46411,6 +46655,9 @@ const Form = class {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
+        "value": [{
+                "handleValueChange": 0
+            }],
         "headingLevel": [{
                 "handleHeadingLevelChange": 0
             }],

package/dist/esm/limel-grid.entry.js

@@ -10,7 +10,7 @@ const Grid = class {
         console.warn('limel-grid is deprecated, please use CSS instead: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout');
     }
     render() {
-        return h("slot", { key: 'c1e2b8ee2a681748256f6a0d7cd6db7aec27872e' });
+        return h("slot", { key: 'c4db2bee4485745f79636e4a3a2f04fa603af9b8' });
     }
 };
 Grid.style = gridCss();

package/dist/esm/limel-header.entry.js

@@ -13,7 +13,7 @@ const Header = class {
         this.subheadingDivider = '·';
     }
     render() {
-        return (h(Host, { key: '25d008daf81297376579028f9116d4f78580e029' }, h("div", { key: '9bb06b9d428bcc709ef6a2cbfc5e7811b35d2c5e', class: "information" }, this.renderIcon(), h("div", { key: '417dcd90bbe18770eb25f69d3c614752571868b1', class: "headings" }, h("h1", { key: '591449da7543a5f708729bdda5ea231dfa9d4e17', class: "heading", title: this.heading }, this.heading), h("h2", { key: '8696119afe92d304fc03fa5d6b092419029bc052', class: "subheading", title: this.subheading }, this.subheading, this.renderSupportingText()))), h("slot", { key: '4903a0c675afa7371943f2b007d7367649eb473a', name: "actions" }, h("slot", { key: '009934d3d4ae2ff2932754e452bfb714506f9e66' }))));
+        return (h(Host, { key: '35935910757d74259ce3a286922ee0d35aad1ec9' }, h("div", { key: 'bd95cc50ec22e4881d3254aebec9143e6bb2a634', class: "information" }, this.renderIcon(), h("div", { key: '54a84e428595f989548855559cf71172264301ba', class: "headings" }, h("h1", { key: '99ccc155b7fa5a00a63f9c2a9caa0918ef33dc13', class: "heading", title: this.heading }, this.heading), h("h2", { key: 'cc06e5bac3f36daad46d8335bb8ee80ef7bb27e0', class: "subheading", title: this.subheading }, this.subheading, this.renderSupportingText()))), h("slot", { key: '2e94d276dcbe7404d4f618125763b5b1e5ff47ef', name: "actions" }, h("slot", { key: '6a5f81a642323a7c6bc8839f5ee8e3c6f11f905b' }))));
     }
     renderIcon() {
         var _a, _b, _c, _d, _e;

package/dist/esm/limel-help_2.entry.js

@@ -24,9 +24,9 @@ const HelpComponent = class {
         };
     }
     render() {
-        return (h(Host, { key: '9f166e16ef9ddfd552bcf9bde262ca84e4b31399' }, h("limel-popover", { key: 'f0bf20043acb1ac323fcc01e6f9d64d8481b9382', open: this.isOpen, onClose: this.onPopoverClose, openDirection: this.openDirection }, h("button", { key: 'c3a62e9d9f82cc16dfb4aa39a711397b0f91def1', slot: "trigger", type: "button", onClick: this.openPopover, class: {
+        return (h(Host, { key: '0456a88ddfbe21f501bb58fd0792eaeb39ad3962' }, h("limel-popover", { key: 'db4fd15af11578c40ae6ed4e39f9931bea14d457', open: this.isOpen, onClose: this.onPopoverClose, openDirection: this.openDirection }, h("button", { key: '0e530613dcf6c02e879a4a1ae52e1e24403ef30d', slot: "trigger", type: "button", onClick: this.openPopover, class: {
                 'is-open': this.isOpen,
-            } }, this.trigger), h("limel-help-content", { key: '75edc59e9c5a2557c9766165e52f6aa1b5baee49', value: this.value, readMoreLink: this.readMoreLink }))));
+            } }, this.trigger), h("limel-help-content", { key: '64d119e480cb64cbdeab156787dddc6f36e1368e', value: this.value, readMoreLink: this.readMoreLink }))));
     }
 };
 HelpComponent.style = helpCss();
@@ -45,7 +45,7 @@ const HelpContent = class {
         };
     }
     render() {
-        return (h(Host, { key: 'd0f448293f17fbd80e5c8b0b26aa32d58af1d5ac' }, h("limel-markdown", { key: 'b69b41f86e1c362c3d12c50d24c579bf9d5a434d', value: this.value }), this.renderReadMoreLink()));
+        return (h(Host, { key: '213707af11bc0757a2b50652aeaf4f8869a8dd7c' }, h("limel-markdown", { key: 'f0f0ee7a087a8705ebb7fa463bf7f0d5f1abb207', value: this.value }), this.renderReadMoreLink()));
     }
 };
 HelpContent.style = limelHelpContentCss();

package/dist/esm/limel-helper-line_3.entry.js

@@ -32,9 +32,9 @@ const HelperLine = class {
         };
     }
     render() {
-        return (h(Host, { key: 'e42ca019869a7b4b47d93c4f402bdbf3b99b37cf', tabIndex: -1, class: {
+        return (h(Host, { key: '5bc750e2c8c7bce88fd9fc6f2ec4f27133ad5ed7', tabIndex: -1, class: {
                 invalid: this.invalid,
-            }, style: this.hasContent() ? {} : { display: 'none' }, "aria-hidden": !this.hasContent() }, h("div", { key: '3db5b20efaa64d9a20b6da5c711d2fb64393143a' }, this.renderHelperText(), this.renderCharacterCounter())));
+            }, style: this.hasContent() ? {} : { display: 'none' }, "aria-hidden": !this.hasContent() }, h("div", { key: '7bc84f9c6ae3ac8de904c56a97497f8f427583f4' }, this.renderHelperText(), this.renderCharacterCounter())));
     }
 };
 HelperLine.style = helperLineCss();
@@ -323,7 +323,7 @@ const List = class {
             maxLinesSecondaryText = 1;
         }
         const html = this.listRenderer.render(this.items, this.config);
-        return (h(Host, { key: 'e6619c70eab882e1a9ed482098a7f1ed673c74a1', style: {
+        return (h(Host, { key: '2ff544c93286e06ac298eb1cc8fa2567c360fc7a', style: {
                 '--maxLinesSecondaryText': `${maxLinesSecondaryText}`,
             } }, html));
     }
@@ -419,7 +419,7 @@ const NotchedOutline = class {
         this.hasFloatingLabel = false;
     }
     render() {
-        return (h("div", { key: 'ade07e3a9e2a63f0037f46fdbd01f866936c55ed', class: "limel-notched-outline" }, h("slot", { key: '1d7619696aa3c80b17390df8b5bc96591cb0fe36', name: "content" }), h("span", { key: 'a791e6757ff14e7bb2c2a3f833f9877922eebd51', class: "limel-notched-outline--outlines", "aria-hidden": "true" }, h("span", { key: '623d2d85813b66a3b0a2e33bbbf3cdd51b3505e0', class: "limel-notched-outline--leading-outline" }), this.renderLabel(), h("span", { key: 'd5b0c6c6e7a7d5a15fc8795e3126fe3b115019ee', class: "limel-notched-outline--trailing-outline" }), this.renderEmptyReadonlyValue())));
+        return (h("div", { key: '8ca3a2622aa918101d5d78f94c9d279276dbba10', class: "limel-notched-outline" }, h("slot", { key: '508f8fb8cc48ba667ad250acae46ff2f4c25ef42', name: "content" }), h("span", { key: 'a071aa9212705b001e52e055d61f1be42a10ae69', class: "limel-notched-outline--outlines", "aria-hidden": "true" }, h("span", { key: 'ee1602e3637cbbba489b8b5be5bf65f6352738c5', class: "limel-notched-outline--leading-outline" }), this.renderLabel(), h("span", { key: '1517c575f1c4299a5a2d636e0e456b24f939d418', class: "limel-notched-outline--trailing-outline" }), this.renderEmptyReadonlyValue())));
     }
     renderLabel() {
         if (!this.label) {

package/dist/esm/limel-hotkey_4.entry.js

@@ -130,7 +130,7 @@ const Hotkey = class {
         const parts = tokenizeHotkeyString(this.value);
         const displayParts = parts.map((part) => formatDisplayToken(part, this.isApple));
         const ariaLabel = getHotkeyAriaLabel(this.value, this.isApple);
-        return (h(Host, { key: '0cf81f7754511dce0358be8ba428e047e6bf6ab5', "aria-label": ariaLabel || undefined }, displayParts.map(({ display, isGlyph }, index) => (h("kbd", { key: `${parts[index]}-${index}`, class: isGlyph ? 'is-glyph' : undefined }, h("span", null, display))))));
+        return (h(Host, { key: 'bf8ed107c45987511194dc5b44e9c414f690f66d', "aria-label": ariaLabel || undefined }, displayParts.map(({ display, isGlyph }, index) => (h("kbd", { key: `${parts[index]}-${index}`, class: isGlyph ? 'is-glyph' : undefined }, h("span", null, display))))));
     }
 };
 Hotkey.style = hotkeyCss();
@@ -2002,7 +2002,7 @@ const Portal = class {
         this.showContainer();
     }
     render() {
-        return h("slot", { key: '37784f868a6be293c052c90eaa87b40f97717694' });
+        return h("slot", { key: '3a994ee9948057d3f461ef78d0b2487673044b98' });
     }
     onVisible() {
         if (!this.container && this.visible) {
@@ -2418,10 +2418,10 @@ const Tooltip = class {
     }
     render() {
         const tooltipZIndex = getComputedStyle(this.host).getPropertyValue('--tooltip-z-index');
-        return (h("div", { key: '9b893c590d0626f4e7c88f97f14e9c87cb1520d7', class: "trigger-anchor" }, h("limel-portal", { key: 'de7ee98705df289e59a034f49daf33823ab6aa86', openDirection: this.openDirection, visible: this.open, containerId: this.portalId, containerStyle: {
+        return (h("div", { key: 'dd68f46eecdfe23830fcdc273982e71dd832b6a2', class: "trigger-anchor" }, h("limel-portal", { key: 'c3ec9406b04edeace41d7f5c05cc89a720005297', openDirection: this.openDirection, visible: this.open, containerId: this.portalId, containerStyle: {
                 'z-index': tooltipZIndex,
                 'pointer-events': 'none',
-            }, anchor: this.ownerElement }, h("limel-tooltip-content", { key: '83ae108e4c32627527c9962a3f82a2b77ecda873', label: this.label, helperLabel: this.helperLabel, hotkey: this.hotkey, maxlength: this.maxlength, role: "tooltip", "aria-hidden": !this.open }))));
+            }, anchor: this.ownerElement }, h("limel-tooltip-content", { key: '2b8cbf20f7956046939099869fa6d1ac5025ad6a', label: this.label, helperLabel: this.helperLabel, hotkey: this.hotkey, maxlength: this.maxlength, role: "tooltip", "aria-hidden": !this.open }))));
     }
     async updateDescription() {
         if (!this.ownerElement) {
@@ -2493,7 +2493,7 @@ const TooltipContent = class {
         const style = this.maxlength
             ? { '--tooltip-max-width-of-text': `${this.maxlength}ch` }
             : undefined;
-        return (h(Host, { key: '05369a8209c96b17763eaa4074c82543f96cd908', class: { 'has-column-layout': isLabelsTextLong }, style: style }, h("div", { key: '1bfac9e319921070cc262a74347b9280de12e025', class: "label" }, this.label), this.renderHelperLabel(), this.renderHotkey()));
+        return (h(Host, { key: 'e471ae2dbb5e94f737fb8a9e3946b5528f1d58d7', class: { 'has-column-layout': isLabelsTextLong }, style: style }, h("div", { key: '61ddd956c8f7c1e9b765c13ce55d3f1219ca9957', class: "label" }, this.label), this.renderHelperLabel(), this.renderHotkey()));
     }
     renderHelperLabel() {
         if (!this.helperLabel) {

package/dist/esm/limel-icon-button.entry.js

@@ -47,7 +47,7 @@ const IconButton = class {
         if (this.host.hasAttribute('tabindex')) {
             buttonAttributes.tabindex = this.host.getAttribute('tabindex');
         }
-        return (h(Host, { key: '24e71b62ab7e2d038ecc9c8982ffad932ecf89c0', onClick: this.filterClickWhenDisabled }, h("button", Object.assign({ key: '435485320ca03a49d4ecce7e45d641e53ccbd107', "aria-label": this.label, disabled: this.disabled, id: this.tooltipId }, buttonAttributes), this.renderIcon(), this.renderTooltip(this.tooltipId))));
+        return (h(Host, { key: 'a75232fbdba624fceddf7d7846cb6a5a8b33532a', onClick: this.filterClickWhenDisabled }, h("button", Object.assign({ key: 'd74d4073e4e7147adfa478f699e1269fb72e1718', "aria-label": this.label, disabled: this.disabled, id: this.tooltipId }, buttonAttributes), this.renderIcon(), this.renderTooltip(this.tooltipId))));
     }
     renderIcon() {
         var _a, _b;

package/dist/esm/limel-icon.entry.js

@@ -184,7 +184,7 @@ const Icon = class {
         this.loadIcon(this.name);
     }
     render() {
-        return h("div", { key: '154a32782255d3b6870d1ea67bdf8e8906655c9a', class: "container" });
+        return h("div", { key: '4ba343ef7bc8cfb1c035c3c947388954d9218b3f', class: "container" });
     }
     updateAccessibility() {
         if (!this.internals) {

package/dist/esm/limel-info-tile.entry.js

@@ -114,9 +114,9 @@ const InfoTile = class {
             this.checkProps((_d = this === null || this === void 0 ? void 0 : this.link) === null || _d === void 0 ? void 0 : _d.title);
         const link = this.disabled ? '#' : (_e = this.link) === null || _e === void 0 ? void 0 : _e.href;
         const rel = getRel((_f = this.link) === null || _f === void 0 ? void 0 : _f.target, (_g = this.link) === null || _g === void 0 ? void 0 : _g.rel);
-        return (h(Host, { key: '2d5b3fb9509298316af814acac20bbb1f6c22f85', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, class: { 'has-primary-slot-content': this.hasPrimarySlot } }, h("a", { key: '2ce2856cca107671b539b5b462af04c3a9536a39', title: (_h = this.link) === null || _h === void 0 ? void 0 : _h.title, href: link, target: (_j = this.link) === null || _j === void 0 ? void 0 : _j.target, rel: rel, tabindex: "0", "aria-label": extendedAriaLabel, "aria-disabled": this.disabled, "aria-busy": this.loading ? 'true' : 'false', "aria-live": "polite", class: {
+        return (h(Host, { key: '071f39e5edf3e116952c3a6c9b639298c90c6f4f', onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, class: { 'has-primary-slot-content': this.hasPrimarySlot } }, h("a", { key: '4e13663d26cefa33182920351c08a3006bf41b75', title: (_h = this.link) === null || _h === void 0 ? void 0 : _h.title, href: link, target: (_j = this.link) === null || _j === void 0 ? void 0 : _j.target, rel: rel, tabindex: "0", "aria-label": extendedAriaLabel, "aria-disabled": this.disabled, "aria-busy": this.loading ? 'true' : 'false', "aria-live": "polite", class: {
                 'is-clickable': !!((_k = this.link) === null || _k === void 0 ? void 0 : _k.href) && !this.disabled,
-            } }, this.renderIcon(), this.renderProgress(), h("slot", { key: '8cf1cdd2c841a3c30512b390748ec7af9ccaaa06', name: "primary", onSlotchange: this.updateHasPrimarySlotContent }), h("div", { key: '4b999b693dd6e882370006edfede8a54488a2873', class: "value-group" }, this.renderPrefix(), h("div", { key: '5b06443fe1171e158f78cadb11291501507e16bc', class: "value-and-suffix" }, this.renderValue(), this.renderSuffix()), this.renderSpinner()), this.renderLabel(), h("limel-3d-hover-effect-glow", { key: '18c6b6dd3bdaacce430ddd4e2f7dbc65e400b3d0' })), this.renderNotification()));
+            } }, this.renderIcon(), this.renderProgress(), h("slot", { key: '8f05aca2443b71bd1fce49ace715afbaaa440282', name: "primary", onSlotchange: this.updateHasPrimarySlotContent }), h("div", { key: '1f8b0f1e1199a9908a3613ab18a7cbfc421c58c6', class: "value-group" }, this.renderPrefix(), h("div", { key: 'b98294d9c40828fd6d5a177f5532022168b09b9b', class: "value-and-suffix" }, this.renderValue(), this.renderSuffix()), this.renderSpinner()), this.renderLabel(), h("limel-3d-hover-effect-glow", { key: 'e26ed5c63e3aa37b8c3d427487c2836e5d66b346' })), this.renderNotification()));
     }
     checkProps(propValue) {
         return propValue ? propValue + ' ' : '';

package/dist/esm/limel-list-item.entry.js

@@ -3,9 +3,8 @@ import { g as getIconName } from './get-icon-props-CgNJbSP4.js';
 import { c as createRandomString } from './random-string-BrjD-ITe.js';
 import { r as renderListComponent } from './render-list-component-J1IzNpbv.js';
 import { C as CheckboxTemplate } from './checkbox.template-CAja2LKZ.js';
-import { t as translations } from './translations-D9ZGrMhe.js';
+import { t as translations } from './translations--i932i_D.js';
 import { I as ImageTemplate } from './image.template-BGjw97m_.js';
-import './language-VamkUr90.js';
 
 const listItemCss = () => `@charset "UTF-8";*,*:before,*:after{box-sizing:border-box}.boolean-input{--limel-boolean-input-box-size:1.25rem;--limel-boolean-input-gap-size:0.5rem;position:relative;isolation:isolate;display:flex;align-items:center;min-height:var(--limel-checkbox-min-height, 2.5rem);width:100%}.boolean-input input[type=checkbox],.boolean-input input[type=radio]{position:absolute;width:0;height:0;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0, 0, 0, 0);clip-path:inset(50%);white-space:nowrap;-webkit-appearance:none;-moz-appearance:none;appearance:none}label.boolean-input-label{min-width:var(--limel-boolean-input-box-size);min-height:var(--limel-boolean-input-box-size);padding-top:0.125rem;cursor:pointer;position:relative;width:100%;overflow-wrap:var(--limel-boolean-input-label-overflow-wrap, normal);font-size:var(--limel-theme-default-small-font-size);color:var(--limel-theme-text-primary-on-background-color);padding-left:calc(var(--limel-boolean-input-box-size) + var(--limel-boolean-input-gap-size))}.disabled:not([readonly]):not([readonly=true]) label.boolean-input-label{cursor:not-allowed;color:var(--limel-theme-text-disabled-color)}.required label.boolean-input-label:after{margin-left:0.0625rem;content:"*"}.invalid:not(.readonly) label.boolean-input-label{color:var(--limel-theme-error-text-color)}:host(limel-checkbox.hide-label) label.boolean-input-label,.hide-label label.boolean-input-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:0;width:var(--limel-boolean-input-box-size)}.box{position:absolute;pointer-events:none;transition:border-color 0.4s ease 0.2s, background-color 0.2s ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease;display:inline-block;vertical-align:middle;width:var(--limel-boolean-input-box-size);height:var(--limel-boolean-input-box-size);margin-right:var(--limel-boolean-input-gap-size);border-radius:var(--limel-boolean-input-box-border-radius);border:0.125rem solid;border-color:var(--checkbox-unchecked-border-color, rgb(var(--contrast-900)));background-color:var(--limel-checkbox-background-color, rgb(var(--contrast-300)));}.checked .box,.boolean-input>input[type=checkbox]:checked+.box,.boolean-input>input[type=radio]:checked+.box{background-color:var(--lime-primary-color, var(--limel-theme-primary-color));border-color:var(--lime-primary-color, var(--limel-theme-primary-color))}.disabled .box{opacity:0.4}.box{}.boolean-input:not(.disabled):hover .box{will-change:box-shadow;box-shadow:var(--button-shadow-hovered)}.boolean-input:not(.disabled):active .box{will-change:box-shadow;box-shadow:var(--button-shadow-pressed)}.box:before{transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);content:"";position:absolute;inset:-0.1875rem;border-radius:inherit;}.boolean-input>input[type=checkbox]:focus-visible+.box:before,.boolean-input>input[type=radio]:focus-visible+.box:before{will-change:box-shadow;box-shadow:var(--shadow-depth-8-focused)}.box:after{transition:opacity 0.2s ease, width 0.4s ease, box-shadow 0.6s cubic-bezier(0.68, -0.55, 0, 1.87), transform 0.6s cubic-bezier(0.68, -0.55, 0, 1.87);content:"";position:absolute;inset:0;margin:auto;border-radius:1rem;opacity:0;background-color:rgb(var(--color-white));}.boolean-input:not(.disabled):hover .box:after{will-change:opacity, box-shadow, transform, width}:host(limel-checkbox){--limel-boolean-input-label-overflow-wrap:var(       --checkbox-label-overflow-wrap,       normal   );min-height:var(--limel-checkbox-min-height, 2.5rem)}.box:after{height:0.125rem;width:0.25rem}.indeterminate .box:after{opacity:1;width:calc(var(--limel-boolean-input-box-size) - 0.5rem)}.checkbox{--limel-boolean-input-box-border-radius:0.25rem}.checkbox svg.check-mark{position:absolute;z-index:1;inset:0;transform:translate3d(-0.125rem, -0.125rem, 0);width:var(--limel-boolean-input-box-size);height:var(--limel-boolean-input-box-size);padding:0.25rem;color:rgb(var(--color-white));opacity:0;stroke-width:0.1875rem;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}.checkbox svg.check-mark path{stroke-dashoffset:29.7833;stroke-dasharray:29.7833;transition:stroke-dashoffset 180ms cubic-bezier(0.4, 0, 0.6, 1)}.checkbox{}.checkbox:not(.indeterminate)>input[type=checkbox]:checked+.box svg.check-mark{opacity:1}.checkbox:not(.indeterminate)>input[type=checkbox]:checked+.box svg.check-mark path{stroke-dashoffset:0}limel-dynamic-label{margin-top:0.375rem;margin-left:-0.25rem}:host(limel-checkbox:focus),:host(limel-checkbox:focus-visible),:host(limel-checkbox:focus-within){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limel-checkbox){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limel-checkbox:focus) limel-helper-line,:host(limel-checkbox:focus-visible) limel-helper-line,:host(limel-checkbox:focus-within) limel-helper-line,:host(limel-checkbox:hover) limel-helper-line{will-change:grid-template-rows}*,*:before,*:after{box-sizing:border-box}limel-list-item{--limel-list-item-image-size:2rem;min-height:2.5rem}limel-list-item:focus{outline:none}limel-list-item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}limel-list-item{transition:background-color 0.6s ease;position:relative;isolation:isolate;display:flex;align-items:center;gap:0.5rem;padding:0 1rem;background-color:rgb(var(--contrast-100))}limel-list-item:hover{z-index:1;transition:background-color 0.2s ease;border-radius:0.5rem}limel-list-item:focus,limel-list-item:focus-visible,limel-list-item:active{z-index:1;border-radius:0.5rem}limel-list-item:first-of-type{border-top-left-radius:0.5rem;border-top-right-radius:0.5rem}limel-list-item:last-of-type{border-bottom-left-radius:0.5rem;border-bottom-right-radius:0.5rem}limel-list-item:not([disabled]):not([disabled=true]){cursor:pointer}limel-list-item[disabled]:not([disabled=false]){cursor:not-allowed}limel-list-item[disabled]:not([disabled=false]){cursor:not-allowed}limel-list-item[disabled]:not([disabled=false]) .text,limel-list-item[disabled]:not([disabled=false]) limel-icon,limel-list-item[disabled]:not([disabled=false]) img,limel-list-item[disabled]:not([disabled=false]) .boolean-input{opacity:0.4}limel-list-item:not([disabled]):not([disabled=true]):hover,limel-list-item:not([disabled]):not([disabled=true]):focus-visible{background-color:rgb(var(--contrast-400))}limel-list-item[type=option]:before{transition:background-color 0.6s ease;content:"";position:absolute;inset:0;opacity:0.2;border-radius:0.5rem}limel-list-item[type=option][selected]:not([selected=false]):before{transition:background-color 0.2s ease;background-color:var(--mdc-theme-primary)}limel-list-item .text{flex-grow:1;min-width:0;display:flex;flex-direction:column;padding:0.5rem 0;color:var(--limel-theme-text-primary-on-background-color)}limel-list-item .label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:var(--limel-theme-default-font-size);line-height:1rem}limel-list-item .description{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:var(--maxLinesSecondaryText);line-height:1rem;font-size:var(--limel-theme-default-small-font-size);opacity:0.6}limel-list-item limel-icon{color:var(--limel-theme-text-secondary-on-background-color);flex-shrink:0;margin-left:-0.5rem}limel-list-item limel-icon:has(+img){margin-left:0;position:absolute;top:0.125rem;left:0.125rem;padding:0.1875rem;width:1.25rem;background-color:rgb(var(--contrast-200), 0.8)}limel-list-item img{flex-shrink:0;object-fit:var(--list-item-image-object-fit, cover);border-radius:var(--list-item-image-border-radius, 50%);width:var(--limel-list-item-image-size);height:var(--limel-list-item-image-size);box-shadow:0 0 0 1px rgb(var(--contrast-800), 0.5)}limel-list-item limel-menu{margin-right:-0.5rem;order:var(--limel-list-item-menu-order, 3)}:has(>limel-list-item>img)>limel-list-item:not(:has(>img))>limel-icon{margin-left:0;min-width:var(--limel-list-item-image-size);max-width:var(--limel-list-item-image-size);min-height:var(--limel-list-item-image-size);max-height:var(--limel-list-item-image-size);box-shadow:0 0 0 1px rgb(var(--contrast-800), 0.5)}:has(>limel-list-item>img)>limel-list-item:not(:has(>img))>limel-icon:not([badge]){padding:0.25rem}limel-list-item[role=menuitem] limel-list-item .label{font-size:var(--limel-theme-default-small-font-size)}.boolean-input,limel-radio-button{width:var(--limel-boolean-input-box-size) !important;margin-left:-0.25rem !important}.boolean-input.checkbox{margin-right:0.25rem}limel-list-item:has(limel-icon) .boolean-input,limel-list-item:has(img) .boolean-input{margin-right:-0.25rem;margin-left:0;order:2}.boolean-input .boolean-input-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:0;width:var(--limel-boolean-input-box-size)}`;
 
@@ -129,9 +128,9 @@ const ListItemComponent = class {
             // also keep for `menuitem` for visual state consistency
             ariaProps['aria-selected'] = this.selected ? 'true' : 'false';
         }
-        return (h(Host, Object.assign({ key: 'fc4d7eab0b57e21d39c7d4fcc5ec7678a4e9662f', role: this.getHostRole(), class: {
+        return (h(Host, Object.assign({ key: '023c6ebda746cc74c85a7430fe29f321d52409f1', role: this.getHostRole(), class: {
                 'has-primary-component': !!((_a = this.primaryComponent) === null || _a === void 0 ? void 0 : _a.name),
-            } }, ariaProps), this.renderRadioButton(), this.renderCheckbox(), this.renderIcon(), this.renderImage(), this.renderPrimaryComponent(), h("div", { key: 'bf56c25af2a5f6c0e7ed7ea7b5cd6952888efb61', class: "text" }, this.renderLabel(), this.renderDescription()), this.renderActionMenu(this.actions)));
+            } }, ariaProps), this.renderRadioButton(), this.renderCheckbox(), this.renderIcon(), this.renderImage(), this.renderPrimaryComponent(), h("div", { key: 'b7812dba6249c1bd119524457c92f37a0f64f897', class: "text" }, this.renderLabel(), this.renderDescription()), this.renderActionMenu(this.actions)));
     }
     /**
      * Returns a stable reference for the provided actions array to avoid

package/dist/esm/limel-markdown.entry.js

@@ -1191,7 +1191,7 @@ const Markdown = class {
         this.cleanupImageIntersectionObserver();
     }
     render() {
-        return (h(Host, { key: '847bffc9b7fa4fbec42b705d3019c635d88fb6c6' }, h("div", { key: 'cd84ef0919fc4b2b80090de836366b317e60e51a', id: "markdown", ref: (el) => (this.rootElement = el) })));
+        return (h(Host, { key: 'f51d4ce2bc5997174b764ceedafdb8bd41351945' }, h("div", { key: 'a16ca446fd14455d86417fd6d5eec9a6aa8d365b', id: "markdown", ref: (el) => (this.rootElement = el) })));
     }
     setupImageIntersectionObserver() {
         if (this.lazyLoadImages) {