@six-group/ui-library 0.0.0-insider.b2db78f → 0.0.0-insider.b42b8b1

package/dist/collection/components/six-timepicker/six-timepicker.js

@@ -371,6 +371,7 @@ export class SixTimepicker {
         return {
             "format": {
                 "type": "string",
+                "attribute": "format",
                 "mutable": false,
                 "complexType": {
                     "original": "TimeFormat",
@@ -391,12 +392,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "format",
                 "reflect": false,
                 "defaultValue": "'HH:mm:ss'"
             },
             "separator": {
                 "type": "string",
+                "attribute": "separator",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -411,12 +412,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "separator",
                 "reflect": false,
                 "defaultValue": "':'"
             },
             "value": {
                 "type": "string",
+                "attribute": "value",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -431,12 +432,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "value",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "open": {
                 "type": "boolean",
+                "attribute": "open",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -451,12 +452,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "open",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "inline": {
                 "type": "boolean",
+                "attribute": "inline",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -471,12 +472,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "inline",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "readonly": {
                 "type": "boolean",
+                "attribute": "readonly",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -491,12 +492,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "readonly",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -511,12 +512,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "placement": {
                 "type": "string",
+                "attribute": "placement",
                 "mutable": false,
                 "complexType": {
                     "original": "'top' | 'bottom'",
@@ -531,11 +532,11 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "placement",
                 "reflect": false
             },
             "size": {
                 "type": "string",
+                "attribute": "size",
                 "mutable": false,
                 "complexType": {
                     "original": "'small' | 'medium' | 'large'",
@@ -550,12 +551,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "size",
                 "reflect": false,
                 "defaultValue": "'medium'"
             },
             "required": {
                 "type": "boolean",
+                "attribute": "required",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -570,12 +571,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "required",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "placeholder": {
                 "type": "string",
+                "attribute": "placeholder",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -590,11 +591,11 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "placeholder",
                 "reflect": false
             },
             "errorText": {
                 "type": "string",
+                "attribute": "error-text",
                 "mutable": false,
                 "complexType": {
                     "original": "string | string[]",
@@ -609,12 +610,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "error-text",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "errorTextCount": {
                 "type": "number",
+                "attribute": "error-text-count",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -629,11 +630,11 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "error-text-count",
                 "reflect": false
             },
             "label": {
                 "type": "string",
+                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -648,12 +649,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "label",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "invalid": {
                 "type": "boolean",
+                "attribute": "invalid",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -668,12 +669,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "invalid",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "name": {
                 "type": "string",
+                "attribute": "name",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -688,12 +689,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "name",
                 "reflect": true,
                 "defaultValue": "''"
             },
             "clearable": {
                 "type": "boolean",
+                "attribute": "clearable",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -708,12 +709,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "clearable",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "iconPosition": {
                 "type": "string",
+                "attribute": "icon-position",
                 "mutable": false,
                 "complexType": {
                     "original": "'left' | 'right'",
@@ -728,12 +729,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "icon-position",
                 "reflect": false,
                 "defaultValue": "'left'"
             },
             "hoist": {
                 "type": "boolean",
+                "attribute": "hoist",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -748,12 +749,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "hoist",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "timeout": {
                 "type": "number",
+                "attribute": "timeout",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -768,12 +769,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "timeout",
                 "reflect": false,
                 "defaultValue": "DEFAULT_DEBOUNCE_FAST"
             },
             "interval": {
                 "type": "number",
+                "attribute": "interval",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -788,12 +789,12 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "interval",
                 "reflect": false,
                 "defaultValue": "DEFAULT_DEBOUNCE_INSANELY_FAST"
             },
             "defaultTime": {
                 "type": "string",
+                "attribute": "default-time",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -808,11 +809,11 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "default-time",
                 "reflect": false
             },
             "debounce": {
                 "type": "number",
+                "attribute": "debounce",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -827,7 +828,6 @@ export class SixTimepicker {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "debounce",
                 "reflect": false,
                 "defaultValue": "DEFAULT_DEBOUNCE_FAST"
             }

package/dist/collection/components/six-tooltip/six-tooltip.js

@@ -187,6 +187,7 @@ export class SixTooltip {
         return {
             "content": {
                 "type": "string",
+                "attribute": "content",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -201,12 +202,12 @@ export class SixTooltip {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "content",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "placement": {
                 "type": "string",
+                "attribute": "placement",
                 "mutable": false,
                 "complexType": {
                     "original": "| 'top'\n    | 'top-start'\n    | 'top-end'\n    | 'right'\n    | 'right-start'\n    | 'right-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'left'\n    | 'left-start'\n    | 'left-end'",
@@ -221,12 +222,12 @@ export class SixTooltip {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "placement",
                 "reflect": false,
                 "defaultValue": "'top'"
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -241,12 +242,12 @@ export class SixTooltip {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "distance": {
                 "type": "number",
+                "attribute": "distance",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -261,12 +262,12 @@ export class SixTooltip {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "distance",
                 "reflect": false,
                 "defaultValue": "10"
             },
             "open": {
                 "type": "boolean",
+                "attribute": "open",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -281,12 +282,12 @@ export class SixTooltip {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "open",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "skidding": {
                 "type": "number",
+                "attribute": "skidding",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -301,12 +302,12 @@ export class SixTooltip {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "skidding",
                 "reflect": false,
                 "defaultValue": "0"
             },
             "trigger": {
                 "type": "string",
+                "attribute": "trigger",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -321,7 +322,6 @@ export class SixTooltip {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "trigger",
                 "reflect": false,
                 "defaultValue": "'hover focus'"
             }

package/dist/collection/functional-components/form-control/form-control.js

@@ -2,8 +2,8 @@ import { h } from "@stencil/core";
 const FormControl = (props, children) => {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     const errorMessages = (Array.isArray(props.errorText) ? props.errorText : [props.errorText]).filter((text) => text != null && text.trim() !== '');
-    const hasLabel = props.label != null && props.label.trim() !== '' ? true : (_a = props.hasLabelSlot) !== null && _a !== void 0 ? _a : false;
-    const hasHelpText = props.helpText != null && props.helpText.trim() !== '' ? true : (_b = props.hasHelpTextSlot) !== null && _b !== void 0 ? _b : false;
+    const hasLabel = props.label != null && props.label.trim() !== '' ? true : ((_a = props.hasLabelSlot) !== null && _a !== void 0 ? _a : false);
+    const hasHelpText = props.helpText != null && props.helpText.trim() !== '' ? true : ((_b = props.hasHelpTextSlot) !== null && _b !== void 0 ? _b : false);
     const hasErrorText = (errorMessages.length > 0 || ((_c = props.hasErrorTextSlot) !== null && _c !== void 0 ? _c : false)) && ((_d = props.displayError) !== null && _d !== void 0 ? _d : false);
     return (h("div", { part: "form-control", class: {
             'form-control': true,

package/dist/collection/functional-components/form-control/form-control.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-control.js","sourceRoot":"","sources":["../../../src/functional-components/form-control/form-control.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h, VNode } from '@stencil/core';\n\nexport interface FormControlProps {\n  /** The input id, used to map the input to the label */\n  inputId: string;\n\n  /** The size of the form control */\n  size: 'small' | 'medium' | 'large';\n\n  /** The label id, used to map the label to the input */\n  labelId?: string;\n\n  /** The label text (if the label slot isn't used) */\n  label?: string;\n\n  /** Whether a label slot has been provided. */\n  hasLabelSlot?: boolean;\n\n  /** The help text id, used to map the input to the help text */\n  helpTextId?: string;\n\n  /** The help text (if the help-text slot isn't used) */\n  helpText?: string;\n\n  /** Whether a help text slot has been provided. */\n  hasHelpTextSlot?: boolean;\n\n  /** Whether an error text slot has been provided. */\n  hasErrorTextSlot?: boolean;\n\n  /** The error text id, used to map the input to the help text */\n  errorTextId?: string;\n\n  /** The error text (if the error-text slot isn't used) */\n  errorText?: string | string[];\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  errorTextCount?: number;\n\n  /** Set to true to disable the input. */\n  disabled?: boolean;\n\n  /** Set if the value is required. */\n  required?: boolean;\n\n  /** Set if the error text is displayed. */\n  displayError?: boolean;\n\n  /** A function that gets called when the label is clicked. */\n  onLabelClick?: (event: MouseEvent) => void;\n}\n\nconst FormControl = (props: FormControlProps, children: VNode[]) => {\n  const errorMessages = (Array.isArray(props.errorText) ? props.errorText : [props.errorText]).filter(\n    (text) => text != null && text.trim() !== ''\n  );\n\n  const hasLabel = props.label != null && props.label.trim() !== '' ? true : props.hasLabelSlot ?? false;\n  const hasHelpText = props.helpText != null && props.helpText.trim() !== '' ? true : props.hasHelpTextSlot ?? false;\n  const hasErrorText = (errorMessages.length > 0 || (props.hasErrorTextSlot ?? false)) && (props.displayError ?? false);\n\n  return (\n    <div\n      part=\"form-control\"\n      class={{\n        'form-control': true,\n        'form-control--small': props.size === 'small',\n        'form-control--medium': props.size === 'medium',\n        'form-control--large': props.size === 'large',\n        'form-control--has-label': hasLabel,\n        'form-control--has-help-text': hasHelpText,\n        'form-control--has-error-text': hasErrorText,\n        'form-control--disabled': props.disabled ?? false,\n        'form-control--invalid': (props.displayError ?? false) && !props.disabled,\n      }}\n    >\n      <label\n        part=\"label\"\n        id={props.labelId}\n        class={{\n          'form-control__label': true,\n          'form-control__label__required': props.required ?? false,\n        }}\n        htmlFor={props.inputId}\n        aria-hidden={hasLabel ? 'false' : 'true'}\n        onClick={props.onLabelClick}\n      >\n        <slot name=\"label\">{props.label}</slot>\n      </label>\n\n      <div class=\"form-control__input\">{children}</div>\n\n      <div\n        part=\"error-text\"\n        id={props.errorTextId}\n        class=\"form-control__error-text\"\n        aria-hidden={hasErrorText ? 'false' : 'true'}\n      >\n        <slot name=\"error-text\">\n          {errorMessages.slice(0, props.errorTextCount ?? 1).map((text) => (\n            <six-error>{text}</six-error>\n          ))}\n        </slot>\n      </div>\n\n      <div\n        part=\"help-text\"\n        id={props.helpTextId}\n        class=\"form-control__help-text\"\n        aria-hidden={hasHelpText ? 'false' : 'true'}\n      >\n        <slot name=\"help-text\">{props.helpText}</slot>\n      </div>\n    </div>\n  );\n};\n\nexport default FormControl;\n"]}
+{"version":3,"file":"form-control.js","sourceRoot":"","sources":["../../../src/functional-components/form-control/form-control.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h, VNode } from '@stencil/core';\n\nexport interface FormControlProps {\n  /** The input id, used to map the input to the label */\n  inputId: string;\n\n  /** The size of the form control */\n  size: 'small' | 'medium' | 'large';\n\n  /** The label id, used to map the label to the input */\n  labelId?: string;\n\n  /** The label text (if the label slot isn't used) */\n  label?: string;\n\n  /** Whether a label slot has been provided. */\n  hasLabelSlot?: boolean;\n\n  /** The help text id, used to map the input to the help text */\n  helpTextId?: string;\n\n  /** The help text (if the help-text slot isn't used) */\n  helpText?: string;\n\n  /** Whether a help text slot has been provided. */\n  hasHelpTextSlot?: boolean;\n\n  /** Whether an error text slot has been provided. */\n  hasErrorTextSlot?: boolean;\n\n  /** The error text id, used to map the input to the help text */\n  errorTextId?: string;\n\n  /** The error text (if the error-text slot isn't used) */\n  errorText?: string | string[];\n\n  /** The number of error texts to be shown (if the error-text slot isn't used). Defaults to 1 */\n  errorTextCount?: number;\n\n  /** Set to true to disable the input. */\n  disabled?: boolean;\n\n  /** Set if the value is required. */\n  required?: boolean;\n\n  /** Set if the error text is displayed. */\n  displayError?: boolean;\n\n  /** A function that gets called when the label is clicked. */\n  onLabelClick?: (event: MouseEvent) => void;\n}\n\nconst FormControl = (props: FormControlProps, children: VNode[]) => {\n  const errorMessages = (Array.isArray(props.errorText) ? props.errorText : [props.errorText]).filter(\n    (text) => text != null && text.trim() !== ''\n  );\n\n  const hasLabel = props.label != null && props.label.trim() !== '' ? true : (props.hasLabelSlot ?? false);\n  const hasHelpText = props.helpText != null && props.helpText.trim() !== '' ? true : (props.hasHelpTextSlot ?? false);\n  const hasErrorText = (errorMessages.length > 0 || (props.hasErrorTextSlot ?? false)) && (props.displayError ?? false);\n\n  return (\n    <div\n      part=\"form-control\"\n      class={{\n        'form-control': true,\n        'form-control--small': props.size === 'small',\n        'form-control--medium': props.size === 'medium',\n        'form-control--large': props.size === 'large',\n        'form-control--has-label': hasLabel,\n        'form-control--has-help-text': hasHelpText,\n        'form-control--has-error-text': hasErrorText,\n        'form-control--disabled': props.disabled ?? false,\n        'form-control--invalid': (props.displayError ?? false) && !props.disabled,\n      }}\n    >\n      <label\n        part=\"label\"\n        id={props.labelId}\n        class={{\n          'form-control__label': true,\n          'form-control__label__required': props.required ?? false,\n        }}\n        htmlFor={props.inputId}\n        aria-hidden={hasLabel ? 'false' : 'true'}\n        onClick={props.onLabelClick}\n      >\n        <slot name=\"label\">{props.label}</slot>\n      </label>\n\n      <div class=\"form-control__input\">{children}</div>\n\n      <div\n        part=\"error-text\"\n        id={props.errorTextId}\n        class=\"form-control__error-text\"\n        aria-hidden={hasErrorText ? 'false' : 'true'}\n      >\n        <slot name=\"error-text\">\n          {errorMessages.slice(0, props.errorTextCount ?? 1).map((text) => (\n            <six-error>{text}</six-error>\n          ))}\n        </slot>\n      </div>\n\n      <div\n        part=\"help-text\"\n        id={props.helpTextId}\n        class=\"form-control__help-text\"\n        aria-hidden={hasHelpText ? 'false' : 'true'}\n      >\n        <slot name=\"help-text\">{props.helpText}</slot>\n      </div>\n    </div>\n  );\n};\n\nexport default FormControl;\n"]}

package/dist/collection/utils/animation.js

@@ -31,4 +31,17 @@ export function flipAnimate(element, fromElement, options = {
         },
     ], options);
 }
+/**
+ * Animates an element using keyframes. Returns a promise that resolves after the animation completes or gets canceled.
+ */
+export function animateTo(el, keyframes, options) {
+    return new Promise((resolve) => {
+        if ((options === null || options === void 0 ? void 0 : options.duration) === Infinity) {
+            throw new Error('Promise-based animations must be finite.');
+        }
+        const animation = el.animate(keyframes, Object.assign(Object.assign({}, options), { duration: options.duration }));
+        animation.addEventListener('cancel', resolve, { once: true });
+        animation.addEventListener('finish', resolve, { once: true });
+    });
+}
 //# sourceMappingURL=animation.js.map

package/dist/collection/utils/animation.js.map

@@ -1 +1 @@
-{"version":3,"file":"animation.js","sourceRoot":"","sources":["../../src/utils/animation.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,MAAM,UAAU,WAAW,CACzB,OAAgB,EAChB,WAAoB,EACpB,UAAoC;IAClC,QAAQ,EAAE,GAAG;IACb,MAAM,EAAE,MAAM;IACd,IAAI,EAAE,MAAM;CACb;IAED,MAAM,YAAY,GAAG,WAAW,CAAC,qBAAqB,EAAE,CAAC;IACzD,MAAM,cAAc,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;IAEvD,MAAM,MAAM,GAAG,YAAY,CAAC,IAAI,GAAG,cAAc,CAAC,IAAI,CAAC;IACvD,MAAM,MAAM,GAAG,YAAY,CAAC,GAAG,GAAG,cAAc,CAAC,GAAG,CAAC;IACrD,MAAM,MAAM,GAAG,YAAY,CAAC,KAAK,GAAG,cAAc,CAAC,KAAK,CAAC;IACzD,MAAM,MAAM,GAAG,YAAY,CAAC,MAAM,GAAG,cAAc,CAAC,MAAM,CAAC;IAE3D,OAAO,CAAC,OAAO,CACb;QACE;YACE,eAAe,EAAE,UAAU;YAC3B,SAAS,EAAE,aAAa,MAAM,OAAO,MAAM,aAAa,MAAM,KAAK,MAAM,GAAG;SAC7E;QACD;YACE,eAAe,EAAE,UAAU;YAC3B,SAAS,EAAE,MAAM;SAClB;KACF,EACD,OAAO,CACR,CAAC;AACJ,CAAC","sourcesContent":["/**\n * Animates a given `element` from the position and dimension of `fromElement` to\n * its current position and dimension. Can be useful to implement the FLIP animation technique.\n *\n * @see {@link https://css-tricks.com/animating-layouts-with-the-flip-technique/} for details on the FLIP technique.\n *\n * @param {Element} element - The element to animate.\n * @param {Element} fromElement - The element representing the initial position and dimensions.\n * @param {KeyframeAnimationOptions} [options={ duration: 150, easing: 'ease', fill: 'both' }] - Optional animation parameters.\n *\n */\nexport function flipAnimate(\n  element: Element,\n  fromElement: Element,\n  options: KeyframeAnimationOptions = {\n    duration: 150,\n    easing: 'ease',\n    fill: 'both',\n  }\n) {\n  const dimensionsTo = fromElement.getBoundingClientRect();\n  const dimensionsFrom = element.getBoundingClientRect();\n\n  const deltaX = dimensionsTo.left - dimensionsFrom.left;\n  const deltaY = dimensionsTo.top - dimensionsFrom.top;\n  const deltaW = dimensionsTo.width / dimensionsFrom.width;\n  const deltaH = dimensionsTo.height / dimensionsFrom.height;\n\n  element.animate(\n    [\n      {\n        transformOrigin: 'top left',\n        transform: `translate(${deltaX}px, ${deltaY}px) scale(${deltaW}, ${deltaH})`,\n      },\n      {\n        transformOrigin: 'top left',\n        transform: 'none',\n      },\n    ],\n    options\n  );\n}\n"]}
+{"version":3,"file":"animation.js","sourceRoot":"","sources":["../../src/utils/animation.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,MAAM,UAAU,WAAW,CACzB,OAAgB,EAChB,WAAoB,EACpB,UAAoC;IAClC,QAAQ,EAAE,GAAG;IACb,MAAM,EAAE,MAAM;IACd,IAAI,EAAE,MAAM;CACb;IAED,MAAM,YAAY,GAAG,WAAW,CAAC,qBAAqB,EAAE,CAAC;IACzD,MAAM,cAAc,GAAG,OAAO,CAAC,qBAAqB,EAAE,CAAC;IAEvD,MAAM,MAAM,GAAG,YAAY,CAAC,IAAI,GAAG,cAAc,CAAC,IAAI,CAAC;IACvD,MAAM,MAAM,GAAG,YAAY,CAAC,GAAG,GAAG,cAAc,CAAC,GAAG,CAAC;IACrD,MAAM,MAAM,GAAG,YAAY,CAAC,KAAK,GAAG,cAAc,CAAC,KAAK,CAAC;IACzD,MAAM,MAAM,GAAG,YAAY,CAAC,MAAM,GAAG,cAAc,CAAC,MAAM,CAAC;IAE3D,OAAO,CAAC,OAAO,CACb;QACE;YACE,eAAe,EAAE,UAAU;YAC3B,SAAS,EAAE,aAAa,MAAM,OAAO,MAAM,aAAa,MAAM,KAAK,MAAM,GAAG;SAC7E;QACD;YACE,eAAe,EAAE,UAAU;YAC3B,SAAS,EAAE,MAAM;SAClB;KACF,EACD,OAAO,CACR,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,SAAS,CAAC,EAAe,EAAE,SAAqB,EAAE,OAAkC;IAClG,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;QAC7B,IAAI,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,QAAQ,MAAK,QAAQ,EAAE,CAAC;YACnC,MAAM,IAAI,KAAK,CAAC,0CAA0C,CAAC,CAAC;QAC9D,CAAC;QAED,MAAM,SAAS,GAAG,EAAE,CAAC,OAAO,CAAC,SAAS,kCACjC,OAAO,KACV,QAAQ,EAAE,OAAQ,CAAC,QAAQ,IAC3B,CAAC;QAEH,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;QAC9D,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC;IAChE,CAAC,CAAC,CAAC;AACL,CAAC","sourcesContent":["/**\n * Animates a given `element` from the position and dimension of `fromElement` to\n * its current position and dimension. Can be useful to implement the FLIP animation technique.\n *\n * @see {@link https://css-tricks.com/animating-layouts-with-the-flip-technique/} for details on the FLIP technique.\n *\n * @param {Element} element - The element to animate.\n * @param {Element} fromElement - The element representing the initial position and dimensions.\n * @param {KeyframeAnimationOptions} [options={ duration: 150, easing: 'ease', fill: 'both' }] - Optional animation parameters.\n *\n */\nexport function flipAnimate(\n  element: Element,\n  fromElement: Element,\n  options: KeyframeAnimationOptions = {\n    duration: 150,\n    easing: 'ease',\n    fill: 'both',\n  }\n) {\n  const dimensionsTo = fromElement.getBoundingClientRect();\n  const dimensionsFrom = element.getBoundingClientRect();\n\n  const deltaX = dimensionsTo.left - dimensionsFrom.left;\n  const deltaY = dimensionsTo.top - dimensionsFrom.top;\n  const deltaW = dimensionsTo.width / dimensionsFrom.width;\n  const deltaH = dimensionsTo.height / dimensionsFrom.height;\n\n  element.animate(\n    [\n      {\n        transformOrigin: 'top left',\n        transform: `translate(${deltaX}px, ${deltaY}px) scale(${deltaW}, ${deltaH})`,\n      },\n      {\n        transformOrigin: 'top left',\n        transform: 'none',\n      },\n    ],\n    options\n  );\n}\n\n/**\n * Animates an element using keyframes. Returns a promise that resolves after the animation completes or gets canceled.\n */\nexport function animateTo(el: HTMLElement, keyframes: Keyframe[], options?: KeyframeAnimationOptions) {\n  return new Promise((resolve) => {\n    if (options?.duration === Infinity) {\n      throw new Error('Promise-based animations must be finite.');\n    }\n\n    const animation = el.animate(keyframes, {\n      ...options,\n      duration: options!.duration,\n    });\n\n    animation.addEventListener('cancel', resolve, { once: true });\n    animation.addEventListener('finish', resolve, { once: true });\n  });\n}\n"]}

package/dist/components/index.js

@@ -56,7 +56,7 @@ import { SixTextarea } from './six-textarea.js';
 import { SixTile } from './six-tile.js';
 import { SixTimepicker } from './six-timepicker.js';
 import { SixTooltip } from './six-tooltip.js';
-export { g as getAssetPath, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-BAe7gBEi.js';
+export { g as getAssetPath, r as render, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-D512q9rn.js';
 
 /**
  * Displays an alert on the toast stack with a specified message and optional configuration.

package/dist/components/{p-DwZ0ygip.js → p-9aUb96SZ.js}

@@ -1,13 +1,13 @@
-import { p as proxyCustomElement, H, c as createEvent, h } from './p-BAe7gBEi.js';
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-D512q9rn.js';
 import { P as Popover } from './p-kHci8ddv.js';
 import { E as EventListeners } from './p-C4h4qpGl.js';
-import { d as debounce, D as DEFAULT_DEBOUNCE_FAST } from './p-ltzGzaAu.js';
-import { d as defineCustomElement$6 } from './p-C4Shm3wX.js';
-import { d as defineCustomElement$5 } from './p-su5lTFPV.js';
-import { d as defineCustomElement$4 } from './p-Bga8smgq.js';
-import { d as defineCustomElement$3 } from './p-BFrSuO7n.js';
-import { d as defineCustomElement$2 } from './p-BUw6MZZI.js';
-import { d as defineCustomElement$1 } from './p-DAOD-npI.js';
+import { a as debounce, D as DEFAULT_DEBOUNCE_FAST } from './p-CKhg9ibv.js';
+import { d as defineCustomElement$6 } from './p-Cfyrva2T.js';
+import { d as defineCustomElement$5 } from './p-CWKq6Dyt.js';
+import { d as defineCustomElement$4 } from './p-BSHZAiyG.js';
+import { d as defineCustomElement$3 } from './p-DsGIkEDB.js';
+import { d as defineCustomElement$2 } from './p-CSL17OWk.js';
+import { d as defineCustomElement$1 } from './p-C28WDWgL.js';
 
 function isTabbable(el) {
     const tabIndex = el.tabIndex;
@@ -509,19 +509,19 @@ const SixDropdown = /*@__PURE__*/ proxyCustomElement(class SixDropdown extends H
         }
     }
     render() {
-        return (h("div", { key: '04210ff1a4689e32c72f73ee76a94cbe9867b0de', part: "base", id: this.componentId, class: {
+        return (h("div", { key: '46305375a199fb17ae66ca3b6678634844d0b8a2', part: "base", id: this.componentId, class: {
                 dropdown: true,
                 'dropdown--open': this.open,
-            } }, h("span", { key: '9eb3c0e703b08734e9458b25021c0844d255ec6e', part: "trigger", class: "dropdown__trigger", ref: (el) => (this.trigger = el), onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown, onKeyUp: this.handleTriggerKeyUp }, h("slot", { key: '5cec1b43f07f830dfdebb3a71eb56f3233a539c4', name: "trigger", ref: (el) => (this.triggerSlot = el), onSlotchange: this.handleTriggerSlotChange })), h("div", { key: '8761367cfff9b66fdd4a7733f1c59440a507178b', ref: (el) => (this.positioner = el), class: {
+            } }, h("span", { key: '2a53d2cf2b75607614f39675cabfe1362b297e70', part: "trigger", class: "dropdown__trigger", ref: (el) => (this.trigger = el), onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown, onKeyUp: this.handleTriggerKeyUp }, h("slot", { key: 'd8abcd455c768fded48df4c18b8191e365db4ab1', name: "trigger", ref: (el) => (this.triggerSlot = el), onSlotchange: this.handleTriggerSlotChange })), h("div", { key: 'fd0e0352800daebdc9843442901cad9769d3199a', ref: (el) => (this.positioner = el), class: {
                 dropdown__positioner: true,
                 dropdown__positioner__filtered: (this.filter || this.asyncFilter) && !this.hoist,
-            } }, h("div", { key: '2ab6c7166cea3892e429db21f3b56e7a81e94735', ref: (el) => (this.panel = el), part: "panel", class: "dropdown__panel", role: "menu", "aria-hidden": this.open ? 'false' : 'true', "aria-labelledby": this.componentId }, this.filterEnabled && (h("six-input", { key: 'f7425daad22c1a756dfda4ecefa6293ac5cdcca5', class: {
+            } }, h("div", { key: '2d72ca0ba1a5cbb480727e325048f7a171fb7af8', ref: (el) => (this.panel = el), part: "panel", class: "dropdown__panel", role: "menu", "aria-hidden": this.open ? 'false' : 'true', "aria-labelledby": this.componentId }, this.filterEnabled && (h("six-input", { key: 'a22263fb924be51081598579391774c82a09852f', class: {
                 filter: true,
                 'filter-hidden': !this.open,
-            }, "dropdown-search": true, "aria-hidden": this.open ? 'false' : 'true', ref: (el) => (this.filterInputElement = el), placeholder: this.filterPlaceholder }, h("six-icon", { key: '6416f4e28bc437c18b1cff0e0a9eaa54c9aba3d5', class: "filter__icon", slot: "suffix", size: "small" }, "search"))), h("div", { key: '479140f2107baad72960b415bd69d9ac80bb6f64', class: {
+            }, "dropdown-search": true, "aria-hidden": this.open ? 'false' : 'true', ref: (el) => (this.filterInputElement = el), placeholder: this.filterPlaceholder }, h("six-icon", { key: '7a8fc9e25e7e209b5b0aa05af5dcefca87e3b9d5', class: "filter__icon", slot: "suffix", size: "small" }, "search"))), h("div", { key: 'bedcab39d656be8ce064852ef9344b4fbbf60b17', class: {
                 dropdown__panel__scroll: true,
                 'dropdown__panel__scroll--virtual': this.virtualScroll,
-            }, onScroll: this.handleDropdownScroll, ref: (el) => (this.scrollPanel = el) }, h("slot", { key: '539cda534eb5ef042526b66487bec3d22c89fdd7', ref: (el) => (this.panelSlot = el) }), this.options.length > 0 && (h("six-menu", { key: '6294182636491e13514380d9516f904f8a9b2204', part: "menu", items: this.renderedOptions, virtualScroll: this.virtualScroll }))), h("slot", { key: '9029f9f9a69d2b6fd19b36755ab9771181a7d1c6', name: "dropdown-footer" })))));
+            }, onScroll: this.handleDropdownScroll, ref: (el) => (this.scrollPanel = el) }, h("slot", { key: '21acba56de1fba98afdfda60e8b09816a70ac057', ref: (el) => (this.panelSlot = el) }), this.options.length > 0 && (h("six-menu", { key: 'd7d429d062bf111ffdaf667ada0efe640136871a', part: "menu", items: this.renderedOptions, virtualScroll: this.virtualScroll }))), h("slot", { key: 'e23be3aa659ed7fa4a513d82c982733b58a6e9db', name: "dropdown-footer" })))));
     }
     get host() { return this; }
     static get watchers() { return {
@@ -541,7 +541,7 @@ const SixDropdown = /*@__PURE__*/ proxyCustomElement(class SixDropdown extends H
         "distance": [2],
         "skidding": [2],
         "hoist": [4],
-        "containingElement": [16],
+        "containingElement": [16, "containing-element"],
         "filter": [4],
         "asyncFilter": [4, "async-filter"],
         "filterPlaceholder": [1, "filter-placeholder"],
@@ -622,6 +622,6 @@ function defineCustomElement() {
 }
 
 export { SixDropdown as S, defineCustomElement as d };
-//# sourceMappingURL=p-DwZ0ygip.js.map
+//# sourceMappingURL=p-9aUb96SZ.js.map
 
-//# sourceMappingURL=p-DwZ0ygip.js.map
+//# sourceMappingURL=p-9aUb96SZ.js.map