sit-onyx 1.0.0-alpha.65 → 1.0.0-alpha.67

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.
@@ -9,6 +9,7 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
9
9
  truncation: string;
10
10
  skeleton: boolean;
11
11
  }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
12
+ validityChange: (validity: ValidityState) => void;
12
13
  "update:modelValue": (value: boolean) => void;
13
14
  }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OnyxCheckboxProps>, {
14
15
  modelValue: boolean;
@@ -20,13 +21,14 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
20
21
  skeleton: boolean;
21
22
  }>>> & {
22
23
  "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
24
+ onValidityChange?: ((validity: ValidityState) => any) | undefined;
23
25
  }, {
24
26
  required: boolean;
25
27
  disabled: boolean;
26
28
  loading: boolean;
27
29
  skeleton: boolean;
28
- modelValue: boolean;
29
30
  indeterminate: boolean;
31
+ modelValue: boolean;
30
32
  truncation: "ellipsis" | "multiline";
31
33
  }, {}>;
32
34
  export default _default;
@@ -1,8 +1,9 @@
1
1
  import { TruncationType } from '../../types/fonts';
2
+ import { CustomValidityProp } from '../../composables/useCustomValidity';
2
3
  import { RequiredMarkerProp } from '../../composables/required';
3
4
  import { DensityProp } from '../../composables/density';
4
5
 
5
- export type OnyxCheckboxProps = DensityProp & RequiredMarkerProp & {
6
+ export type OnyxCheckboxProps = DensityProp & RequiredMarkerProp & CustomValidityProp & {
6
7
  /**
7
8
  * Whether the checkbox is checked.
8
9
  */
@@ -9,10 +9,11 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
9
9
  disabled: boolean;
10
10
  loading: boolean;
11
11
  }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
12
+ validityChange: (validity: ValidityState) => void;
13
+ blur: () => void;
14
+ focus: () => void;
12
15
  "update:modelValue": (value: string) => void;
13
16
  change: (value: string) => void;
14
- focus: () => void;
15
- blur: () => void;
16
17
  }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OnyxInputProps>, {
17
18
  modelValue: string;
18
19
  type: string;
@@ -26,13 +27,14 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
26
27
  onBlur?: (() => any) | undefined;
27
28
  onChange?: ((value: string) => any) | undefined;
28
29
  "onUpdate:modelValue"?: ((value: string) => any) | undefined;
30
+ onValidityChange?: ((validity: ValidityState) => any) | undefined;
29
31
  }, {
30
32
  type: "search" | "text" | "email" | "password" | "tel" | "url";
31
33
  required: boolean;
32
34
  disabled: boolean;
33
35
  loading: boolean;
34
- modelValue: string;
35
36
  autocapitalize: "none" | "sentences" | "words" | "characters";
37
+ modelValue: string;
36
38
  readonly: boolean;
37
39
  }, {}>;
38
40
  export default _default;
@@ -1,7 +1,8 @@
1
+ import { CustomValidityProp } from '../../composables/useCustomValidity';
1
2
  import { RequiredMarkerProp } from '../../composables/required';
2
3
  import { DensityProp } from '../../composables/density';
3
4
 
