sit-onyx 1.0.0-alpha.21 → 1.0.0-alpha.23

package/dist/components/OnyxLink/OnyxLink.stories.d.ts

@@ -1,7 +1,7 @@
 import type { Meta } from "@storybook/vue3";
 import OnyxLink from "./OnyxLink.vue";
 /**
- * Links are the tool of choice to refer to another page.
+ * Links are a navigational elements that direct users to other pages, whether they are internal or external.
  */
 declare const meta: Meta<typeof OnyxLink>;
 export default meta;
@@ -24,3 +24,16 @@ export declare const NewTab: {
         href: string;
     };
 };
+/**
+ * Link without the external icon.
+ * For relative/internal links or protocols like mailto:, tel: etc. you don't need to disable
+ * the `withExternalIcon` property manually, you can leave it on "auto" and the icon will
+ * be hidden automatically.
+ */
+export declare const WithoutExternalIcon: {
+    args: {
+        withExternalIcon: false;
+        default: () => string;
+        href: string;
+    };
+};

package/dist/components/OnyxLink/OnyxLink.vue.d.ts

@@ -1,14 +1,17 @@
 import type { OnyxLinkProps } from "./types";
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OnyxLinkProps>, {
     target: string;
+    withExternalIcon: string;
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: () => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<OnyxLinkProps>, {
     target: string;
+    withExternalIcon: string;
 }>>> & {
     onClick?: (() => any) | undefined;
 }, {
     target: "_self" | "_blank" | "_parent" | "_top";
+    withExternalIcon: boolean | "auto";
 }, {}>, Readonly<{
     /**
      * Link label.

package/dist/components/OnyxLink/types.d.ts

@@ -8,6 +8,12 @@ export type OnyxLinkProps = {
      * For `_blank`, the `rel="noopener noreferrer"` will be set automatically.
      */
     target?: LinkTarget;
+    /**
+     * Whether to show the external link icon.
+     * If set to `auto`, it will be shown when the `href` leads to another website
+     * (starting with "http://" or "https://") and will be hidden otherwise.
+     */
+    withExternalIcon?: boolean | "auto";
 };
 export declare const LINK_TARGETS: readonly ["_self", "_blank", "_parent", "_top"];
 export type LinkTarget = (typeof LINK_TARGETS)[number];

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),S=["disabled"],T={class:"onyx-button__label"},N=e.defineComponent({__name:"OnyxButton",props:{label:{default:""},disabled:{type:Boolean,default:!1},type:{default:"button"},variation:{default:"primary"},mode:{default:"default"},icon:{}},emits:["click"],setup(o,{emit:n}){const t=o,l=n;return(r,a)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["onyx-button",[`onyx-button--${t.variation}`,`onyx-button--${t.mode}`]]),disabled:t.disabled,onClick:a[0]||(a[0]=c=>l("click"))},[t.icon?(e.openBlock(),e.createBlock(e.unref(g),{key:0,icon:t.icon,size:"24px"},null,8,["icon"])):e.createCommentVNode("",!0),e.createElementVNode("span",T,e.toDisplayString(t.label),1)],10,S))}}),$=["button","submit","reset"],I=["primary","secondary","danger"],L=["default","outline","plain"],M="(optional)",q={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.'}},w="Select all",y={optional:M,validations:q,selectAll:w},V=Symbol(),E=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]:y),l=e.computed(()=>(r,a={})=>{let c=B(r,t.value)??B(r,y)??"";const s=typeof a.n=="number"?a.n:void 0;return c=D(c,s),z(c,a)});return{locale:n,t:l}},P=(o,n)=>o.provide(V,E(n)),h=()=>e.inject(V,()=>E(),!0),B=(o,n)=>{const t=o.split(".").reduce((l,r)=>!l||typeof l=="string"?l:l[r],n);return t&&typeof t=="string"?t:void 0},D=(o,n)=>{const t=o.split(" | ").map(r=>r.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]},z=(o,n)=>n?Object.entries(n).reduce((l,[r,a])=>a===void 0?l:l.replace(new RegExp(`{${r}}`,"gi"),a.toString()),o).replace(/\s?{.*}\s?/gi,""):o,U={class:"onyx-checkbox__container"},R=["aria-label","indeterminate","disabled","required"],A={key:0,class:"onyx-checkbox__label"},C=e.defineComponent({__name:"OnyxCheckbox",props:{modelValue:{type:Boolean,default:!1},label:{default:""},indeterminate:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},required:{type:Boolean,default:!1},hideLabel:{type:Boolean}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,l=n,r=e.computed({get:()=>t.modelValue,set:c=>l("update:modelValue",c)}),a=e.ref(!1);return(c,s)=>(e.openBlock(),e.createElementBlock("label",{class:e.normalizeClass(["onyx-checkbox",{"onyx-required-marker":t.required,"onyx-optional-marker":!t.required}])},[e.createElementVNode("div",U,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":s[0]||(s[0]=u=>r.value=u),"aria-label":t.hideLabel?t.label:void 0,class:e.normalizeClass(["onyx-checkbox__input",{"onyx-checkbox__input--touched":a.value}]),type:"checkbox",indeterminate:t.indeterminate,disabled:t.disabled,required:t.required,onBlur:s[1]||(s[1]=u=>a.value=!0)},null,42,R),[[e.vModelCheckbox,r.value]])]),t.label&&!t.hideLabel?(e.openBlock(),e.createElementBlock("p",A,e.toDisplayString(t.label),1)):e.createCommentVNode("",!0)],2))}}),G=["disabled"],H={key:0,class:"onyx-checkbox-group__label"},Y=e.defineComponent({__name:"OnyxCheckboxGroup",props:{options:{},modelValue:{default:()=>[]},headline:{},direction:{default:"vertical"},withCheckAll:{type:Boolean,default:!1},checkAllLabel:{},disabled:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,l=n,{t:r}=h(),a=(i,m)=>{const d=m?[...t.modelValue,i]:t.modelValue.filter(f=>f!==i);l("update:modelValue",d)},c=e.computed(()=>t.options.filter(i=>!i.disabled)),s=i=>{const m=i?c.value.map(({id:d})=>d):[];l("update:modelValue",m)},u=e.computed(()=>{const i=c.value.map(({id:d})=>d),m=t.modelValue.filter(d=>i.includes(d));return!i.length||!m.length?{modelValue:!1}:m.length===i.length?{modelValue:!0}:{indeterminate:!0,modelValue:!1}});return(i,m)=>(e.openBlock(),e.createElementBlock("fieldset",{class:"onyx-checkbox-group",disabled:t.disabled},[t.headline?(e.openBlock(),e.createElementBlock("legend",H,[e.createVNode(e.unref(x),{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.withCheckAll?(e.openBlock(),e.createBlock(C,e.mergeProps({key:0},u.value,{label:t.checkAllLabel||e.unref(r)("selectAll"),"onUpdate:modelValue":s}),null,16,["label"])):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,d=>(e.openBlock(),e.createBlock(C,e.mergeProps({key:d.id.toString()},d,{"model-value":t.modelValue.includes(d.id),"onUpdate:modelValue":f=>a(d.id,f)}),null,16,["model-value","onUpdate:modelValue"]))),128))],2)],8,G))}}),j=["horizontal","vertical"],x=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"]))}}),X=["h1","h2","h3","h4","h5","h6"],K=["innerHTML"],g=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,K))}}),F=["12px","16px","24px","32px","48px","64px","96px"],Z=["href","target","rel"],J=e.defineComponent({__name:"OnyxLink",props:{href:{},target:{default:"_self"}},emits:["click"],setup(o,{emit:n}){const t=o,l=n;return(r,a)=>(e.openBlock(),e.createElementBlock("a",{class:"onyx-link",href:t.href,target:t.target,rel:t.target==="_blank"?"noopener noreferrer":void 0,onClick:a[0]||(a[0]=c=>l("click"))},[e.renderSlot(r.$slots,"default")],8,Z))}}),W=["_self","_blank","_parent","_top"],Q=(o,n)=>{const t=o.__vccOpts||o;for(const[l,r]of n)t[l]=r;return t},ee={},te={class:"onyx-circle-spinner",viewBox:"0 0 50 50"},ne=e.createElementVNode("circle",{class:"onyx-circle-spinner__circle",cx:"50%",cy:"50%",r:"45%"},null,-1),oe=[ne];function le(o,n){return e.openBlock(),e.createElementBlock("svg",te,oe)}const ae=Q(ee,[["render",le]]),re='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 32 32"><circle cx="27" cy="16" r="3"/><circle cx="16" cy="16" r="2"/><circle cx="5" cy="16" r="3"/></svg>',se=e.defineComponent({__name:"LoadingDots",setup(o){return(n,t)=>(e.openBlock(),e.createBlock(g,{icon:e.unref(re)},null,8,["icon"]))}}),ce=e.defineComponent({__name:"OnyxLoadingIndicator",props:{type:{default:"circle"}},setup(o){const n=o;return(t,l)=>n.type==="circle"?(e.openBlock(),e.createBlock(ae,{key:0})):n.type==="dots"?(e.openBlock(),e.createBlock(se,{key:1})):e.createCommentVNode("",!0)}}),ie=["title"],ue=["required","name","value","checked","disabled"],de={class:"onyx-radio-button__label"},pe=e.defineComponent({__name:"OnyxRadioButton",props:{id:{},label:{},value:{},disabled:{type:Boolean},selected:{type:Boolean},name:{},required:{type:Boolean},errorMessage:{}},setup(o){const n=o,t=e.ref();return e.watchEffect(()=>{var l;return(l=t.value)==null?void 0:l.setCustomValidity(n.errorMessage??"")}),(l,r)=>(e.openBlock(),e.createElementBlock("label",{class:"onyx-radio-button",title:n.errorMessage},[e.createElementVNode("input",{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,ue),e.createElementVNode("span",de,e.toDisplayString(n.label),1)],8,ie))}}),me=(()=>{let o=0;return()=>o++})(),_e=o=>`${o}-${me()}`,fe=["disabled"],ye={key:0,class:"onyx-radio-button-group__headline"},he=e.defineComponent({__name:"OnyxRadioButtonGroup",props:{name:{default:()=>_e("radio-button-group-name")},modelValue:{},headline:{default:""},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},errorMessage:{default:""},direction:{default:"vertical"},options:{}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,l=n,r=a=>l("update:modelValue",t.options.find(({id:c})=>a.target.value===c));return(a,c)=>(e.openBlock(),e.createElementBlock("fieldset",{class:"onyx-radio-button-group",disabled:t.disabled,onChange:c[0]||(c[0]=s=>r(s))},[t.headline?(e.openBlock(),e.createElementBlock("legend",ye,[e.createVNode(x,{is:"h3",class:e.normalizeClass({"onyx-required-marker":t.required,"onyx-optional-marker":!t.required})},{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"}])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,s=>{var u;return e.openBlock(),e.createBlock(pe,{id:s.id,key:s.id,name:t.name,label:s.label,value:s.value,"error-message":t.errorMessage,selected:s.id===((u=t.modelValue)==null?void 0:u.id),disabled:s.disabled,required:t.required},null,8,["id","name","label","value","error-message","selected","disabled","required"])}),128))],2)],40,fe))}}),xe=(o,n)=>{const t=Object.entries(o).filter(([r,a])=>a!==void 0),l=Object.entries(n).filter(([r,a])=>a!==void 0);return t.length!==l.length?!1:t.every(([r,a])=>a===n[r])},O=()=>Object.entries(Object.getOwnPropertyDescriptors(ValidityState.prototype)).filter(([o,n])=>n.enumerable).map(([o])=>o),ge=o=>O().reduce((n,t)=>(n[t]=o[t],n),{}),ve=o=>{if(o.valueMissing)return"valueMissing";const n=O().filter(t=>t!=="valid").sort();for(const t of n)if(t in o&&o[t])return t},be=Object.keys(y.validations.typeMismatch),ke={key:0,class:"onyx-input__error","aria-live":"polite"},Be={class:"onyx-input__info"},Ce=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 f;const t=o,l=n,{t:r}=h(),{errorMessage:a}=e.toRefs(t),c=e.ref(!1),s=e.ref(null),u=e.ref((f=s.value)==null?void 0:f.validity),i=e.computed({get:()=>t.modelValue,set:p=>l("update:modelValue",p)}),m=e.computed(()=>{if(!u.value||u.value.valid)return"";const p=ve(u.value);if(t.errorMessage||p==="customError")return t.errorMessage;if(!p)return"";if(p==="typeMismatch"){const _=be.includes(t.type)?t.type:"generic";return r.value(`validations.typeMismatch.${_}`,{value:i.value})}return r.value(`validations.${p}`,{value:i.value,n:i.value.toString().length,minLength:t.minLength,maxLength:t.maxLength,min:t.min,max:t.max,step:t.step})}),d=p=>{const _=p.target;l("change",_.value)};return e.watch([s,a],()=>{s.value&&s.value.setCustomValidity(t.errorMessage||"")}),e.watch([s,i,a],()=>{if(!s.value)return;const p=ge(s.value.validity);(!u.value||!xe(p,u.value))&&(u.value=p,l("validityChange",u.value))},{immediate:!0}),(p,_)=>{var v,b;return e.openBlock(),e.createElementBlock("label",{class:e.normalizeClass(["onyx-input",{"onyx-input--touched":c.value}])},[e.createElementVNode("span",{class:e.normalizeClass(["onyx-input__label",{"onyx-input__label--required":t.required}])},e.toDisplayString(t.label),3),e.withDirectives(e.createElementVNode("input",e.mergeProps(t,{ref_key:"inputElement",ref:s,"onUpdate:modelValue":_[0]||(_[0]=k=>i.value=k),onChange:d,onBlur:_[1]||(_[1]=k=>c.value=!0)}),null,16),[[e.vModelDynamic,i.value]]),c.value&&!((v=u.value)!=null&&v.valid)?(e.openBlock(),e.createElementBlock("p",ke,e.toDisplayString(m.value),1)):e.createCommentVNode("",!0),e.createElementVNode("p",Be,'Model value: "'+e.toDisplayString(i.value)+'", is valid: '+e.toDisplayString((b=u.value)==null?void 0:b.valid),1)],2)}}}),Ve=["primary","secondary","neutral","danger","warning","success","info"],Ee=["small","default","large"],Oe=o=>({install:n=>{P(n,o.i18n);const t=n.runWithContext(()=>h());e.watchEffect(()=>Se(t.t.value("optional")))}}),Se=o=>globalThis.document.body.style.setProperty("--onyx-global-optional-text",o);exports.BUTTON_MODES=L;exports.BUTTON_TYPES=$;exports.BUTTON_VARIATIONS=I;exports.CHECKBOX_GROUP_DIRECTIONS=j;exports.HEADLINE_TYPES=X;exports.ICON_SIZES=F;exports.LINK_TARGETS=W;exports.ONYX_COLORS=Ve;exports.OnyxButton=N;exports.OnyxCheckboxGroup=Y;exports.OnyxHeadline=x;exports.OnyxIcon=g;exports.OnyxLink=J;exports.OnyxLoadingIndicator=ce;exports.OnyxRadioButtonGroup=he;exports.TEXT_SIZES=Ee;exports.TestInput=Ce;exports.createOnyx=Oe;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),N=["disabled"],T={class:"onyx-button__label"},$=e.defineComponent({__name:"OnyxButton",props:{label:{default:""},disabled:{type:Boolean,default:!1},type:{default:"button"},variation:{default:"primary"},mode:{default:"default"},icon:{}},emits:["click"],setup(o,{emit:n}){const t=o,l=n;return(a,r)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["onyx-button",[`onyx-button--${t.variation}`,`onyx-button--${t.mode}`]]),disabled:t.disabled,onClick:r[0]||(r[0]=c=>l("click"))},[t.icon?(e.openBlock(),e.createBlock(e.unref(g),{key:0,icon:t.icon,size:"24px"},null,8,["icon"])):e.createCommentVNode("",!0),e.createElementVNode("span",T,e.toDisplayString(t.label),1)],10,N))}}),I=["button","submit","reset"],L=["primary","secondary","danger"],M=["default","outline","plain"],w="(optional)",q={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.'}},z="Select all",y={optional:w,validations:q,selectAll:z},V=Symbol(),C=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]:y),l=e.computed(()=>(a,r={})=>{let c=B(a,t.value)??B(a,y)??"";const s=typeof r.n=="number"?r.n:void 0;return c=D(c,s),U(c,r)});return{locale:n,t:l}},P=(o,n)=>o.provide(V,C(n)),f=()=>e.inject(V,()=>C(),!0),B=(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},D=(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]},U=(o,n)=>n?Object.entries(n).reduce((l,[a,r])=>r===void 0?l:l.replace(new RegExp(`{${a}}`,"gi"),r.toString()),o).replace(/\s?{.*}\s?/gi,""):o,R={class:"onyx-checkbox__container"},A=["aria-label","indeterminate","disabled","required"],G={key:0,class:"onyx-checkbox__label"},E=e.defineComponent({__name:"OnyxCheckbox",props:{modelValue:{type:Boolean,default:!1},label:{default:""},indeterminate:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},required:{type:Boolean,default:!1},hideLabel:{type:Boolean}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,l=n,a=e.computed({get:()=>t.modelValue,set:c=>l("update:modelValue",c)}),r=e.ref(!1);return(c,s)=>(e.openBlock(),e.createElementBlock("label",{class:e.normalizeClass(["onyx-checkbox",{"onyx-required-marker":t.required,"onyx-optional-marker":!t.required}])},[e.createElementVNode("div",R,[e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":s[0]||(s[0]=u=>a.value=u),"aria-label":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:s[1]||(s[1]=u=>r.value=!0)},null,42,A),[[e.vModelCheckbox,a.value]])]),t.label&&!t.hideLabel?(e.openBlock(),e.createElementBlock("p",G,e.toDisplayString(t.label),1)):e.createCommentVNode("",!0)],2))}}),H=["disabled"],Y={key:0,class:"onyx-checkbox-group__label"},j=e.defineComponent({__name:"OnyxCheckboxGroup",props:{options:{},modelValue:{default:()=>[]},headline:{},direction:{default:"vertical"},withCheckAll:{type:Boolean,default:!1},checkAllLabel:{},disabled:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,l=n,{t:a}=f(),r=(i,m)=>{const d=m?[...t.modelValue,i]:t.modelValue.filter(h=>h!==i);l("update:modelValue",d)},c=e.computed(()=>t.options.filter(i=>!i.disabled)),s=i=>{const m=i?c.value.map(({id:d})=>d):[];l("update:modelValue",m)},u=e.computed(()=>{const i=c.value.map(({id:d})=>d),m=t.modelValue.filter(d=>i.includes(d));return!i.length||!m.length?{modelValue:!1}:m.length===i.length?{modelValue:!0}:{indeterminate:!0,modelValue:!1}});return(i,m)=>(e.openBlock(),e.createElementBlock("fieldset",{class:"onyx-checkbox-group",disabled:t.disabled},[t.headline?(e.openBlock(),e.createElementBlock("legend",Y,[e.createVNode(e.unref(x),{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.withCheckAll?(e.openBlock(),e.createBlock(E,e.mergeProps({key:0},u.value,{label:t.checkAllLabel||e.unref(a)("selectAll"),"onUpdate:modelValue":s}),null,16,["label"])):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,d=>(e.openBlock(),e.createBlock(E,e.mergeProps({key:d.id.toString()},d,{"model-value":t.modelValue.includes(d.id),"onUpdate:modelValue":h=>r(d.id,h)}),null,16,["model-value","onUpdate:modelValue"]))),128))],2)],8,H))}}),X=["horizontal","vertical"],x=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"]))}}),K=["h1","h2","h3","h4","h5","h6"],F=["innerHTML"],g=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,F))}}),Z=["12px","16px","24px","32px","48px","64px","96px"],J='<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>',W=o=>/^http(s?):\/\//.test(o),Q=["href","target","rel"],ee=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:W(t.href));return(r,c)=>(e.openBlock(),e.createElementBlock("a",{class:"onyx-link",href:t.href,target:t.target,rel:t.target==="_blank"?"noopener noreferrer":void 0,onClick:c[0]||(c[0]=s=>l("click"))},[e.renderSlot(r.$slots,"default"),a.value?(e.openBlock(),e.createBlock(g,{key:0,class:"onyx-link__icon",icon:e.unref(J),size:"16px"},null,8,["icon"])):e.createCommentVNode("",!0)],8,Q))}}),te=["_self","_blank","_parent","_top"],O=(o,n)=>{const t=o.__vccOpts||o;for(const[l,a]of n)t[l]=a;return t},ne={},oe={class:"onyx-circle-spinner",viewBox:"0 0 50 50"},le=e.createElementVNode("circle",{class:"onyx-circle-spinner__circle",cx:"50%",cy:"50%",r:"45%"},null,-1),ae=[le];function re(o,n){return e.openBlock(),e.createElementBlock("svg",oe,ae)}const se=O(ne,[["render",re]]),ce={},ie={class:"onyx-loading-dots",viewBox:"0 0 32 32"},ue=e.createElementVNode("circle",{class:"onyx-loading-dots__circle",cx:"5",cy:"16",r:"3"},null,-1),de=e.createElementVNode("circle",{class:"onyx-loading-dots__circle",cx:"16",cy:"16",r:"2"},null,-1),pe=e.createElementVNode("circle",{class:"onyx-loading-dots__circle",cx:"27",cy:"16",r:"3"},null,-1),me=[ue,de,pe];function _e(o,n){return e.openBlock(),e.createElementBlock("svg",ie,me)}const he=O(ce,[["render",_e]]),ye=e.defineComponent({__name:"OnyxLoadingIndicator",props:{type:{default:"circle"}},setup(o){const n=o;return(t,l)=>n.type==="circle"?(e.openBlock(),e.createBlock(se,{key:0})):n.type==="dots"?(e.openBlock(),e.createBlock(he,{key:1})):e.createCommentVNode("",!0)}}),fe=["title"],xe=["required","name","value","checked","disabled"],ge={class:"onyx-radio-button__label"},ve=e.defineComponent({__name:"OnyxRadioButton",props:{id:{},label:{},value:{},disabled:{type:Boolean},selected:{type:Boolean},name:{},required:{type:Boolean},errorMessage:{}},setup(o){const n=o,t=e.ref();return e.watchEffect(()=>{var l;return(l=t.value)==null?void 0:l.setCustomValidity(n.errorMessage??"")}),(l,a)=>(e.openBlock(),e.createElementBlock("label",{class:"onyx-radio-button",title:n.errorMessage},[e.createElementVNode("input",{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,xe),e.createElementVNode("span",ge,e.toDisplayString(n.label),1)],8,fe))}}),be=(()=>{let o=0;return()=>o++})(),ke=o=>`${o}-${be()}`,Be=["disabled"],Ee={key:0,class:"onyx-radio-button-group__headline"},Ve=e.defineComponent({__name:"OnyxRadioButtonGroup",props:{name:{default:()=>ke("radio-button-group-name")},modelValue:{},headline:{default:""},required:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},errorMessage:{default:""},direction:{default:"vertical"},options:{}},emits:["update:modelValue"],setup(o,{emit:n}){const t=o,l=n,a=r=>l("update:modelValue",t.options.find(({id:c})=>r.target.value===c));return(r,c)=>(e.openBlock(),e.createElementBlock("fieldset",{class:"onyx-radio-button-group",disabled:t.disabled,onChange:c[0]||(c[0]=s=>a(s))},[t.headline?(e.openBlock(),e.createElementBlock("legend",Ee,[e.createVNode(x,{is:"h3",class:e.normalizeClass({"onyx-required-marker":t.required,"onyx-optional-marker":!t.required})},{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"}])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,s=>{var u;return e.openBlock(),e.createBlock(ve,{id:s.id,key:s.id,name:t.name,label:s.label,value:s.value,"error-message":t.errorMessage,selected:s.id===((u=t.modelValue)==null?void 0:u.id),disabled:s.disabled,required:t.required},null,8,["id","name","label","value","error-message","selected","disabled","required"])}),128))],2)],40,Be))}}),Ce=(o,n)=>{const t=Object.entries(o).filter(([a,r])=>r!==void 0),l=Object.entries(n).filter(([a,r])=>r!==void 0);return t.length!==l.length?!1:t.every(([a,r])=>r===n[a])},S=()=>Object.entries(Object.getOwnPropertyDescriptors(ValidityState.prototype)).filter(([o,n])=>n.enumerable).map(([o])=>o),Oe=o=>S().reduce((n,t)=>(n[t]=o[t],n),{}),Se=o=>{if(o.valueMissing)return"valueMissing";const n=S().filter(t=>t!=="valid").sort();for(const t of n)if(t in o&&o[t])return t},Ne=Object.keys(y.validations.typeMismatch),Te={key:0,class:"onyx-input__error","aria-live":"polite"},$e={class:"onyx-input__info"},Ie=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 h;const t=o,l=n,{t:a}=f(),{errorMessage:r}=e.toRefs(t),c=e.ref(!1),s=e.ref(null),u=e.ref((h=s.value)==null?void 0:h.validity),i=e.computed({get:()=>t.modelValue,set:p=>l("update:modelValue",p)}),m=e.computed(()=>{if(!u.value||u.value.valid)return"";const p=Se(u.value);if(t.errorMessage||p==="customError")return t.errorMessage;if(!p)return"";if(p==="typeMismatch"){const _=Ne.includes(t.type)?t.type:"generic";return a.value(`validations.typeMismatch.${_}`,{value:i.value})}return a.value(`validations.${p}`,{value:i.value,n:i.value.toString().length,minLength:t.minLength,maxLength:t.maxLength,min:t.min,max:t.max,step:t.step})}),d=p=>{const _=p.target;l("change",_.value)};return e.watch([s,r],()=>{s.value&&s.value.setCustomValidity(t.errorMessage||"")}),e.watch([s,i,r],()=>{if(!s.value)return;const p=Oe(s.value.validity);(!u.value||!Ce(p,u.value))&&(u.value=p,l("validityChange",u.value))},{immediate:!0}),(p,_)=>{var v,b;return e.openBlock(),e.createElementBlock("label",{class:e.normalizeClass(["onyx-input",{"onyx-input--touched":c.value}])},[e.createElementVNode("span",{class:e.normalizeClass(["onyx-input__label",{"onyx-input__label--required":t.required}])},e.toDisplayString(t.label),3),e.withDirectives(e.createElementVNode("input",e.mergeProps(t,{ref_key:"inputElement",ref:s,"onUpdate:modelValue":_[0]||(_[0]=k=>i.value=k),onChange:d,onBlur:_[1]||(_[1]=k=>c.value=!0)}),null,16),[[e.vModelDynamic,i.value]]),c.value&&!((v=u.value)!=null&&v.valid)?(e.openBlock(),e.createElementBlock("p",Te,e.toDisplayString(m.value),1)):e.createCommentVNode("",!0),e.createElementVNode("p",$e,'Model value: "'+e.toDisplayString(i.value)+'", is valid: '+e.toDisplayString((b=u.value)==null?void 0:b.valid),1)],2)}}}),Le=["primary","secondary","neutral","danger","warning","success","info"],Me=["small","default","large"],we=o=>({install:n=>{P(n,o.i18n);const t=n.runWithContext(()=>f());e.watchEffect(()=>qe(t.t.value("optional")))}}),qe=o=>globalThis.document.body.style.setProperty("--onyx-global-optional-text",o);exports.BUTTON_MODES=M;exports.BUTTON_TYPES=I;exports.BUTTON_VARIATIONS=L;exports.CHECKBOX_GROUP_DIRECTIONS=X;exports.HEADLINE_TYPES=K;exports.ICON_SIZES=Z;exports.LINK_TARGETS=te;exports.ONYX_COLORS=Le;exports.OnyxButton=$;exports.OnyxCheckboxGroup=j;exports.OnyxHeadline=x;exports.OnyxIcon=g;exports.OnyxLink=ee;exports.OnyxLoadingIndicator=ye;exports.OnyxRadioButtonGroup=Ve;exports.TEXT_SIZES=Me;exports.TestInput=Ie;exports.createOnyx=we;