4
- export type OnyxInputProps = DensityProp & RequiredMarkerProp & {
5
+ export type OnyxInputProps = DensityProp & RequiredMarkerProp & CustomValidityProp & {
5
6
  /**
6
7
  * Label to show above the input. Required due to accessibility / screen readers.
7
8
  * If you want to visually hide the label, use the `hideLabel` property.
@@ -3,6 +3,7 @@ import { SelectionOptionValue } from './types';
3
3
  declare const _default: <TValue extends SelectionOptionValue = SelectionOptionValue>(__VLS_props: {
4
4
  required?: boolean | undefined;
5
5
  label: string;
6
+ onChange?: ((value: string) => any) | undefined;
6
7
  selected?: boolean | undefined;
7
8
  value?: unknown;
8
9
  id: TValue;
@@ -10,17 +11,19 @@ declare const _default: <TValue extends SelectionOptionValue = SelectionOptionVa
10
11
  disabled?: boolean | undefined;
11
12
  loading?: boolean | undefined;
12
13
  skeleton?: boolean | undefined;
13
- truncation?: "ellipsis" | "multiline" | undefined;
14
+ customError?: string | undefined;
14
15
  name: string;
15
- errorMessage?: string | undefined;
16
+ truncation?: "ellipsis" | "multiline" | undefined;
17
+ onValidityChange?: ((validity: ValidityState) => any) | undefined;
16
18
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, __VLS_ctx?: {
17
19
  attrs: any;
18
20
  slots: {};
19
- emit: any;
21
+ emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "change", value: string) => void);
20
22
  } | undefined, __VLS_expose?: ((exposed: import('vue').ShallowUnwrapRef<{}>) => void) | undefined, __VLS_setup?: Promise<{
21
23
  props: {
22
24
  required?: boolean | undefined;
23
25
  label: string;
26
+ onChange?: ((value: string) => any) | undefined;
24
27
  selected?: boolean | undefined;
25
28
  value?: unknown;
26
29
  id: TValue;
@@ -28,14 +31,15 @@ declare const _default: <TValue extends SelectionOptionValue = SelectionOptionVa
28
31
  disabled?: boolean | undefined;
29
32
  loading?: boolean | undefined;
30
33
  skeleton?: boolean | undefined;
31
- truncation?: "ellipsis" | "multiline" | undefined;
34
+ customError?: string | undefined;
32
35
  name: string;
33
- errorMessage?: string | undefined;
36
+ truncation?: "ellipsis" | "multiline" | undefined;
37
+ onValidityChange?: ((validity: ValidityState) => any) | undefined;
34
38
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
35
39
  expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
36
40
  attrs: any;
37
41
  slots: {};
38
- emit: any;
42
+ emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "change", value: string) => void);
39
43
  }>) => import('vue').VNode<import("vue").RendererNode, import("vue").RendererElement, {
40
44
  [key: string]: any;
41
45
  }> & {
@@ -43,6 +47,7 @@ declare const _default: <TValue extends SelectionOptionValue = SelectionOptionVa
43
47
  props: {
44
48
  required?: boolean | undefined;
45
49
  label: string;
50
+ onChange?: ((value: string) => any) | undefined;
46
51
  selected?: boolean | undefined;
47
52
  value?: unknown;
48
53
  id: TValue;
@@ -50,14 +55,15 @@ declare const _default: <TValue extends SelectionOptionValue = SelectionOptionVa
50
55
  disabled?: boolean | undefined;
51
56
  loading?: boolean | undefined;
52
57
  skeleton?: boolean | undefined;
53
- truncation?: "ellipsis" | "multiline" | undefined;
58
+ customError?: string | undefined;
54
59
  name: string;
55
- errorMessage?: string | undefined;
60
+ truncation?: "ellipsis" | "multiline" | undefined;
61
+ onValidityChange?: ((validity: ValidityState) => any) | undefined;
56
62
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
57
63
  expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
58
64
  attrs: any;
59
65
  slots: {};
60
- emit: any;
66
+ emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "change", value: string) => void);
61
67
  } | undefined;
62
68
  };
63
69
  export default _default;
@@ -1,4 +1,5 @@
1
1
  import { TruncationType } from '../../types/fonts';
2
+ import { CustomValidityProp } from '../../composables/useCustomValidity';
2
3
  import { DensityProp } from '../../composables/density';
3
4
 
4
5
  export type SelectionOptionValue = string | number | boolean;
@@ -30,7 +31,7 @@ export type SelectionOption<T extends SelectionOptionValue = SelectionOptionValu
30
31
  */
31
32
  skeleton?: boolean;
32
33
  };
33
- export type RadioButtonProps<TValue extends SelectionOptionValue = SelectionOptionValue> = SelectionOption<TValue> & DensityProp & {
34
+ export type OnyxRadioButtonProps<TValue extends SelectionOptionValue = SelectionOptionValue> = SelectionOption<TValue> & DensityProp & CustomValidityProp & {
34
35
  /**
35
36
  * Identifier for the radio buttons in the group.
36
37
  * All radio buttons that should belong to the same radio group must have the same name.
@@ -47,5 +48,4 @@ export type RadioButtonProps<TValue extends SelectionOptionValue = SelectionOpti
47
48
  * See also: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/radio#required
48
49
  */
49
50
  required?: boolean;
50
- errorMessage?: string;
51
51
  };
@@ -5,37 +5,39 @@ declare const _default: <TValue extends SelectionOptionValue>(__VLS_props: {
5
5
  density?: "default" | "cozy" | "compact" | undefined;
6
6
  disabled?: boolean | undefined;
7
7
  skeleton?: number | undefined;
8
+ customError?: string | undefined;
9
+ name?: string | undefined;
8
10
  modelValue?: SelectionOption<TValue> | undefined;
9
11
  requiredMarker?: "required" | "optional" | undefined;
10
12
  "onUpdate:modelValue"?: ((selected: SelectionOption<TValue>) => any) | undefined;
11
13
  options: SelectionOption<TValue>[];
12
14
  headline?: string | undefined;
13
15
  direction?: "horizontal" | "vertical" | undefined;
14
- name?: string | undefined;
15
- errorMessage?: string | undefined;
16
+ onValidityChange?: ((validity: ValidityState) => any) | undefined;
16
17
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, __VLS_ctx?: {
17
18
  attrs: any;
18
19
  slots: {};
19
- emit: (evt: "update:modelValue", selected: SelectionOption<TValue>) => void;
20
+ emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", selected: SelectionOption<TValue>) => void);
20
21
  } | undefined, __VLS_expose?: ((exposed: import('vue').ShallowUnwrapRef<{}>) => void) | undefined, __VLS_setup?: Promise<{
21
22
  props: {
22
23
  required?: boolean | undefined;
23
24
  density?: "default" | "cozy" | "compact" | undefined;
24
25
  disabled?: boolean | undefined;
25
26
  skeleton?: number | undefined;
27
+ customError?: string | undefined;
28
+ name?: string | undefined;
26
29
  modelValue?: SelectionOption<TValue> | undefined;
27
30
  requiredMarker?: "required" | "optional" | undefined;
28
31
  "onUpdate:modelValue"?: ((selected: SelectionOption<TValue>) => any) | undefined;
29
32
  options: SelectionOption<TValue>[];
30
33
  headline?: string | undefined;
31
34
  direction?: "horizontal" | "vertical" | undefined;
32
- name?: string | undefined;
33
- errorMessage?: string | undefined;
35
+ onValidityChange?: ((validity: ValidityState) => any) | undefined;
34
36
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
35
37
  expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
36
38
  attrs: any;
37
39
  slots: {};
38
- emit: (evt: "update:modelValue", selected: SelectionOption<TValue>) => void;
40
+ emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", selected: SelectionOption<TValue>) => void);
39
41
  }>) => import('vue').VNode<import("vue").RendererNode, import("vue").RendererElement, {
40
42
  [key: string]: any;
41
43
  }> & {
@@ -45,19 +47,20 @@ declare const _default: <TValue extends SelectionOptionValue>(__VLS_props: {
45
47
  density?: "default" | "cozy" | "compact" | undefined;
46
48
  disabled?: boolean | undefined;
47
49
  skeleton?: number | undefined;
50
+ customError?: string | undefined;
51
+ name?: string | undefined;
48
52
  modelValue?: SelectionOption<TValue> | undefined;
49
53
  requiredMarker?: "required" | "optional" | undefined;
50
54
  "onUpdate:modelValue"?: ((selected: SelectionOption<TValue>) => any) | undefined;
51
55
  options: SelectionOption<TValue>[];
52
56
  headline?: string | undefined;
53
57
  direction?: "horizontal" | "vertical" | undefined;
54
- name?: string | undefined;
55
- errorMessage?: string | undefined;
58
+ onValidityChange?: ((validity: ValidityState) => any) | undefined;
56
59
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
57
60
  expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
58
61
  attrs: any;
59
62
  slots: {};
60
- emit: (evt: "update:modelValue", selected: SelectionOption<TValue>) => void;
63
+ emit: ((evt: "validityChange", validity: ValidityState) => void) & ((evt: "update:modelValue", selected: SelectionOption<TValue>) => void);
61
64
  } | undefined;
62
65
  };
63
66
  export default _default;
@@ -1,9 +1,10 @@
1
1
  import { SelectionOption, SelectionOptionValue } from '../OnyxRadioButton/types';
2
2
  import { Direction } from '../../types';
3
+ import { CustomValidityProp } from '../../composables/useCustomValidity';
3
4
  import { RequiredMarkerProp } from '../../composables/required';
4
5
  import { DensityProp } from '../../composables/density';
5
6
 
6
- export type OnyxRadioButtonGroupProps<TValue extends SelectionOptionValue> = DensityProp & RequiredMarkerProp & {
7
+ export type OnyxRadioButtonGroupProps<TValue extends SelectionOptionValue = SelectionOptionValue> = DensityProp & RequiredMarkerProp & CustomValidityProp & {
7
8
  /**
8
9
  * Unique name for the radio button group form element.
9
10
  * Will automatically filled, when it is not given.
@@ -23,10 +24,6 @@ export type OnyxRadioButtonGroupProps<TValue extends SelectionOptionValue> = Den
23
24
  * Disable the radio button group.
24
25
  */
25
26
  disabled?: boolean;
26
- /**
27
- * Set the radio button group into the error state with the given error message.
28
- */
29
- errorMessage?: string;
30
27
  /**
31
28
  * Direction of the checkboxes. Can be vertical (default) or horizontal.
32
29
  */
@@ -7,14 +7,14 @@ declare const _default: <TValue extends SelectModelValue<TMultiple>, TMultiple e
7
7
  disabled?: boolean | undefined;
8
8
  loading?: boolean | undefined;
9
9
  skeleton?: boolean | undefined;
10
+ multiple?: TMultiple | undefined;
11
+ placeholder?: string | undefined;
10
12
  modelValue?: TValue | undefined;
11
13
  hideLabel?: boolean | undefined;
12
14
  requiredMarker?: "required" | "optional" | undefined;
13
15
  "onUpdate:modelValue"?: ((value: TValue | undefined) => any) | undefined;
14
- placeholder?: string | undefined;
15
16
  readonly?: boolean | undefined;
16
17
  message?: string | undefined;
17
- multiple?: TMultiple | undefined;
18
18
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, __VLS_ctx?: {
19
19
  attrs: any;
20
20
  slots: {};
@@ -27,14 +27,14 @@ declare const _default: <TValue extends SelectModelValue<TMultiple>, TMultiple e
27
27
  disabled?: boolean | undefined;
28
28
  loading?: boolean | undefined;
29
29
  skeleton?: boolean | undefined;
30
+ multiple?: TMultiple | undefined;
31
+ placeholder?: string | undefined;
30
32
  modelValue?: TValue | undefined;
31
33
  hideLabel?: boolean | undefined;
32
34
  requiredMarker?: "required" | "optional" | undefined;
33
35
  "onUpdate:modelValue"?: ((value: TValue | undefined) => any) | undefined;
34
- placeholder?: string | undefined;
35
36
  readonly?: boolean | undefined;
36
37
  message?: string | undefined;
37
- multiple?: TMultiple | undefined;
38
38
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
39
39
  expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
40
40
  attrs: any;
@@ -51,14 +51,14 @@ declare const _default: <TValue extends SelectModelValue<TMultiple>, TMultiple e
51
51
  disabled?: boolean | undefined;
52
52
  loading?: boolean | undefined;
53
53
  skeleton?: boolean | undefined;
54
+ multiple?: TMultiple | undefined;
55
+ placeholder?: string | undefined;
54
56
  modelValue?: TValue | undefined;
55
57
  hideLabel?: boolean | undefined;
56
58
  requiredMarker?: "required" | "optional" | undefined;
57
59
  "onUpdate:modelValue"?: ((value: TValue | undefined) => any) | undefined;
58
- placeholder?: string | undefined;
59
60
  readonly?: boolean | undefined;
60
61
  message?: string | undefined;
61
- multiple?: TMultiple | undefined;
62
62
  } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
63
63
  expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
64
64
  attrs: any;
@@ -7,8 +7,8 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
7
7
  truncation: string;
8
8
  skeleton: boolean;
9
9
  }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
10
+ validityChange: (validity: ValidityState) => void;
10
11
  "update:modelValue": (value: boolean) => void;
11
- validityChange: (state: ValidityState) => void;
12
12
  }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OnyxSwitchProps>, {
13
13
  modelValue: boolean;
14
14
  disabled: boolean;
@@ -17,7 +17,7 @@ declare const _default: import('vue').DefineComponent<__VLS_WithDefaults<__VLS_T
17
17
  skeleton: boolean;
18
18
  }>>> & {
19
19
  "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
20
- onValidityChange?: ((state: ValidityState) => any) | undefined;
20
+ onValidityChange?: ((validity: ValidityState) => any) | undefined;
21
21
  }, {
22
22
  disabled: boolean;
23
23
  loading: boolean;
@@ -1,8 +1,9 @@
1
- import { TruncationType } from '../../types/fonts';
1
+ import { TruncationType } from '../../types';
2
+ import { CustomValidityProp } from '../../composables/useCustomValidity';
2
3
  import { RequiredMarkerProp } from '../../composables/required';
3
4
  import { DensityProp } from '../../composables/density';
4
5
 
5
- export type OnyxSwitchProps = DensityProp & RequiredMarkerProp & {
6
+ export type OnyxSwitchProps = DensityProp & RequiredMarkerProp & CustomValidityProp & {
6
7
  /**
7
8
  * Whether the switch should be checked or not.
8
9
  */
@@ -19,10 +20,6 @@ export type OnyxSwitchProps = DensityProp & RequiredMarkerProp & {
19
20
  * Shows a loading indicator.
20
21
  */
21
22
  loading?: boolean;
22
- /**
23
- * The error message will set switch to invalid state.
24
- */
25
- errorMessage?: string;
26
23
  /**
27
24
  * If `true`, the label will be visually hidden and the `title` attribute will be set.
28
25
  * For accessibility / screen readers, the aria-label will still be set.
@@ -0,0 +1,46 @@
1
+ export type CustomValidityProp = {
2
+ /**
3
+ * Custom error message to show. Will only show up after the user has interacted with the input.
4
+ */
5
+ customError?: string;
6
+ };
7
+ export type UseCustomValidityOptions = {
8
+ /**
9
+ * Component props as defined with `const props = defineProps()`
10
+ */
11
+ props: CustomValidityProp & {
12
+ modelValue?: unknown;
13
+ };
14
+ /**
15
+ * Component emit as defined with `const emit = defineEmits()`
16
+ */
17
+ emit: (evt: "validityChange", validity: ValidityState) => void;
18
+ };
19
+ export type InputValidationElement = Pick<HTMLInputElement, "validity" | "setCustomValidity">;
20
+ /**
21
+ * Composable for unified handling of custom error messages for form components.
22
+ * Will call `setCustomValidity()` accordingly and emit the "validityChange" event
23
+ * whenever the input value / error changes.
24
+ *
25
+ * @example
26
+ * ```html
27
+ * <script lang="ts" setup>
28
+ * const props = defineProps<CustomValidityProp>();
29
+ * const emit = defineEmits<{ validityChange: [validity: ValidityState] }>();
30
+ *
31
+ * const { vCustomValidity } = useCustomValidity({ props, emit });
32
+ * </script>
33
+ *
34
+ * <template>
35
+ * <input v-custom-validity />
36
+ * </template>
37
+ * ```
38
+ */
39
+ export declare const useCustomValidity: (options: UseCustomValidityOptions) => {
40
+ /**
41
+ * Directive to set the custom error message and emit validityChange event.
42
+ */
43
+ vCustomValidity: {
44
+ mounted: (el: InputValidationElement) => void;
45
+ };
46
+ };
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),A={key:0,class:"onyx-app__nav"},U={class:"onyx-app__page"},R={key:1,class:"onyx-app__page-overlay"},F={key:2,class:"onyx-app__app-overlay"},Y=e.defineComponent({__name:"OnyxAppLayout",props:{navBarAlignment:{default:"top"}},setup(o){const n=o,t=e.useSlots();return(l,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["onyx-app",{"onyx-app--horizontal":n.navBarAlignment==="left"}])},[e.unref(t).navBar?(e.openBlock(),e.createElementBlock("nav",A,[e.renderSlot(l.$slots,"navBar")])):e.createCommentVNode("",!0),e.createElementVNode("div",U,[e.renderSlot(l.$slots,"default")]),e.unref(t).pageOverlay?(e.openBlock(),e.createElementBlock("div",R,[e.renderSlot(l.$slots,"pageOverlay")])):e.createCommentVNode("",!0),e.unref(t).appOverlay?(e.openBlock(),e.createElementBlock("div",F,[e.renderSlot(l.$slots,"appOverlay")])):e.createCommentVNode("",!0)],2))}}),j=["cozy","default","compact"],_=o=>({densityClass:e.computed(()=>({[`onyx-density-${o.density}`]:o.density}))}),Z=["innerHTML"],v=e.defineComponent({__name:"OnyxIcon",props:{icon:{},size:{default:"24px"},color:{default:"currentColor"}},setup(o){const n=o;return(t,l)=>(e.openBlock(),e.createElementBlock("figure",{class:e.normalizeClass(["onyx-icon",[n.size!=="24px"?`onyx-icon--${n.size}`:"",n.color!=="currentColor"?`onyx-icon--${n.color}`:""]]),"aria-hidden":"true",innerHTML:n.icon},null,10,Z))}}),E=(o,n)=>{const t=o.__vccOpts||o;for(const[l,a]of n)t[l]=a;return t},G={},H={class:"onyx-circle-spinner",viewBox:"0 0 50 50"},K=e.createElementVNode("circle",{class:"onyx-circle-spinner__circle",cx:"50%",cy:"50%",r:"45%"},null,-1),X=[K];function W(o,n){return e.openBlock(),e.createElementBlock("svg",H,X)}const J=E(G,[["render",W]]),Q={},ee={class:"onyx-loading-dots"},te=e.createElementVNode("span",{class:"onyx-loading-dots__center"},null,-1),ne=[te];function oe(o,n){return e.openBlock(),e.createElementBlock("div",ee,ne)}const le=E(Q,[["render",oe]]),x=e.defineComponent({__name:"OnyxLoadingIndicator",props:{type:{default:"dots"}},setup(o){const n=o;return(t,l)=>n.type==="circle"?(e.openBlock(),e.createBlock(J,{key:0})):n.type==="dots"?(e.openBlock(),e.createBlock(le,{key:1})):e.createCommentVNode("",!0)}}),ae={},se={"aria-hidden":"true",class:"onyx-skeleton"};function re(o,n){return e.openBlock(),e.createElementBlock("figure",se)}const k=E(ae,[["render",re]]),ce=["disabled"],ie={key:2,class:"onyx-button__label onyx-truncation-ellipsis"},de=e.defineComponent({__name:"OnyxButton",props:{density:{},label:{},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},type:{default:"button"},variation:{default:"primary"},mode:{default:"default"},icon:{},skeleton:{type:Boolean,default:!1}},emits:["click"],setup(o,{emit:n}){const t=o,{densityClass:l}=_(t),a=n;return(d,s)=>t.skeleton?(e.openBlock(),e.createBlock(k,{key:0,class:e.normalizeClass(["onyx-button-skeleton",e.unref(l)])},null,8,["class"])):(e.openBlock(),e.createElementBlock("button",{key:1,class:e.normalizeClass(["onyx-button",`onyx-button--${t.variation}`,`onyx-button--${t.mode}`,{"onyx-button--loading":t.loading},e.unref(l)]),disabled:t.disabled||t.loading,onClick:s[0]||(s[0]=r=>a("click"))},[t.icon&&!t.loading?(e.openBlock(),e.createBlock(v,{key:0,icon:t.icon},null,8,["icon"])):e.createCommentVNode("",!0),t.loading?(e.openBlock(),e.createBlock(x,{key:1,class:"onyx-button__loading"})):(e.openBlock(),e.createElementBlock("span",ie,e.toDisplayString(t.label),1))],10,ce))}}),ue=["button","submit","reset"],pe=["primary","secondary","danger"],me=["default","outline","plain"],T=e.defineComponent({__name:"OnyxBadge",props:{density:{},variation:{default:"primary"},icon:{}},setup(o){const n=o,{densityClass:t}=_(n);return(l,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["onyx-badge",["onyx-truncation-ellipsis","onyx-text",`onyx-badge--${n.variation}`,e.unref(t)]])},[n.icon?(e.openBlock(),e.createBlock(v,{key:0,class:"onyx-badge__icon",icon:n.icon,size:n.density==="compact"?"16px":"24px"},null,8,["icon","size"])):e.renderSlot(l.$slots,"default",{key:1})],2))}}),ye="(optional)",fe={tooShort:"Please lengthen this text to {minLength} characters or more (you are currently using 1 character) | Please lengthen this text to {minLength} characters or more (you are currently using {n} characters)",tooLong:"Please shorten this text to {maxLength} characters or less (you are currently using 1 character) | Please shorten this text to {maxLength} characters or less (you are currently using {n} characters)",rangeUnderflow:"Value must be greater than or equal to {min}",rangeOverflow:"Value must be less than or equal to {max}",patternMismatch:"Please match the format requested.",valueMissing:"Please fill in this field.",stepMismatch:"Please enter a value that is a multiple of {step}.",badInput:'"{value}" does not match the expected type.',typeMismatch:{generic:'"{value}" does not match the expected type.',email:'"{value}" must be a valid email address.',number:'"{value}" must be a number.',tel:'"{value}" must be a valid phone number.',url:'"{value}" must a valid URL.'}},_e={selectAll:"Select all",currentSelection:"{n} selected"},C={optional:ye,validations:fe,selections:_e},L=Symbol(),I=o=>{const n=e.computed(()=>e.unref(o==null?void 0:o.locale)??"en-US"),t=e.computed(()=>o!=null&&o.messages&&n.value in o.messages?o.messages[n.value]:C),l=e.computed(()=>(a,d={})=>{let s=N(a,t.value)??N(a,C)??"";const r=typeof d.n=="number"?d.n:void 0;return s=ve(s,r),xe(s,d)});return{locale:n,t:l}},ke=(o,n)=>o.provide(L,I(n)),b=()=>e.inject(L,()=>I(),!0),N=(o,n)=>{const t=o.split(".").reduce((l,a)=>!l||typeof l=="string"?l:l[a],n);return t&&typeof t=="string"?t:void 0},ve=(o,n)=>{const t=o.split(" | ").map(a=>a.trim());if(t.length<=1)return o;let l=1;return n===0&&(l=0),n&&(n<=0||n>1)&&(l=2),t.length===2?l===1?t[0]:t[1]:t[l]},xe=(o,n)=>n?Object.entries(n).reduce((l,[a,d])=>d===void 0?l:l.replace(new RegExp(`{${a}}`,"gi"),d.toString()),o).replace(/\s?{.*}\s?/gi,""):o,g=o=>({requiredTypeClass:e.computed(()=>({[`onyx-use-${o.requiredMarker}`]:o.requiredMarker})),requiredMarkerClass:e.computed(()=>({"onyx-required-marker":o.required,"onyx-optional-marker":!o.required}))}),he={class:"onyx-checkbox__container"},ge=["aria-label","title","indeterminate","disabled","required"],B=e.defineComponent({__name:"OnyxCheckbox",props:{density:{},required:{type:Boolean,default:!1},requiredMarker:{},modelValue:{type:Boolean,default:!1},label:{},indeterminate:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},hideLabel:{type:Boolean},truncation:{default:"ellipsis"},skeleton:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,{requiredMarkerClass:l,requiredTypeClass:a}=g(t),d=n,s=e.computed({get:()=>t.modelValue,set:c=>d("update:modelValue",c)}),r=e.ref(!1),{densityClass:u}=_(t);return(c,p)=>t.skeleton?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-checkbox-skeleton",e.unref(u)])},[e.createVNode(k,{class:"onyx-checkbox-skeleton__input"}),t.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(k,{key:0,class:"onyx-checkbox-skeleton__label"}))],2)):(e.openBlock(),e.createElementBlock("label",{key:1,class:e.normalizeClass(["onyx-checkbox",[e.unref(a),e.unref(u)]])},[e.createElementVNode("div",he,[t.loading?(e.openBlock(),e.createBlock(e.unref(x),{key:0,class:"onyx-checkbox__loading",type:"circle"})):e.withDirectives((e.openBlock(),e.createElementBlock("input",{key:1,"onUpdate:modelValue":p[0]||(p[0]=m=>s.value=m),"aria-label":t.hideLabel?t.label:void 0,title:t.hideLabel?t.label:void 0,class:e.normalizeClass(["onyx-checkbox__input",{"onyx-checkbox__input--touched":r.value}]),type:"checkbox",indeterminate:t.indeterminate,disabled:t.disabled,required:t.required,onBlur:p[1]||(p[1]=m=>r.value=!0)},null,42,ge)),[[e.vModelCheckbox,s.value]])]),t.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("p",{class:e.normalizeClass(["onyx-checkbox__label",[`onyx-truncation-${t.truncation}`,t.truncation==="multiline"?e.unref(l):void 0]])},e.toDisplayString(t.label),3),t.truncation==="ellipsis"?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-checkbox__marker",[e.unref(l)]])},null,2)):e.createCommentVNode("",!0)],64))],2))}}),be=["disabled"],Be={key:0,class:"onyx-checkbox-group__label"},Ce=e.defineComponent({__name:"OnyxCheckboxGroup",props:{density:{},options:{},modelValue:{default:()=>[]},headline:{},direction:{default:"vertical"},withCheckAll:{type:Boolean,default:!1},checkAllLabel:{},disabled:{type:Boolean,default:!1},skeleton:{}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,{densityClass:l}=_(t),a=n,{t:d}=b(),s=(p,m)=>{const i=m?[...t.modelValue,p]:t.modelValue.filter(y=>y!==p);a("update:modelValue",i)},r=e.computed(()=>t.options.filter(p=>!p.disabled&&!p.skeleton)),u=p=>{const m=p?r.value.map(({id:i})=>i):[];a("update:modelValue",m)},c=e.computed(()=>{const p=r.value.map(({id:i})=>i),m=t.modelValue.filter(i=>p.includes(i));return!p.length||!m.length?{modelValue:!1}:m.length===p.length?{modelValue:!0}:{indeterminate:!0,modelValue:!1}});return(p,m)=>(e.openBlock(),e.createElementBlock("fieldset",{class:e.normalizeClass(["onyx-checkbox-group",e.unref(l)]),disabled:t.disabled},[t.headline?(e.openBlock(),e.createElementBlock("legend",Be,[e.createVNode(e.unref(V),{is:"h3"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.headline),1)]),_:1})])):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["onyx-checkbox-group__content",{"onyx-checkbox-group__content--horizontal":t.direction==="horizontal"}])},[t.skeleton===void 0?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[t.withCheckAll?(e.openBlock(),e.createBlock(B,e.mergeProps({key:0},c.value,{label:t.checkAllLabel||e.unref(d)("selections.selectAll"),"onUpdate:modelValue":u}),null,16,["label"])):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,i=>(e.openBlock(),e.createBlock(B,e.mergeProps({key:i.id.toString()},i,{"model-value":t.modelValue.includes(i.id),"onUpdate:modelValue":y=>s(i.id,y)}),null,16,["model-value","onUpdate:modelValue"]))),128))],64)):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(t.skeleton,i=>(e.openBlock(),e.createBlock(B,{key:i,label:`Skeleton ${i}`,skeleton:""},null,8,["label"]))),128))],2)],10,be))}}),Ee='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 32 32"><path d="M25.899 6.1C23.166 3.367 19.583 2 16 2S8.834 3.367 6.101 6.1c-5.467 5.467-5.467 14.332 0 19.799C8.834 28.633 12.417 30 16 30s7.166-1.367 9.899-4.101c5.468-5.467 5.468-14.331 0-19.799m-1.414 18.385C22.219 26.752 19.205 28 16 28s-6.219-1.248-8.485-3.515C5.248 22.219 4 19.205 4 16s1.248-6.219 3.515-8.485C9.781 5.248 12.795 4 16 4s6.219 1.248 8.485 3.515S28 12.795 28 16s-1.248 6.219-3.515 8.485"/><path d="M20.814 9.771 16 14.586l-4.814-4.815-1.415 1.414L14.586 16l-4.815 4.814 1.415 1.415L16 17.414l4.814 4.815 1.415-1.415L17.414 16l4.815-4.815z"/></svg>',Ve={class:"onyx-empty"},Se={class:"onyx-empty__label onyx-text onyx-truncation-multiline"},Oe=e.defineComponent({__name:"OnyxEmpty",setup(o){return(n,t)=>(e.openBlock(),e.createElementBlock("div",Ve,[e.renderSlot(n.$slots,"icon",{},()=>[e.createVNode(v,{icon:e.unref(Ee),size:"48px"},null,8,["icon"])]),e.createElementVNode("div",Se,[e.renderSlot(n.$slots,"default")])]))}}),V=e.defineComponent({__name:"OnyxHeadline",props:{is:{},monospace:{type:Boolean,default:!1}},setup(o){const n=o;return(t,l)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n.is),{class:e.normalizeClass(["onyx-headline",`onyx-headline--${n.is}`,n.monospace?"onyx-headline--monospace":""])},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},8,["class"]))}}),$e=["h1","h2","h3","h4","h5","h6"],Ne=["12px","16px","24px","32px","48px","64px","96px"],we=["aria-label","title","disabled"],Te=e.defineComponent({__name:"OnyxIconButton",props:{density:{},label:{},disabled:{type:Boolean,default:!1},type:{default:"button"},variation:{default:"primary"},loading:{type:Boolean},icon:{}},emits:["click"],setup(o,{emit:n}){const t=o,{densityClass:l}=_(t),a=n;return(d,s)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["onyx-icon-button",[`onyx-icon-button--${t.variation}`,{"onyx-icon-button--loading":t.loading},e.unref(l)]]),"aria-label":t.label,title:t.label,disabled:t.disabled||t.loading,onClick:s[0]||(s[0]=r=>a("click"))},[t.loading?(e.openBlock(),e.createBlock(x,{key:0,type:"circle"})):t.icon?(e.openBlock(),e.createBlock(v,{key:1,icon:t.icon},null,8,["icon"])):e.renderSlot(d.$slots,"default",{key:2})],10,we))}}),Le={class:"onyx-truncation-ellipsis"},Ie={class:"onyx-input__wrapper"},Me=["placeholder","type","required","autocapitalize","autocomplete","autofocus","name","pattern","readonly","disabled","minlength","maxlength","aria-label","title"],ze={key:0,class:"onyx-input__footer onyx-text--small"},qe={key:0,class:"onyx-truncation-ellipsis"},De={key:1,class:"onyx-input__counter"},Pe=e.defineComponent({__name:"OnyxInput",props:{density:{},required:{type:Boolean,default:!1},requiredMarker:{},label:{},modelValue:{default:""},type:{default:"text"},placeholder:{},autocapitalize:{default:"sentences"},autocomplete:{},autofocus:{type:Boolean},name:{},pattern:{},readonly:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},maxlength:{},minlength:{},withCounter:{type:Boolean},message:{},hideLabel:{type:Boolean}},emits:["update:modelValue","change","focus","blur"],setup(o,{emit:n}){const t=o,l=n,{requiredMarkerClass:a,requiredTypeClass:d}=g(t),{densityClass:s}=_(t),r=e.computed({get:()=>t.modelValue,set:m=>l("update:modelValue",m)}),u=m=>{const i=m.target.value;l("change",i)},c=e.computed(()=>t.pattern instanceof RegExp?t.pattern.source:t.pattern),p=e.computed(()=>t.withCounter&&t.maxlength);return(m,i)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["onyx-input",e.unref(d),e.unref(s)])},[e.createElementVNode("label",null,[t.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-input__label","onyx-text--small",e.unref(a)])},[e.createElementVNode("div",Le,e.toDisplayString(t.label),1)],2)),e.createElementVNode("div",Ie,[t.loading?(e.openBlock(),e.createBlock(x,{key:0,class:"onyx-input__loading",type:"circle"})):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":i[0]||(i[0]=y=>r.value=y),class:"onyx-input__native",placeholder:t.placeholder,type:t.type,required:t.required,autocapitalize:t.autocapitalize,autocomplete:t.autocomplete,autofocus:t.autofocus,name:t.name,pattern:c.value,readonly:t.readonly,disabled:t.disabled||t.loading,minlength:t.minlength,maxlength:t.maxlength,"aria-label":t.hideLabel?t.label:void 0,title:t.hideLabel?t.label:void 0,onChange:u,onFocus:i[1]||(i[1]=y=>l("focus")),onBlur:i[2]||(i[2]=y=>l("blur"))},null,40,Me),[[e.vModelDynamic,r.value]])])]),t.message||p.value?(e.openBlock(),e.createElementBlock("div",ze,[t.message?(e.openBlock(),e.createElementBlock("span",qe,e.toDisplayString(t.message),1)):e.createCommentVNode("",!0),p.value?(e.openBlock(),e.createElementBlock("span",De,e.toDisplayString(r.value.length)+"/"+e.toDisplayString(t.maxlength),1)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],2))}}),Ae=["email","password","search","tel","text","url"],Ue=["none","sentences","words","characters"],Re='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 32 32"><path d="M12.2 10.55v2h5.836l-8.193 8.193 1.414 1.414 8.193-8.193V19.8h2v-9.25z"/></svg>',Fe=o=>/^http(s?):\/\//.test(o),Ye=["href","target","rel"],je=e.defineComponent({__name:"OnyxLink",props:{href:{},target:{default:"_self"},withExternalIcon:{type:[Boolean,String],default:"auto"}},emits:["click"],setup(o,{emit:n}){const t=o,l=n,a=e.computed(()=>t.withExternalIcon!=="auto"?t.withExternalIcon:Fe(t.href));return(d,s)=>(e.openBlock(),e.createElementBlock("a",{class:"onyx-link",href:t.href,target:t.target,rel:t.target==="_blank"?"noreferrer":void 0,onClick:s[0]||(s[0]=r=>l("click"))},[e.renderSlot(d.$slots,"default"),a.value?(e.openBlock(),e.createBlock(v,{key:0,class:"onyx-link__icon",icon:e.unref(Re),size:"16px"},null,8,["icon"])):e.createCommentVNode("",!0)],8,Ye))}}),Ze=["_self","_blank","_parent","_top"],M=o=>o,Ge=(()=>{let o=1;return()=>o++})(),S=o=>`${o}-${Ge()}`,He=M(o=>{const n=e.computed(()=>e.unref(o.multiselect)??!1),t=new Map,l=s=>(t.has(s)||t.set(s,S("listbox-option")),t.get(s)),a=e.ref(!1);e.watchEffect(()=>{var r;if(o.activeOption.value==null||!a.value)return;const s=l(o.activeOption.value);(r=document.getElementById(s))==null||r.scrollIntoView({block:"nearest",inline:"nearest"})});const d=s=>{var r,u,c,p,m,i,y;switch(s.key){case" ":s.preventDefault(),o.activeOption.value!=null&&((r=o.onSelect)==null||r.call(o,o.activeOption.value));break;case"ArrowUp":case"ArrowDown":if(s.preventDefault(),o.activeOption.value==null){(u=o.onActivateFirst)==null||u.call(o);return}s.key==="ArrowDown"?(c=o.onActivateNext)==null||c.call(o,o.activeOption.value):(p=o.onActivatePrevious)==null||p.call(o,o.activeOption.value);break;case"Home":s.preventDefault(),(m=o.onActivateFirst)==null||m.call(o);break;case"End":s.preventDefault(),(i=o.onActivateLast)==null||i.call(o);break;default:(y=o.onTypeAhead)==null||y.call(o,s.key)}};return{elements:{listbox:e.computed(()=>({role:"listbox","aria-multiselectable":n.value,"aria-label":e.unref(o.label),tabindex:"0","aria-activedescendant":o.activeOption.value!=null?l(o.activeOption.value):void 0,onFocus:()=>a.value=!0,onBlur:()=>a.value=!1,onKeydown:d})),group:e.computed(()=>s=>({role:"group","aria-label":s.label})),option:e.computed(()=>s=>{const r=s.selected??!1;return{id:l(s.value),role:"option","aria-label":s.label,"aria-checked":n.value?r:void 0,"aria-selected":n.value?void 0:r,"aria-disabled":s.disabled,onClick:()=>{var u;return(u=o.onSelect)==null?void 0:u.call(o,s.value)}}})},state:{isFocused:a}}}),Ke=M(o=>{const n=S("tooltip"),t=e.ref(!1);let l;const a=e.computed(()=>{const i=e.unref(o.open);return typeof i!="object"?200:i.debounce}),d=e.computed(()=>{const i=e.unref(o.open);return typeof i!="object"?i:i.type}),s=e.computed({get:()=>t.value,set:i=>{clearTimeout(l),l=setTimeout(()=>{t.value=i},a.value)}}),r=e.computed(()=>typeof d.value=="boolean"?d.value:s.value),u=()=>{t.value=!t.value},c=e.computed(()=>{if(d.value==="hover")return{onMouseover:()=>s.value=!0,onMouseout:()=>s.value=!1,onFocusin:()=>t.value=!0,onFocusout:()=>t.value=!1}}),p=i=>{i.key==="Escape"&&(t.value=!1)},m=i=>{var h;const y=(h=document.getElementById(n))==null?void 0:h.parentElement;if(!y||!(i.target instanceof Node))return;!y.contains(i.target)&&(t.value=!1)};return document.addEventListener("keydown",p),e.watchEffect(()=>{d.value==="click"?document.addEventListener("click",m):document.removeEventListener("click",m)}),e.onBeforeUnmount(()=>{document.addEventListener("keydown",p),document.addEventListener("click",m)}),{elements:{trigger:e.computed(()=>({"aria-describedby":n,onClick:d.value==="click"?u:void 0,...c.value})),tooltip:e.computed(()=>({role:"tooltip",id:n,tabindex:"-1",...c.value}))},state:{isVisible:r}}}),Xe={class:"onyx-truncation-ellipsis"},We=e.defineComponent({__name:"OnyxListboxOption",props:{active:{type:Boolean}},setup(o){const n=o;return(t,l)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(["onyx-listbox-option",{"onyx-listbox-option--active":n.active}])},[e.createElementVNode("span",Xe,[e.renderSlot(t.$slots,"default")])],2))}}),Je={class:"onyx-listbox"},Qe={key:0,class:"onyx-listbox__message onyx-text--small"},et=e.defineComponent({__name:"OnyxListbox",props:{label:{},options:{},message:{},modelValue:{}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,l=n,a=e.ref();e.watch(()=>t.modelValue,r=>{a.value=r});const{elements:{listbox:d,option:s}}=He({label:e.computed(()=>t.label),selectedOption:e.computed(()=>t.modelValue),activeOption:a,onSelect:r=>{t.modelValue===r?l("update:modelValue",void 0):l("update:modelValue",r)},onActivateFirst:()=>{var r;return a.value=(r=t.options.at(0))==null?void 0:r.id},onActivateLast:()=>{var r;return a.value=(r=t.options.at(-1))==null?void 0:r.id},onActivateNext:r=>{const u=t.options.findIndex(c=>c.id===r);u<t.options.length-1&&(a.value=t.options[u+1].id)},onActivatePrevious:r=>{const u=t.options.findIndex(c=>c.id===r);u>0&&(a.value=t.options[u-1].id)},onTypeAhead:r=>{const u=t.options.find(c=>c.label.toLowerCase().trim().startsWith(r.toLowerCase()));u&&(a.value=u.id)}});return(r,u)=>(e.openBlock(),e.createElementBlock("div",Je,[e.createElementVNode("ul",e.mergeProps(e.unref(d),{class:"onyx-listbox__options"}),[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,c=>(e.openBlock(),e.createBlock(We,e.mergeProps({key:c.id.toString()},e.unref(s)({value:c.id,label:c.label,disabled:c.disabled,selected:c.id===t.modelValue}),{active:c.id===a.value}),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(c.label),1)]),_:2},1040,["active"]))),128))],16),t.message?(e.openBlock(),e.createElementBlock("span",Qe,e.toDisplayString(t.message),1)):e.createCommentVNode("",!0)]))}}),tt={key:0,class:"onyx-page__sidebar"},nt={class:"onyx-page__main"},ot={key:1,class:"onyx-page__footer"},lt={key:2,class:"onyx-page__toasts"},at=e.defineComponent({__name:"OnyxPageLayout",props:{footerAsideSidebar:{type:Boolean},hideSidebar:{type:Boolean}},setup(o){const n=o,t=e.useSlots(),l=e.computed(()=>{let a="";return!t.footer&&t.sidebar&&(a="onyx-page--side-main"),t.footer&&(!t.sidebar||n.hideSidebar)&&(a="onyx-page--main-footer"),t.footer&&t.sidebar&&(n.footerAsideSidebar?a="onyx-page--side-main-footer-partial":a="onyx-page--side-main-footer-full"),a});return(a,d)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["onyx-page",l.value])},[e.unref(t).sidebar&&!n.hideSidebar?(e.openBlock(),e.createElementBlock("aside",tt,[e.renderSlot(a.$slots,"sidebar")])):e.createCommentVNode("",!0),e.createElementVNode("main",nt,[e.renderSlot(a.$slots,"default")]),e.unref(t).footer?(e.openBlock(),e.createElementBlock("footer",ot,[e.renderSlot(a.$slots,"footer")])):e.createCommentVNode("",!0),e.unref(t).toasts?(e.openBlock(),e.createElementBlock("div",lt,[e.renderSlot(a.$slots,"toasts")])):e.createCommentVNode("",!0)],2))}}),st=["title"],rt=["required","name","value","checked","disabled"],w=e.defineComponent({__name:"OnyxRadioButton",props:{id:{},label:{},value:{},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},truncation:{default:"ellipsis"},skeleton:{type:Boolean},density:{},name:{},selected:{type:Boolean,default:!1},required:{type:Boolean,default:!1},errorMessage:{}},setup(o){const n=o,t=e.ref(),{densityClass:l}=_(n);return e.watchEffect(()=>{var a;return(a=t.value)==null?void 0:a.setCustomValidity(n.errorMessage??"")}),(a,d)=>n.skeleton?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-radio-button-skeleton",e.unref(l)])},[e.createVNode(k,{class:"onyx-radio-button-skeleton__input"}),e.createVNode(k,{class:"onyx-radio-button-skeleton__label"})],2)):(e.openBlock(),e.createElementBlock("label",{key:1,class:e.normalizeClass(["onyx-radio-button",e.unref(l)]),title:n.errorMessage},[n.loading?(e.openBlock(),e.createBlock(e.unref(x),{key:0,class:"onyx-radio-button__loading",type:"circle"})):(e.openBlock(),e.createElementBlock("input",{key:1,ref_key:"selectorRef",ref:t,class:"onyx-radio-button__selector",type:"radio",required:n.required,name:n.name,value:n.id,checked:n.selected,disabled:n.disabled},null,8,rt)),e.createElementVNode("span",{class:e.normalizeClass(["onyx-radio-button__label",[`onyx-truncation-${n.truncation}`]])},e.toDisplayString(n.label),3)],10,st))}}),ct=["disabled"],it={key:0,class:"onyx-radio-button-group__headline"},dt=e.defineComponent({__name:"OnyxRadioButtonGroup",props:{density:{},required:{type:Boolean,default:!1},requiredMarker:{},name:{default:()=>S("radio-button-group-name")},modelValue:{},headline:{default:""},disabled:{type:Boolean,default:!1},errorMessage:{default:""},direction:{default:"vertical"},options:{},skeleton:{}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,{densityClass:l}=_(t),{requiredMarkerClass:a,requiredTypeClass:d}=g(t),s=n,r=u=>s("update:modelValue",t.options.find(({id:c})=>u.target.value===c));return(u,c)=>(e.openBlock(),e.createElementBlock("fieldset",{class:e.normalizeClass(["onyx-radio-button-group",e.unref(l),e.unref(d)]),disabled:t.disabled,onChange:c[0]||(c[0]=p=>r(p))},[t.headline?(e.openBlock(),e.createElementBlock("legend",it,[e.createVNode(V,{is:"h3",class:e.normalizeClass(e.unref(a))},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.headline),1)]),_:1},8,["class"])])):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["onyx-radio-button-group__content",{"onyx-radio-button-group__content--horizontal":t.direction==="horizontal"}])},[t.skeleton===void 0?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(t.options,p=>{var m;return e.openBlock(),e.createBlock(w,e.mergeProps({key:p.id.toString()},p,{name:t.name,"error-message":t.errorMessage,selected:p.id===((m=t.modelValue)==null?void 0:m.id),required:t.required}),null,16,["name","error-message","selected","required"])}),128)):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(t.skeleton,p=>(e.openBlock(),e.createBlock(w,{id:`skeleton-${p}`,key:p,label:"Skeleton ${i}",name:t.name,skeleton:""},null,8,["id","name"]))),128))],2)],42,ct))}}),ut='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="m22.29 18.83 1.41 1.41-7.71 7.71-7.71-7.71 1.41-1.41 6.29 6.29 6.29-6.29ZM16 6.87l6.29 6.29 1.41-1.41-7.71-7.71-7.71 7.71 1.41 1.41 6.29-6.29Z"/></svg>',pt={class:"onyx-truncation-ellipsis"},mt={class:"onyx-select__wrapper"},yt=["placeholder","required","disabled","aria-label","title"],ft={key:0,class:"onyx-select__footer onyx-text--small onyx-truncation-ellipsis"},_t=e.defineComponent({__name:"OnyxSelect",props:{density:{},required:{type:Boolean},requiredMarker:{},modelValue:{},label:{},hideLabel:{type:Boolean,default:!1},disabled:{type:Boolean},skeleton:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},placeholder:{},multiple:{},message:{}},emits:["update:modelValue"],setup(o){const n=o,{t}=b(),l=e.computed(()=>{var c;if(n.multiple)return typeof n.multiple=="boolean"?"summary":((c=n.multiple)==null?void 0:c.textMode)??"summary"}),a=e.computed(()=>{if(n.modelValue&&l.value==="preview")return n.modelValue.length}),d=e.computed(()=>{if(Array.isArray(n.modelValue)){const c=n.modelValue.length;if(!c)return"";if(c===1)return n.modelValue[0];switch(l.value){case"preview":return n.modelValue.join(", ");case"summary":default:return t.value("selections.currentSelection",{n:c})}}return n.modelValue??""}),{requiredMarkerClass:s,requiredTypeClass:r}=g(n),{densityClass:u}=_(n);return(c,p)=>n.skeleton?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-select-skeleton",e.unref(u)])},[n.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(e.unref(k),{key:0,class:"onyx-select-skeleton__label"})),e.createVNode(e.unref(k),{class:"onyx-select-skeleton__input"})],2)):(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["onyx-select",e.unref(r),e.unref(u),n.readonly?"onyx-select--readonly":"onyx-select--editable"])},[e.createElementVNode("label",null,[n.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-select__label","onyx-text--small",e.unref(s)])},[e.createElementVNode("div",pt,e.toDisplayString(n.label),1)],2)),e.createElementVNode("div",mt,[n.loading?(e.openBlock(),e.createBlock(x,{key:0,class:"onyx-select__loading",type:"circle"})):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":p[0]||(p[0]=m=>d.value=m),class:"onyx-select__input onyx-truncation-ellipsis",placeholder:n.placeholder,type:"text",role:"presentation",required:n.required,readonly:"",disabled:n.disabled||n.loading,"aria-label":n.hideLabel?n.label:void 0,title:n.hideLabel?n.label:void 0},null,8,yt),[[e.vModelText,d.value]]),a.value?(e.openBlock(),e.createBlock(e.unref(P),{key:1,text:d.value,position:"bottom"},{default:e.withCtx(()=>[e.createVNode(e.unref(T),{class:"onyx-select__badge",variation:"neutral"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.value),1)]),_:1})]),_:1},8,["text"])):e.createCommentVNode("",!0),e.createVNode(e.unref(v),{icon:e.unref(ut),class:"onyx-select__icon"},null,8,["icon"])])]),n.message?(e.openBlock(),e.createElementBlock("div",ft,e.toDisplayString(n.message),1)):e.createCommentVNode("",!0)],2))}}),kt=["summary","preview"],z=(o,n)=>{const t=Object.entries(o).filter(([a,d])=>d!==void 0),l=Object.entries(n).filter(([a,d])=>d!==void 0);return t.length!==l.length?!1:t.every(([a,d])=>d===n[a])},q=()=>Object.entries(Object.getOwnPropertyDescriptors(ValidityState.prototype)).filter(([o,n])=>n.enumerable).map(([o])=>o),D=o=>q().reduce((n,t)=>(n[t]=o[t],n),{}),vt=o=>{if(o.valueMissing)return"valueMissing";const n=q().filter(t=>t!=="valid").sort();for(const t of n)if(t in o&&o[t])return t},xt='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 32 32"><path d="m21.311 10.793-8.293 8.293-3.291-3.292-1.415 1.415 4.706 4.705 9.707-9.707z"/></svg>',ht='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 32 32"><path d="m22.707 10.707-1.414-1.414L16 14.586l-5.293-5.293-1.414 1.414L14.586 16l-5.293 5.293 1.414 1.414L16 17.414l5.293 5.293 1.414-1.414L17.414 16z"/></svg>',gt=["title"],bt=["aria-label","disabled","required"],Bt={class:"onyx-switch__container"},Ct={class:"onyx-switch__icon"},Et=e.defineComponent({__name:"OnyxSwitch",props:{density:{},required:{type:Boolean},requiredMarker:{},modelValue:{type:Boolean,default:!1},label:{},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},errorMessage:{},hideLabel:{type:Boolean},truncation:{default:"ellipsis"},skeleton:{type:Boolean,default:!1}},emits:["update:modelValue","validityChange"],setup(o,{emit:n}){var m;const t=o,l=n,{requiredMarkerClass:a,requiredTypeClass:d}=g(t),{errorMessage:s}=e.toRefs(t),{densityClass:r}=_(t),u=e.ref(),c=e.ref((m=u.value)==null?void 0:m.validity),p=e.computed({get:()=>t.modelValue,set:i=>{l("update:modelValue",i)}});return e.watch([u,s],()=>{u.value&&u.value.setCustomValidity(t.errorMessage||"")}),e.watch([u,p,s],()=>{if(!u.value)return;const i=D(u.value.validity);(!c.value||!z(i,c.value))&&(c.value=i,l("validityChange",c.value))},{immediate:!0}),(i,y)=>t.skeleton?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-switch-skeleton",e.unref(r)])},[e.createVNode(k,{class:"onyx-switch-skeleton__input"}),t.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(k,{key:0,class:"onyx-switch-skeleton__label"}))],2)):(e.openBlock(),e.createElementBlock("label",{key:1,class:e.normalizeClass(["onyx-switch",[e.unref(d),e.unref(r)]]),title:t.hideLabel?t.label:void 0},[e.withDirectives(e.createElementVNode("input",{ref_key:"inputElement",ref:u,"onUpdate:modelValue":y[0]||(y[0]=f=>p.value=f),type:"checkbox",role:"switch",class:e.normalizeClass({"onyx-switch__input":!0,"onyx-switch__loading":t.loading}),"aria-label":t.hideLabel?t.label:void 0,disabled:t.disabled||t.loading,required:t.required},null,10,bt),[[e.vModelCheckbox,p.value]]),e.createElementVNode("span",Bt,[e.createElementVNode("span",Ct,[t.loading?(e.openBlock(),e.createBlock(e.unref(x),{key:0,class:"onyx-switch__spinner",type:"circle"})):(e.openBlock(),e.createBlock(e.unref(v),{key:1,icon:p.value?e.unref(xt):e.unref(ht),size:"24px"},null,8,["icon"]))])]),t.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["onyx-switch__label",[`onyx-truncation-${t.truncation}`,e.unref(a)]])},e.toDisplayString(t.label),3))],10,gt))}}),Vt={class:"onyx-tooltip-wrapper"},P=e.defineComponent({__name:"OnyxTooltip",props:{text:{},icon:{},color:{default:"neutral"},position:{default:"top"},fitParent:{type:Boolean,default:!1},open:{type:[String,Boolean,Object],default:"hover"}},setup(o){const n=o,{elements:{trigger:t,tooltip:l},state:{isVisible:a}}=Ke({open:e.computed(()=>n.open)});return(d,s)=>(e.openBlock(),e.createElementBlock("div",Vt,[e.createElementVNode("div",e.mergeProps(e.unref(l),{class:["onyx-tooltip onyx-text--small onyx-truncation-multiline",{"onyx-tooltip--danger":n.color==="danger","onyx-tooltip--bottom":n.position==="bottom","onyx-tooltip--fit-parent":n.fitParent,"onyx-tooltip--hidden":!e.unref(a)}]}),[n.icon?(e.openBlock(),e.createBlock(v,{key:0,icon:n.icon,size:"16px"},null,8,["icon"])):e.createCommentVNode("",!0),e.renderSlot(d.$slots,"tooltip",{},()=>[e.createElementVNode("span",null,e.toDisplayString(n.text),1)])],16),e.createElementVNode("div",e.normalizeProps(e.guardReactiveProps(e.unref(t))),[e.renderSlot(d.$slots,"default")],16)]))}}),St=["top","bottom"],Ot=Object.keys(C.validations.typeMismatch),$t={key:0,class:"onyx-test-input__error","aria-live":"polite"},Nt={class:"onyx-test-input__info"},wt=e.defineComponent({__name:"TestInput",props:{modelValue:{default:""},label:{default:""},errorMessage:{},required:{type:Boolean},pattern:{},type:{default:"text"},max:{},maxLength:{},min:{},step:{},minLength:{}},emits:["update:modelValue","change","validityChange"],setup(o,{emit:n}){var i;const t=o,l=n,{t:a}=b(),{errorMessage:d}=e.toRefs(t),s=e.ref(!1),r=e.ref(null),u=e.ref((i=r.value)==null?void 0:i.validity),c=e.computed({get:()=>t.modelValue,set:y=>l("update:modelValue",y)}),p=e.computed(()=>{if(!u.value||u.value.valid)return"";const y=vt(u.value);if(t.errorMessage||y==="customError")return t.errorMessage;if(!y)return"";if(y==="typeMismatch"){const f=Ot.includes(t.type)?t.type:"generic";return a.value(`validations.typeMismatch.${f}`,{value:c.value})}return a.value(`validations.${y}`,{value:c.value,n:c.value.toString().length,minLength:t.minLength,maxLength:t.maxLength,min:t.min,max:t.max,step:t.step})}),m=y=>{const f=y.target;l("change",f.value)};return e.watch([r,d],()=>{r.value&&r.value.setCustomValidity(t.errorMessage||"")}),e.watch([r,c,d],()=>{if(!r.value)return;const y=D(r.value.validity);(!u.value||!z(y,u.value))&&(u.value=y,l("validityChange",u.value))},{immediate:!0}),(y,f)=>{var h,O;return e.openBlock(),e.createElementBlock("label",{class:e.normalizeClass(["onyx-test-input",{"onyx-test-input--touched":s.value}])},[e.createElementVNode("span",{class:e.normalizeClass(["onyx-test-input__label",{"onyx-test-input__label--required":t.required}])},e.toDisplayString(t.label),3),e.withDirectives(e.createElementVNode("input",e.mergeProps(t,{ref_key:"inputElement",ref:r,"onUpdate:modelValue":f[0]||(f[0]=$=>c.value=$),onChange:m,onBlur:f[1]||(f[1]=$=>s.value=!0)}),null,16),[[e.vModelDynamic,c.value]]),s.value&&!((h=u.value)!=null&&h.valid)?(e.openBlock(),e.createElementBlock("p",$t,e.toDisplayString(p.value),1)):e.createCommentVNode("",!0),e.createElementVNode("p",Nt,' Model value: "'+e.toDisplayString(c.value)+'", is valid: '+e.toDisplayString((O=u.value)==null?void 0:O.valid),1)],2)}}}),Tt=["primary","secondary","neutral","danger","warning","success","info"],Lt=["small","default","large"],It=["ellipsis","multiline"],Mt=["horizontal","vertical"],zt=o=>({install:n=>{ke(n,o.i18n);const t=n.runWithContext(()=>b());e.watchEffect(()=>qt(t.t.value("optional")))}}),qt=o=>globalThis.document.body.style.setProperty("--onyx-global-optional-text",o);exports.AUTOCAPITALIZE=Ue;exports.BUTTON_MODES=me;exports.BUTTON_TYPES=ue;exports.BUTTON_VARIATIONS=pe;exports.DENSITY=j;exports.DIRECTIONS=Mt;exports.HEADLINE_TYPES=$e;exports.ICON_SIZES=Ne;exports.INPUT_TYPES=Ae;exports.LINK_TARGETS=Ze;exports.MULTISELECT_TEXT_MODE=kt;exports.ONYX_COLORS=Tt;exports.OnyxAppLayout=Y;exports.OnyxBadge=T;exports.OnyxButton=de;exports.OnyxCheckboxGroup=Ce;exports.OnyxEmpty=Oe;exports.OnyxHeadline=V;exports.OnyxIcon=v;exports.OnyxIconButton=Te;exports.OnyxInput=Pe;exports.OnyxLink=je;exports.OnyxListbox=et;exports.OnyxLoadingIndicator=x;exports.OnyxPageLayout=at;exports.OnyxRadioButtonGroup=dt;exports.OnyxSelect=_t;exports.OnyxSkeleton=k;exports.OnyxSwitch=Et;exports.OnyxTooltip=P;exports.TEXT_SIZES=Lt;exports.TOOLTIP_POSITIONS=St;exports.TRUNCATION_TYPES=It;exports.TestInput=wt;exports.createOnyx=zt;exports.useDensity=_;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),q={key:0,class:"onyx-app__nav"},M={class:"onyx-app__page"},D={key:1,class:"onyx-app__page-overlay"},A={key:2,class:"onyx-app__app-overlay"},P=e.defineComponent({__name:"OnyxAppLayout",props:{navBarAlignment:{default:"top"}},setup(o){const n=o,t=e.useSlots();return(l,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["onyx-app",{"onyx-app--horizontal":n.navBarAlignment==="left"}])},[e.unref(t).navBar?(e.openBlock(),e.createElementBlock("nav",q,[e.renderSlot(l.$slots,"navBar")])):e.createCommentVNode("",!0),e.createElementVNode("div",M,[e.renderSlot(l.$slots,"default")]),e.unref(t).pageOverlay?(e.openBlock(),e.createElementBlock("div",D,[e.renderSlot(l.$slots,"pageOverlay")])):e.createCommentVNode("",!0),e.unref(t).appOverlay?(e.openBlock(),e.createElementBlock("div",A,[e.renderSlot(l.$slots,"appOverlay")])):e.createCommentVNode("",!0)],2))}}),U=["cozy","default","compact"],f=o=>({densityClass:e.computed(()=>({[`onyx-density-${o.density}`]:o.density}))}),R=["innerHTML"],k=e.defineComponent({__name:"OnyxIcon",props:{icon:{},size:{default:"24px"},color:{default:"currentColor"}},setup(o){const n=o;return(t,l)=>(e.openBlock(),e.createElementBlock("figure",{class:e.normalizeClass(["onyx-icon",[n.size!=="24px"?`onyx-icon--${n.size}`:"",n.color!=="currentColor"?`onyx-icon--${n.color}`:""]]),"aria-hidden":"true",innerHTML:n.icon},null,10,R))}}),C=(o,n)=>{const t=o.__vccOpts||o;for(const[l,a]of n)t[l]=a;return t},F={},Y={class:"onyx-circle-spinner",viewBox:"0 0 50 50"},j=e.createElementVNode("circle",{class:"onyx-circle-spinner__circle",cx:"50%",cy:"50%",r:"45%"},null,-1),Z=[j];function G(o,n){return e.openBlock(),e.createElementBlock("svg",Y,Z)}const H=C(F,[["render",G]]),K={},X={class:"onyx-loading-dots"},W=e.createElementVNode("span",{class:"onyx-loading-dots__center"},null,-1),J=[W];function Q(o,n){return e.openBlock(),e.createElementBlock("div",X,J)}const ee=C(K,[["render",Q]]),x=e.defineComponent({__name:"OnyxLoadingIndicator",props:{type:{default:"dots"}},setup(o){const n=o;return(t,l)=>n.type==="circle"?(e.openBlock(),e.createBlock(H,{key:0})):n.type==="dots"?(e.openBlock(),e.createBlock(ee,{key:1})):e.createCommentVNode("",!0)}}),te={},oe={"aria-hidden":"true",class:"onyx-skeleton"};function ne(o,n){return e.openBlock(),e.createElementBlock("figure",oe)}const _=C(te,[["render",ne]]),le=["disabled","type"],ae={key:2,class:"onyx-button__label onyx-truncation-ellipsis"},re=e.defineComponent({__name:"OnyxButton",props:{density:{},label:{},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},type:{default:"button"},variation:{default:"primary"},mode:{default:"default"},icon:{},skeleton:{type:Boolean,default:!1}},emits:["click"],setup(o,{emit:n}){const t=o,{densityClass:l}=f(t),a=n;return(s,p)=>t.skeleton?(e.openBlock(),e.createBlock(_,{key:0,class:e.normalizeClass(["onyx-button-skeleton",e.unref(l)])},null,8,["class"])):(e.openBlock(),e.createElementBlock("button",{key:1,class:e.normalizeClass(["onyx-button",`onyx-button--${t.variation}`,`onyx-button--${t.mode}`,{"onyx-button--loading":t.loading},e.unref(l)]),disabled:t.disabled||t.loading,type:t.type,onClick:p[0]||(p[0]=r=>a("click"))},[t.icon&&!t.loading?(e.openBlock(),e.createBlock(k,{key:0,icon:t.icon},null,8,["icon"])):e.createCommentVNode("",!0),t.loading?(e.openBlock(),e.createBlock(x,{key:1,class:"onyx-button__loading"})):(e.openBlock(),e.createElementBlock("span",ae,e.toDisplayString(t.label),1))],10,le))}}),se=["button","submit","reset"],ce=["primary","secondary","danger"],ie=["default","outline","plain"],w=e.defineComponent({__name:"OnyxBadge",props:{density:{},variation:{default:"primary"},icon:{}},setup(o){const n=o,{densityClass:t}=f(n);return(l,a)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["onyx-badge",["onyx-truncation-ellipsis","onyx-text",`onyx-badge--${n.variation}`,e.unref(t)]])},[n.icon?(e.openBlock(),e.createBlock(k,{key:0,class:"onyx-badge__icon",icon:n.icon,size:n.density==="compact"?"16px":"24px"},null,8,["icon","size"])):e.renderSlot(l.$slots,"default",{key:1})],2))}}),de="(optional)",ue={tooShort:"Please lengthen this text to {minLength} characters or more (you are currently using 1 character) | Please lengthen this text to {minLength} characters or more (you are currently using {n} characters)",tooLong:"Please shorten this text to {maxLength} characters or less (you are currently using 1 character) | Please shorten this text to {maxLength} characters or less (you are currently using {n} characters)",rangeUnderflow:"Value must be greater than or equal to {min}",rangeOverflow:"Value must be less than or equal to {max}",patternMismatch:"Please match the format requested.",valueMissing:"Please fill in this field.",stepMismatch:"Please enter a value that is a multiple of {step}.",badInput:'"{value}" does not match the expected type.',typeMismatch:{generic:'"{value}" does not match the expected type.',email:'"{value}" must be a valid email address.',number:'"{value}" must be a number.',tel:'"{value}" must be a valid phone number.',url:'"{value}" must a valid URL.'}},pe={selectAll:"Select all",currentSelection:"{n} selected"},O={optional:de,validations:ue,selections:pe},T=Symbol(),L=o=>{const n=e.computed(()=>e.unref(o==null?void 0:o.locale)??"en-US"),t=e.computed(()=>o!=null&&o.messages&&n.value in o.messages?o.messages[n.value]:O),l=e.computed(()=>(a,s={})=>{let p=$(a,t.value)??$(a,O)??"";const r=typeof s.n=="number"?s.n:void 0;return p=ye(p,r),fe(p,s)});return{locale:n,t:l}},me=(o,n)=>o.provide(T,L(n)),E=()=>e.inject(T,()=>L(),!0),$=(o,n)=>{const t=o.split(".").reduce((l,a)=>!l||typeof l=="string"?l:l[a],n);return t&&typeof t=="string"?t:void 0},ye=(o,n)=>{const t=o.split(" | ").map(a=>a.trim());if(t.length<=1)return o;let l=1;return n===0&&(l=0),n&&(n<=0||n>1)&&(l=2),t.length===2?l===1?t[0]:t[1]:t[l]},fe=(o,n)=>n?Object.entries(n).reduce((l,[a,s])=>s===void 0?l:l.replace(new RegExp(`{${a}}`,"gi"),s.toString()),o).replace(/\s?{.*}\s?/gi,""):o,b=o=>({requiredTypeClass:e.computed(()=>({[`onyx-use-${o.requiredMarker}`]:o.requiredMarker})),requiredMarkerClass:e.computed(()=>({"onyx-required-marker":o.required,"onyx-optional-marker":!o.required}))}),_e=()=>Object.entries(Object.getOwnPropertyDescriptors(ValidityState.prototype)).filter(([o,n])=>n.enumerable).map(([o])=>o),ke=o=>_e().reduce((n,t)=>(n[t]=o[t],n),{}),xe=(o,n)=>{const t=Object.entries(o).filter(([a,s])=>s!==void 0),l=Object.entries(n).filter(([a,s])=>s!==void 0);return t.length!==l.length?!1:t.every(([a,s])=>s===n[a])},g=o=>{const n=e.ref(),t=e.ref(!1);return e.watch(()=>o.props.modelValue,()=>t.value=!0,{once:!0}),{vCustomValidity:{mounted:a=>{e.watchEffect(()=>a.setCustomValidity(o.props.customError??"")),e.watch([()=>o.props.customError,()=>o.props.modelValue,t],()=>{const s=ke(a.validity);!t.value||!n.value&&s.valid||n.value&&xe(s,n.value)||(n.value=s,o.emit("validityChange",n.value))},{immediate:!0})}}}},he={class:"onyx-checkbox__container"},ve=["aria-label","title","indeterminate","disabled","required"],B=e.defineComponent({__name:"OnyxCheckbox",props:{density:{},required:{type:Boolean,default:!1},requiredMarker:{},customError:{},modelValue:{type:Boolean,default:!1},label:{},indeterminate:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},hideLabel:{type:Boolean},truncation:{default:"ellipsis"},skeleton:{type:Boolean,default:!1}},emits:["update:modelValue","validityChange"],setup(o,{emit:n}){const t=o,l=n,a=e.computed({get:()=>t.modelValue,set:c=>l("update:modelValue",c)}),{requiredMarkerClass:s,requiredTypeClass:p}=b(t),{densityClass:r}=f(t),{vCustomValidity:d}=g({props:t,emit:l});return(c,u)=>t.skeleton?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-checkbox-skeleton",e.unref(r)])},[e.createVNode(_,{class:"onyx-checkbox-skeleton__input"}),t.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(_,{key:0,class:"onyx-checkbox-skeleton__label"}))],2)):(e.openBlock(),e.createElementBlock("label",{key:1,class:e.normalizeClass(["onyx-checkbox",[e.unref(p),e.unref(r)]])},[e.createElementVNode("div",he,[t.loading?(e.openBlock(),e.createBlock(e.unref(x),{key:0,class:"onyx-checkbox__loading",type:"circle"})):e.withDirectives((e.openBlock(),e.createElementBlock("input",{key:1,"onUpdate:modelValue":u[0]||(u[0]=m=>a.value=m),"aria-label":t.hideLabel?t.label:void 0,title:t.hideLabel?t.label:void 0,class:"onyx-checkbox__input",type:"checkbox",indeterminate:t.indeterminate,disabled:t.disabled,required:t.required},null,8,ve)),[[e.vModelCheckbox,a.value],[e.unref(d)]])]),t.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("p",{class:e.normalizeClass(["onyx-checkbox__label",[`onyx-truncation-${t.truncation}`,t.truncation==="multiline"?e.unref(s):void 0]])},e.toDisplayString(t.label),3),t.truncation==="ellipsis"?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-checkbox__marker",[e.unref(s)]])},null,2)):e.createCommentVNode("",!0)],64))],2))}}),be=["disabled"],ge={key:0,class:"onyx-checkbox-group__label"},Be=e.defineComponent({__name:"OnyxCheckboxGroup",props:{density:{},options:{},modelValue:{default:()=>[]},headline:{},direction:{default:"vertical"},withCheckAll:{type:Boolean,default:!1},checkAllLabel:{},disabled:{type:Boolean,default:!1},skeleton:{}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,{densityClass:l}=f(t),a=n,{t:s}=E(),p=(u,m)=>{const i=m?[...t.modelValue,u]:t.modelValue.filter(y=>y!==u);a("update:modelValue",i)},r=e.computed(()=>t.options.filter(u=>!u.disabled&&!u.skeleton)),d=u=>{const m=u?r.value.map(({id:i})=>i):[];a("update:modelValue",m)},c=e.computed(()=>{const u=r.value.map(({id:i})=>i),m=t.modelValue.filter(i=>u.includes(i));return!u.length||!m.length?{modelValue:!1}:m.length===u.length?{modelValue:!0}:{indeterminate:!0,modelValue:!1}});return(u,m)=>(e.openBlock(),e.createElementBlock("fieldset",{class:e.normalizeClass(["onyx-checkbox-group",e.unref(l)]),disabled:t.disabled},[t.headline?(e.openBlock(),e.createElementBlock("legend",ge,[e.createVNode(e.unref(V),{is:"h3"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.headline),1)]),_:1})])):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["onyx-checkbox-group__content",{"onyx-checkbox-group__content--horizontal":t.direction==="horizontal"}])},[t.skeleton===void 0?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[t.withCheckAll?(e.openBlock(),e.createBlock(B,e.mergeProps({key:0},c.value,{label:t.checkAllLabel||e.unref(s)("selections.selectAll"),"onUpdate:modelValue":d}),null,16,["label"])):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,i=>(e.openBlock(),e.createBlock(B,e.mergeProps({key:i.id.toString()},i,{"model-value":t.modelValue.includes(i.id),"onUpdate:modelValue":y=>p(i.id,y)}),null,16,["model-value","onUpdate:modelValue"]))),128))],64)):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(t.skeleton,i=>(e.openBlock(),e.createBlock(B,{key:i,label:`Skeleton ${i}`,skeleton:""},null,8,["label"]))),128))],2)],10,be))}}),Ce='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 32 32"><path d="M25.899 6.1C23.166 3.367 19.583 2 16 2S8.834 3.367 6.101 6.1c-5.467 5.467-5.467 14.332 0 19.799C8.834 28.633 12.417 30 16 30s7.166-1.367 9.899-4.101c5.468-5.467 5.468-14.331 0-19.799m-1.414 18.385C22.219 26.752 19.205 28 16 28s-6.219-1.248-8.485-3.515C5.248 22.219 4 19.205 4 16s1.248-6.219 3.515-8.485C9.781 5.248 12.795 4 16 4s6.219 1.248 8.485 3.515S28 12.795 28 16s-1.248 6.219-3.515 8.485"/><path d="M20.814 9.771 16 14.586l-4.814-4.815-1.415 1.414L14.586 16l-4.815 4.814 1.415 1.415L16 17.414l4.814 4.815 1.415-1.415L17.414 16l4.815-4.815z"/></svg>',Ee={class:"onyx-empty"},Ve={class:"onyx-empty__label onyx-text onyx-truncation-multiline"},Se=e.defineComponent({__name:"OnyxEmpty",setup(o){return(n,t)=>(e.openBlock(),e.createElementBlock("div",Ee,[e.renderSlot(n.$slots,"icon",{},()=>[e.createVNode(k,{icon:e.unref(Ce),size:"48px"},null,8,["icon"])]),e.createElementVNode("div",Ve,[e.renderSlot(n.$slots,"default")])]))}}),V=e.defineComponent({__name:"OnyxHeadline",props:{is:{},monospace:{type:Boolean,default:!1}},setup(o){const n=o;return(t,l)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n.is),{class:e.normalizeClass(["onyx-headline",`onyx-headline--${n.is}`,n.monospace?"onyx-headline--monospace":""])},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},8,["class"]))}}),Oe=["h1","h2","h3","h4","h5","h6"],$e=["12px","16px","24px","32px","48px","64px","96px"],Ne=["aria-label","title","disabled"],we=e.defineComponent({__name:"OnyxIconButton",props:{density:{},label:{},disabled:{type:Boolean,default:!1},type:{default:"button"},variation:{default:"primary"},loading:{type:Boolean},icon:{}},emits:["click"],setup(o,{emit:n}){const t=o,{densityClass:l}=f(t),a=n;return(s,p)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["onyx-icon-button",[`onyx-icon-button--${t.variation}`,{"onyx-icon-button--loading":t.loading},e.unref(l)]]),"aria-label":t.label,title:t.label,disabled:t.disabled||t.loading,onClick:p[0]||(p[0]=r=>a("click"))},[t.loading?(e.openBlock(),e.createBlock(x,{key:0,type:"circle"})):t.icon?(e.openBlock(),e.createBlock(k,{key:1,icon:t.icon},null,8,["icon"])):e.renderSlot(s.$slots,"default",{key:2})],10,Ne))}}),Te={class:"onyx-truncation-ellipsis"},Le={class:"onyx-input__wrapper"},Ie=["placeholder","type","required","autocapitalize","autocomplete","autofocus","name","pattern","readonly","disabled","minlength","maxlength","aria-label","title"],ze={key:0,class:"onyx-input__footer onyx-text--small"},qe={key:0,class:"onyx-truncation-ellipsis"},Me={key:1,class:"onyx-input__counter"},De=e.defineComponent({__name:"OnyxInput",props:{density:{},required:{type:Boolean,default:!1},requiredMarker:{},customError:{},label:{},modelValue:{default:""},type:{default:"text"},placeholder:{},autocapitalize:{default:"sentences"},autocomplete:{},autofocus:{type:Boolean},name:{},pattern:{},readonly:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},maxlength:{},minlength:{},withCounter:{type:Boolean},message:{},hideLabel:{type:Boolean}},emits:["update:modelValue","change","focus","blur","validityChange"],setup(o,{emit:n}){const t=o,l=n,{vCustomValidity:a}=g({props:t,emit:l}),{requiredMarkerClass:s,requiredTypeClass:p}=b(t),{densityClass:r}=f(t),d=e.computed({get:()=>t.modelValue,set:i=>l("update:modelValue",i)}),c=i=>{const y=i.target.value;l("change",y)},u=e.computed(()=>t.pattern instanceof RegExp?t.pattern.source:t.pattern),m=e.computed(()=>t.withCounter&&t.maxlength);return(i,y)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["onyx-input",e.unref(p),e.unref(r)])},[e.createElementVNode("label",null,[t.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-input__label","onyx-text--small",e.unref(s)])},[e.createElementVNode("div",Te,e.toDisplayString(t.label),1)],2)),e.createElementVNode("div",Le,[t.loading?(e.openBlock(),e.createBlock(x,{key:0,class:"onyx-input__loading",type:"circle"})):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":y[0]||(y[0]=h=>d.value=h),class:"onyx-input__native",placeholder:t.placeholder,type:t.type,required:t.required,autocapitalize:t.autocapitalize,autocomplete:t.autocomplete,autofocus:t.autofocus,name:t.name,pattern:u.value,readonly:t.readonly,disabled:t.disabled||t.loading,minlength:t.minlength,maxlength:t.maxlength,"aria-label":t.hideLabel?t.label:void 0,title:t.hideLabel?t.label:void 0,onChange:c,onFocus:y[1]||(y[1]=h=>l("focus")),onBlur:y[2]||(y[2]=h=>l("blur"))},null,40,Ie),[[e.vModelDynamic,d.value],[e.unref(a)]])])]),t.message||m.value?(e.openBlock(),e.createElementBlock("div",ze,[t.message?(e.openBlock(),e.createElementBlock("span",qe,e.toDisplayString(t.message),1)):e.createCommentVNode("",!0),m.value?(e.openBlock(),e.createElementBlock("span",Me,e.toDisplayString(d.value.length)+"/"+e.toDisplayString(t.maxlength),1)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],2))}}),Ae=["email","password","search","tel","text","url"],Pe=["none","sentences","words","characters"],Ue='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 32 32"><path d="M12.2 10.55v2h5.836l-8.193 8.193 1.414 1.414 8.193-8.193V19.8h2v-9.25z"/></svg>',Re=o=>/^http(s?):\/\//.test(o),Fe=["href","target","rel"],Ye=e.defineComponent({__name:"OnyxLink",props:{href:{},target:{default:"_self"},withExternalIcon:{type:[Boolean,String],default:"auto"}},emits:["click"],setup(o,{emit:n}){const t=o,l=n,a=e.computed(()=>t.withExternalIcon!=="auto"?t.withExternalIcon:Re(t.href));return(s,p)=>(e.openBlock(),e.createElementBlock("a",{class:"onyx-link",href:t.href,target:t.target,rel:t.target==="_blank"?"noreferrer":void 0,onClick:p[0]||(p[0]=r=>l("click"))},[e.renderSlot(s.$slots,"default"),a.value?(e.openBlock(),e.createBlock(k,{key:0,class:"onyx-link__icon",icon:e.unref(Ue),size:"16px"},null,8,["icon"])):e.createCommentVNode("",!0)],8,Fe))}}),je=["_self","_blank","_parent","_top"],I=o=>o,Ze=(()=>{let o=1;return()=>o++})(),S=o=>`${o}-${Ze()}`,Ge=I(o=>{const n=e.computed(()=>e.unref(o.multiselect)??!1),t=new Map,l=r=>(t.has(r)||t.set(r,S("listbox-option")),t.get(r)),a=e.ref(!1);e.watchEffect(()=>{var d;if(o.activeOption.value==null||!a.value&&!o.controlled)return;const r=l(o.activeOption.value);(d=document.getElementById(r))==null||d.scrollIntoView({block:"nearest",inline:"nearest"})});const s=r=>{var d,c,u,m,i,y,h,v;switch(r.key){case" ":r.preventDefault(),o.activeOption.value!=null&&((d=o.onSelect)==null||d.call(o,o.activeOption.value));break;case"ArrowUp":if(r.preventDefault(),o.activeOption.value==null){(c=o.onActivateLast)==null||c.call(o);return}(u=o.onActivatePrevious)==null||u.call(o,o.activeOption.value);break;case"ArrowDown":if(r.preventDefault(),o.activeOption.value==null){(m=o.onActivateFirst)==null||m.call(o);return}(i=o.onActivateNext)==null||i.call(o,o.activeOption.value);break;case"Home":r.preventDefault(),(y=o.onActivateFirst)==null||y.call(o);break;case"End":r.preventDefault(),(h=o.onActivateLast)==null||h.call(o);break;default:(v=o.onTypeAhead)==null||v.call(o,r.key)}};return{elements:{listbox:e.computed(()=>o.controlled?{role:"listbox","aria-multiselectable":n.value,"aria-label":e.unref(o.label),tabindex:"-1"}:{role:"listbox","aria-multiselectable":n.value,"aria-label":e.unref(o.label),tabindex:"0","aria-activedescendant":o.activeOption.value!=null?l(o.activeOption.value):void 0,onFocus:()=>a.value=!0,onBlur:()=>a.value=!1,onKeydown:s}),group:e.computed(()=>r=>({role:"group","aria-label":r.label})),option:e.computed(()=>r=>{const d=r.selected??!1;return{id:l(r.value),role:"option","aria-label":r.label,"aria-checked":n.value?d:void 0,"aria-selected":n.value?void 0:d,"aria-disabled":r.disabled,onClick:()=>{var c;return(c=o.onSelect)==null?void 0:c.call(o,r.value)}}})},state:{isFocused:a},internals:{getOptionId:l}}}),He=I(o=>{const n=S("tooltip"),t=e.ref(!1);let l;const a=e.computed(()=>{const i=e.unref(o.open);return typeof i!="object"?200:i.debounce}),s=e.computed(()=>{const i=e.unref(o.open);return typeof i!="object"?i:i.type}),p=e.computed({get:()=>t.value,set:i=>{clearTimeout(l),l=setTimeout(()=>{t.value=i},a.value)}}),r=e.computed(()=>typeof s.value=="boolean"?s.value:p.value),d=()=>{t.value=!t.value},c=e.computed(()=>{if(s.value==="hover")return{onMouseover:()=>p.value=!0,onMouseout:()=>p.value=!1,onFocusin:()=>t.value=!0,onFocusout:()=>t.value=!1}}),u=i=>{i.key==="Escape"&&(t.value=!1)},m=i=>{var v;const y=(v=document.getElementById(n))==null?void 0:v.parentElement;if(!y||!(i.target instanceof Node))return;!y.contains(i.target)&&(t.value=!1)};return e.onBeforeMount(()=>{document.addEventListener("keydown",u),e.watchEffect(()=>{s.value==="click"?document.addEventListener("click",m):document.removeEventListener("click",m)})}),e.onBeforeUnmount(()=>{document.addEventListener("keydown",u),document.addEventListener("click",m)}),{elements:{trigger:e.computed(()=>({"aria-describedby":n,onClick:s.value==="click"?d:void 0,...c.value})),tooltip:e.computed(()=>({role:"tooltip",id:n,tabindex:"-1",...c.value}))},state:{isVisible:r}}}),Ke={class:"onyx-truncation-ellipsis"},Xe=e.defineComponent({__name:"OnyxListboxOption",props:{active:{type:Boolean}},setup(o){const n=o;return(t,l)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(["onyx-listbox-option",{"onyx-listbox-option--active":n.active}])},[e.createElementVNode("span",Ke,[e.renderSlot(t.$slots,"default")])],2))}}),We={class:"onyx-listbox"},Je={key:0,class:"onyx-listbox__message onyx-text--small"},Qe=e.defineComponent({__name:"OnyxListbox",props:{label:{},options:{},message:{},modelValue:{}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,l=n,a=e.ref();e.watch(()=>t.modelValue,r=>{a.value=r});const{elements:{listbox:s,option:p}}=Ge({label:e.computed(()=>t.label),selectedOption:e.computed(()=>t.modelValue),activeOption:a,onSelect:r=>{t.modelValue===r?l("update:modelValue",void 0):l("update:modelValue",r)},onActivateFirst:()=>{var r;return a.value=(r=t.options.at(0))==null?void 0:r.id},onActivateLast:()=>{var r;return a.value=(r=t.options.at(-1))==null?void 0:r.id},onActivateNext:r=>{const d=t.options.findIndex(c=>c.id===r);d<t.options.length-1&&(a.value=t.options[d+1].id)},onActivatePrevious:r=>{const d=t.options.findIndex(c=>c.id===r);d>0&&(a.value=t.options[d-1].id)},onTypeAhead:r=>{const d=t.options.find(c=>c.label.toLowerCase().trim().startsWith(r.toLowerCase()));d&&(a.value=d.id)}});return(r,d)=>(e.openBlock(),e.createElementBlock("div",We,[e.createElementVNode("ul",e.mergeProps(e.unref(s),{class:"onyx-listbox__options"}),[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,c=>(e.openBlock(),e.createBlock(Xe,e.mergeProps({key:c.id.toString()},e.unref(p)({value:c.id,label:c.label,disabled:c.disabled,selected:c.id===t.modelValue}),{active:c.id===a.value}),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(c.label),1)]),_:2},1040,["active"]))),128))],16),t.message?(e.openBlock(),e.createElementBlock("span",Je,e.toDisplayString(t.message),1)):e.createCommentVNode("",!0)]))}}),et={key:0,class:"onyx-page__sidebar"},tt={class:"onyx-page__main"},ot={key:1,class:"onyx-page__footer"},nt={key:2,class:"onyx-page__toasts"},lt=e.defineComponent({__name:"OnyxPageLayout",props:{footerAsideSidebar:{type:Boolean},hideSidebar:{type:Boolean}},setup(o){const n=o,t=e.useSlots(),l=e.computed(()=>{let a="";return!t.footer&&t.sidebar&&(a="onyx-page--side-main"),t.footer&&(!t.sidebar||n.hideSidebar)&&(a="onyx-page--main-footer"),t.footer&&t.sidebar&&(n.footerAsideSidebar?a="onyx-page--side-main-footer-partial":a="onyx-page--side-main-footer-full"),a});return(a,s)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["onyx-page",l.value])},[e.unref(t).sidebar&&!n.hideSidebar?(e.openBlock(),e.createElementBlock("aside",et,[e.renderSlot(a.$slots,"sidebar")])):e.createCommentVNode("",!0),e.createElementVNode("main",tt,[e.renderSlot(a.$slots,"default")]),e.unref(t).footer?(e.openBlock(),e.createElementBlock("footer",ot,[e.renderSlot(a.$slots,"footer")])):e.createCommentVNode("",!0),e.unref(t).toasts?(e.openBlock(),e.createElementBlock("div",nt,[e.renderSlot(a.$slots,"toasts")])):e.createCommentVNode("",!0)],2))}}),at=["title"],rt=["required","name","value","checked","disabled"],N=e.defineComponent({__name:"OnyxRadioButton",props:{id:{},label:{},value:{},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},truncation:{default:"ellipsis"},skeleton:{type:Boolean},density:{},customError:{},name:{},selected:{type:Boolean,default:!1},required:{type:Boolean,default:!1}},emits:["change","validityChange"],setup(o,{emit:n}){const t=o,l=n,{vCustomValidity:a}=g({props:t,emit:l}),{densityClass:s}=f(t);return(p,r)=>t.skeleton?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-radio-button-skeleton",e.unref(s)])},[e.createVNode(_,{class:"onyx-radio-button-skeleton__input"}),e.createVNode(_,{class:"onyx-radio-button-skeleton__label"})],2)):(e.openBlock(),e.createElementBlock("label",{key:1,class:e.normalizeClass(["onyx-radio-button",e.unref(s)]),title:t.customError},[t.loading?(e.openBlock(),e.createBlock(e.unref(x),{key:0,class:"onyx-radio-button__loading",type:"circle"})):e.withDirectives((e.openBlock(),e.createElementBlock("input",{key:1,class:"onyx-radio-button__selector",type:"radio",required:t.required,name:t.name,value:t.id,checked:t.selected,disabled:t.disabled},null,8,rt)),[[e.unref(a)]]),e.createElementVNode("span",{class:e.normalizeClass(["onyx-radio-button__label",[`onyx-truncation-${t.truncation}`]])},e.toDisplayString(t.label),3)],10,at))}}),st=["disabled"],ct={key:0,class:"onyx-radio-button-group__headline"},it=e.defineComponent({__name:"OnyxRadioButtonGroup",props:{density:{},required:{type:Boolean,default:!1},requiredMarker:{},customError:{},name:{default:()=>S("radio-button-group-name")},modelValue:{},headline:{default:""},disabled:{type:Boolean,default:!1},direction:{default:"vertical"},options:{},skeleton:{}},emits:["update:modelValue","validityChange"],setup(o,{emit:n}){const t=o,{densityClass:l}=f(t),{requiredMarkerClass:a,requiredTypeClass:s}=b(t),p=n,r=d=>p("update:modelValue",t.options.find(({id:c})=>d.target.value===c));return(d,c)=>(e.openBlock(),e.createElementBlock("fieldset",{class:e.normalizeClass(["onyx-radio-button-group",e.unref(l),e.unref(s)]),disabled:t.disabled,onChange:c[0]||(c[0]=u=>r(u))},[t.headline?(e.openBlock(),e.createElementBlock("legend",ct,[e.createVNode(V,{is:"h3",class:e.normalizeClass(e.unref(a))},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.headline),1)]),_:1},8,["class"])])):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["onyx-radio-button-group__content",{"onyx-radio-button-group__content--horizontal":t.direction==="horizontal"}])},[t.skeleton===void 0?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(t.options,(u,m)=>{var i;return e.openBlock(),e.createBlock(N,e.mergeProps({key:u.id.toString()},u,{name:t.name,"custom-error":t.customError,selected:u.id===((i=t.modelValue)==null?void 0:i.id),required:t.required,onValidityChange:y=>m===0&&p("validityChange",y)}),null,16,["name","custom-error","selected","required","onValidityChange"])}),128)):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(t.skeleton,u=>(e.openBlock(),e.createBlock(N,{id:`skeleton-${u}`,key:u,label:"Skeleton ${i}",name:t.name,skeleton:""},null,8,["id","name"]))),128))],2)],42,st))}}),dt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="m22.29 18.83 1.41 1.41-7.71 7.71-7.71-7.71 1.41-1.41 6.29 6.29 6.29-6.29ZM16 6.87l6.29 6.29 1.41-1.41-7.71-7.71-7.71 7.71 1.41 1.41 6.29-6.29Z"/></svg>',ut={class:"onyx-truncation-ellipsis"},pt={class:"onyx-select__wrapper"},mt=["placeholder","required","disabled","aria-label","title"],yt={key:0,class:"onyx-select__footer onyx-text--small onyx-truncation-ellipsis"},ft=e.defineComponent({__name:"OnyxSelect",props:{density:{},required:{type:Boolean},requiredMarker:{},modelValue:{},label:{},hideLabel:{type:Boolean,default:!1},disabled:{type:Boolean},skeleton:{type:Boolean,default:!1},readonly:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},placeholder:{},multiple:{},message:{}},emits:["update:modelValue"],setup(o){const n=o,{t}=E(),l=e.computed(()=>{var c;if(n.multiple)return typeof n.multiple=="boolean"?"summary":((c=n.multiple)==null?void 0:c.textMode)??"summary"}),a=e.computed(()=>{if(n.modelValue&&l.value==="preview")return n.modelValue.length}),s=e.computed(()=>{if(Array.isArray(n.modelValue)){const c=n.modelValue.length;if(!c)return"";if(c===1)return n.modelValue[0];switch(l.value){case"preview":return n.modelValue.join(", ");case"summary":default:return t.value("selections.currentSelection",{n:c})}}return n.modelValue??""}),{requiredMarkerClass:p,requiredTypeClass:r}=b(n),{densityClass:d}=f(n);return(c,u)=>n.skeleton?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-select-skeleton",e.unref(d)])},[n.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(e.unref(_),{key:0,class:"onyx-select-skeleton__label"})),e.createVNode(e.unref(_),{class:"onyx-select-skeleton__input"})],2)):(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["onyx-select",e.unref(r),e.unref(d),n.readonly?"onyx-select--readonly":"onyx-select--editable"])},[e.createElementVNode("label",null,[n.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-select__label","onyx-text--small",e.unref(p)])},[e.createElementVNode("div",ut,e.toDisplayString(n.label),1)],2)),e.createElementVNode("div",pt,[n.loading?(e.openBlock(),e.createBlock(x,{key:0,class:"onyx-select__loading",type:"circle"})):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":u[0]||(u[0]=m=>s.value=m),class:"onyx-select__input onyx-truncation-ellipsis",placeholder:n.placeholder,type:"text",role:"presentation",required:n.required,readonly:"",disabled:n.disabled||n.loading,"aria-label":n.hideLabel?n.label:void 0,title:n.hideLabel?n.label:void 0},null,8,mt),[[e.vModelText,s.value]]),a.value?(e.openBlock(),e.createBlock(e.unref(z),{key:1,text:s.value,position:"bottom"},{default:e.withCtx(()=>[e.createVNode(e.unref(w),{class:"onyx-select__badge",variation:"neutral"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.value),1)]),_:1})]),_:1},8,["text"])):e.createCommentVNode("",!0),e.createVNode(e.unref(k),{icon:e.unref(dt),class:"onyx-select__icon"},null,8,["icon"])])]),n.message?(e.openBlock(),e.createElementBlock("div",yt,e.toDisplayString(n.message),1)):e.createCommentVNode("",!0)],2))}}),_t=["summary","preview"],kt='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 32 32"><path d="m21.311 10.793-8.293 8.293-3.291-3.292-1.415 1.415 4.706 4.705 9.707-9.707z"/></svg>',xt='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 32 32"><path d="m22.707 10.707-1.414-1.414L16 14.586l-5.293-5.293-1.414 1.414L14.586 16l-5.293 5.293 1.414 1.414L16 17.414l5.293 5.293 1.414-1.414L17.414 16z"/></svg>',ht=["title"],vt=["aria-label","disabled","required"],bt={class:"onyx-switch__container"},gt={class:"onyx-switch__icon"},Bt=e.createElementVNode("div",{class:"onyx-switch__frame"},null,-1),Ct=e.defineComponent({__name:"OnyxSwitch",props:{density:{},required:{type:Boolean},requiredMarker:{},customError:{},modelValue:{type:Boolean,default:!1},label:{},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},hideLabel:{type:Boolean},truncation:{default:"ellipsis"},skeleton:{type:Boolean,default:!1}},emits:["update:modelValue","validityChange"],setup(o,{emit:n}){const t=o,l=n,{requiredMarkerClass:a,requiredTypeClass:s}=b(t),{densityClass:p}=f(t),{vCustomValidity:r}=g({props:t,emit:l}),d=e.computed({get:()=>t.modelValue,set:c=>{l("update:modelValue",c)}});return(c,u)=>t.skeleton?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["onyx-switch-skeleton",e.unref(p)])},[e.createVNode(_,{class:"onyx-switch-skeleton__input"}),t.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(_,{key:0,class:"onyx-switch-skeleton__label"}))],2)):(e.openBlock(),e.createElementBlock("label",{key:1,class:e.normalizeClass(["onyx-switch",[e.unref(s),e.unref(p)]]),title:t.hideLabel?t.label:void 0},[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":u[0]||(u[0]=m=>d.value=m),type:"checkbox",role:"switch",class:e.normalizeClass({"onyx-switch__input":!0,"onyx-switch__loading":t.loading}),"aria-label":t.hideLabel?t.label:void 0,disabled:t.disabled||t.loading,required:t.required},null,10,vt),[[e.vModelCheckbox,d.value],[e.unref(r)]]),e.createElementVNode("span",bt,[e.createElementVNode("span",gt,[t.loading?(e.openBlock(),e.createBlock(e.unref(x),{key:0,class:"onyx-switch__spinner",type:"circle"})):(e.openBlock(),e.createBlock(e.unref(k),{key:1,icon:d.value?e.unref(kt):e.unref(xt),size:"24px"},null,8,["icon"]))]),Bt]),t.hideLabel?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["onyx-switch__label",[`onyx-truncation-${t.truncation}`,e.unref(a)]])},e.toDisplayString(t.label),3))],10,ht))}}),Et={class:"onyx-tooltip-wrapper"},z=e.defineComponent({__name:"OnyxTooltip",props:{text:{},icon:{},color:{default:"neutral"},position:{default:"top"},fitParent:{type:Boolean,default:!1},open:{type:[String,Boolean,Object],default:"hover"}},setup(o){const n=o,{elements:{trigger:t,tooltip:l},state:{isVisible:a}}=He({open:e.computed(()=>n.open)});return(s,p)=>(e.openBlock(),e.createElementBlock("div",Et,[e.createElementVNode("div",e.mergeProps(e.unref(l),{class:["onyx-tooltip onyx-text--small onyx-truncation-multiline",{"onyx-tooltip--danger":n.color==="danger","onyx-tooltip--bottom":n.position==="bottom","onyx-tooltip--fit-parent":n.fitParent,"onyx-tooltip--hidden":!e.unref(a)}]}),[n.icon?(e.openBlock(),e.createBlock(k,{key:0,icon:n.icon,size:"16px"},null,8,["icon"])):e.createCommentVNode("",!0),e.renderSlot(s.$slots,"tooltip",{},()=>[e.createElementVNode("span",null,e.toDisplayString(n.text),1)])],16),e.createElementVNode("div",e.normalizeProps(e.guardReactiveProps(e.unref(t))),[e.renderSlot(s.$slots,"default")],16)]))}}),Vt=["top","bottom"],St=["primary","secondary","neutral","danger","warning","success","info"],Ot=["small","default","large"],$t=["ellipsis","multiline"],Nt=["horizontal","vertical"],wt=o=>({install:n=>{me(n,o.i18n);const t=n.runWithContext(()=>E());e.watchEffect(()=>Tt(t.t.value("optional")))}}),Tt=o=>globalThis.document.body.style.setProperty("--onyx-global-optional-text",o);exports.AUTOCAPITALIZE=Pe;exports.BUTTON_MODES=ie;exports.BUTTON_TYPES=se;exports.BUTTON_VARIATIONS=ce;exports.DENSITY=U;exports.DIRECTIONS=Nt;exports.HEADLINE_TYPES=Oe;exports.ICON_SIZES=$e;exports.INPUT_TYPES=Ae;exports.LINK_TARGETS=je;exports.MULTISELECT_TEXT_MODE=_t;exports.ONYX_COLORS=St;exports.OnyxAppLayout=P;exports.OnyxBadge=w;exports.OnyxButton=re;exports.OnyxCheckboxGroup=Be;exports.OnyxEmpty=Se;exports.OnyxHeadline=V;exports.OnyxIcon=k;exports.OnyxIconButton=we;exports.OnyxInput=De;exports.OnyxLink=Ye;exports.OnyxListbox=Qe;exports.OnyxLoadingIndicator=x;exports.OnyxPageLayout=lt;exports.OnyxRadioButtonGroup=it;exports.OnyxSelect=ft;exports.OnyxSkeleton=_;exports.OnyxSwitch=Ct;exports.OnyxTooltip=z;exports.TEXT_SIZES=Ot;exports.TOOLTIP_POSITIONS=Vt;exports.TRUNCATION_TYPES=$t;exports.createOnyx=wt;exports.useDensity=f;
package/dist/index.d.ts CHANGED
@@ -27,6 +27,7 @@ export { default as OnyxPageLayout } from './components/OnyxPageLayout/OnyxPageL
27
27
  export * from './components/OnyxPageLayout/types';
28
28
  export * from './components/OnyxRadioButton/types';
29
29
  export { default as OnyxRadioButtonGroup } from './components/OnyxRadioButtonGroup/OnyxRadioButtonGroup.vue';
30
+ export * from './components/OnyxRadioButtonGroup/types';
30
31
  export { default as OnyxSelect } from './components/OnyxSelect/OnyxSelect.vue';
31
32
  export * from './components/OnyxSelect/types';
32
33
  export { default as OnyxSkeleton } from './components/OnyxSkeleton/OnyxSkeleton.vue';
@@ -34,7 +35,6 @@ export { default as OnyxSwitch } from './components/OnyxSwitch/OnyxSwitch.vue';
34
35
  export * from './components/OnyxSwitch/types';
35
36
  export { default as OnyxTooltip } from './components/OnyxTooltip/OnyxTooltip.vue';
36
37
  export * from './components/OnyxTooltip/types';
37
- export { default as TestInput } from './components/TestInput/TestInput.vue';
38
38
  export * from './composables/density';
39
39
  export type { OnyxTranslations, ProvideI18nOptions } from './i18n';
40
40
  export * from './types';