https://www.roskilde.dk/_nuxt/CVtb5gZl.js

1import{C as e,D as r,E as s,G as t,Gt as o,J as a,Lt as l,M as n,N as i,Nt as c,Tt as b,_ as d,fn as g,hn as u,it as p,mn as x,st as m,w as y}from"./B8XHxhss.js";import{F as v,Pt as C,V as f,_ as h,i as $}from"#entry";import{t as w}from"./DXNx4Ry-.js";import{t as k}from"./LFVbWIh92.js";import{t as z}from"./nmS8ks872.js";import{t as S}from"./DRHJoJpX.js";var R={class:"c-theme-playground"},O={class:"mt-beforeBlocks mb-afterBlocks"},L={class:"text-display-xs text-strong mb-md"},H={class:"text-heading-md-strong !capitalize mr-3xs flex gap-x-2xs"},T={class:"grid grid-cols-1 gap-lg"},j={key:0,class:"grid >=656:grid-cols-2 >=960:grid-cols-3 >=1280:grid-cols-4 gap-gutter"},E={key:0,class:"text-body-lg-strong col-span-full"},_={class:"text-strong text-heading-sm-regular break-all !font-size-18 mr-4xs mb-2xs"},A={key:0,class:"flex justify-between gap-x-sm text-body-sm-regular text-strong mb-5xs"},B=["innerHTML"],G={class:"flex justify-between gap-x-sm text-body-sm-regular text-strong mb-5xs"},D={class:"flex justify-between gap-x-sm text-body-sm-regular text-strong"},I={class:"flex justify-between gap-x-sm text-body-sm-regular text-strong"},V={class:"mt-auto"},X={class:"flex flex-wrap gap-4xs mt-2xs"},M=["onClick"],P=["onClick"],N=["onClick"],F={key:1,class:"grid >=656:grid-cols-2 >=960:grid-cols-3 >=1280:grid-cols-4 gap-gutter"},U={key:0,class:"text-body-lg-strong col-span-full"},K={class:"text-strong text-heading-sm-regular break-all !font-size-18 mr-4xs mb-2xs"},Z={key:0,class:"flex justify-between gap-x-sm text-body-sm-regular text-strong mb-5xs"},J=["innerHTML"],W={class:"flex justify-between gap-x-sm text-body-sm-regular text-strong mb-5xs"},q={class:"flex justify-between gap-x-sm text-body-sm-regular text-strong"},Q={class:"flex justify-between gap-x-sm text-body-sm-regular text-strong"},Y={class:"mt-auto"},ee={class:"flex flex-wrap gap-4xs mt-2xs"},re=["onClick"],se=["onClick"],te=["onClick"],oe={key:2,class:"grid >=656:grid-cols-2 >=960:grid-cols-3 >=1280:grid-cols-4 gap-gutter"},ae={key:0,class:"text-body-lg-strong col-span-full"},le={class:"text-strong text-heading-sm-regular break-all !font-size-18 mr-4xs mb-2xs"},ne={key:0,class:"flex justify-between gap-x-sm text-body-sm-regular text-strong mb-5xs"},ie=["innerHTML"],ce={class:"flex justify-between gap-x-sm text-body-sm-regular text-strong mb-5xs"},be={class:"flex justify-between gap-x-sm text-body-sm-regular text-strong"},de={class:"mt-auto"},ge={class:"flex flex-wrap gap-4xs mt-2xs"},ue=["onClick"],pe=["onClick"],xe=["onClick"],me={key:0,class:"fixed bottom-lg bg-surface text-strong text-body-sm-regular py-3xs px-sm right-lg min-w-200 rounded-sm border border-subtle"},ye={__name:"color-list-playground",setup(ye){$({key:f,name:"Color list playground"});const ve=l(null),Ce=l(""),fe=l([{label:h("ALL",{capitalize:!0}),value:""},{label:h("BACKGROUND_COLORS",{capitalize:!0}),value:"background"},{label:h("TEXT_COLORS",{capitalize:!0}),value:"text"},{label:h("BORDER_COLORS",{capitalize:!0}),value:"border"}]);function he(e,r,s){const t=`rgb(${e}, ${r}, ${s})`;window.navigator.clipboard&&window.navigator.clipboard.writeText(t),ve.value=null,setTimeout(()=>{ve.value=t},250)}function $e(e){const r=String(e);window.navigator.clipboard&&window.navigator.clipboard.writeText(r),ve.value=null,setTimeout(()=>{ve.value=r},250)}function we(e,r,s,t,o){const a=`rgb(var(--theme-colors-${e}-${r}, ${s} ${t} ${o}) / 1)`;window.navigator.clipboard&&window.navigator.clipboard.writeText(a),ve.value=null,setTimeout(()=>{ve.value=a},250)}const ke=S()?.default??{},ze=t("themeConfig",null),Se=e(()=>ze?.value??ke),Re=[{name:"onPrimary",bg:"primary",colors:[],borderColors:[],backgroundColors:[]},{name:"onSecondary",bg:"secondary",colors:[],borderColors:[],backgroundColors:[]},{name:"onCanvas",bg:"canvas",colors:[],borderColors:[],backgroundColors:[]},{name:"onSurface",bg:"surface",colors:[],borderColors:[],backgroundColors:[]},{name:"onDanger",bg:"danger",colors:[],borderColors:[],backgroundColors:[]}];for(const[e,r]of Object.entries(Se.value?.backgroundColors??{}))for(const s of Re)if(e.startsWith(s.bg)){const[t,o,a]=r;s.backgroundColors.push({name:e,type:"background",r:t,g:o,b:a,cssClass:`.bg-${e}`})}for(const[e,r]of Object.entries(Se.value?.textColors??{})){const s=r[0]?`${r[0]}`:null,t=r[1]?`${r[1]}`:null,o=r[2]?`${r[2]}`:null;let a=e.split(/(?=[A-Z])/),l=a[2]?.toLowerCase()||"";a.forEach((e,r)=>{r<=2||(l+=e)}),e.includes("onPrimary")&&Re[0].colors.push({name:e,type:"text",r:s,g:t,b:o,cssClass:`.text-${e}<br/>.bg-primary .text-${l}`}),e.includes("onSecondary")&&Re[1].colors.push({name:e,type:"text",r:s,g:t,b:o,cssClass:`.text-${e}<br/>.bg-secondary .text-${l}`}),e.includes("onCanvas")&&Re[2].colors.push({name:e,type:"text",r:s,g:t,b:o,cssClass:`.text-${e}<br/>.bg-canvas .text-${l}`}),e.includes("onSurface")&&Re[3].colors.push({name:e,type:"text",r:s,g:t,b:o,cssClass:`.text-${e}<br/>.bg-surface .text-${l}`}),e.includes("onDanger")&&Re[4].colors.push({name:e,type:"text",r:s,g:t,b:o,cssClass:`.text-${e}<br/>.bg-danger .text-${l}`})}for(const[e,r]of Object.entries(Se.value?.borderColors??{})){const s=r[0]?`${r[0]}`:null,t=r[1]?`${r[1]}`:null,o=r[2]?`${r[2]}`:null;let a=e.split(/(?=[A-Z])/),l=a[2]?.toLowerCase()||"";a.forEach((e,r)=>{r<=2||(l+=e)}),e.includes("onPrimary")&&Re[0].borderColors.push({name:e,type:"border",r:s,g:t,b:o,cssClass:`.border-${e}<br/>.bg-primary .border-${l}`}),e.includes("onSecondary")&&Re[1].borderColors.push({name:e,type:"border",r:s,g:t,b:o,cssClass:`.border-${e}<br/>.bg-secondary .border-${l}`}),e.includes("onCanvas")&&Re[2].borderColors.push({name:e,type:"border",r:s,g:t,b:o,cssClass:`.border-${e}<br/>.bg-canvas .border-${l}`}),e.includes("onSurface")&&Re[3].borderColors.push({name:e,type:"border",r:s,g:t,b:o,cssClass:`.border-${e}<br/>.bg-surface .border-${l}`}),e.includes("onDanger")&&Re[4].borderColors.push({name:e,type:"border",r:s,g:t,b:o,cssClass:`.border-${e}<br/>.bg-danger .border-${l}`})}function Oe(e,r,s){if(e=parseInt(e,10),r=parseInt(r,10),s=parseInt(s,10),e<0||e>255||r<0||r>255||s<0||s>255)throw new Error("Invalid RGB values. Each value must be between 0 and 255.");const t=e=>e.toString(16).padStart(2,"0");return`#${t(e)}${t(r)}${t(s)}`}return(e,t)=>{const l=z,f=w,$=k,S=v;return p(),r("article",R,[i(S,a({name:"content-page-layout"},{title:("localize"in e?e.localize:o(h))("VARIABLE_LIST",{capitalize:!0}),description:("localize"in e?e.localize:o(h))("PHRASE_COLOR_LIST_DESCRIPTION",{capitalize:!0})}),{headerFilters:b(()=>[i(l,{modelValue:o(Ce),"onUpdate:modelValue":t[0]||(t[0]=e=>c(Ce)?Ce.value=e:null),label:("localize"in e?e.localize:o(h))("FILTER",{capitalize:!0}),items:o(fe),color:"surfaceVariant",class:"w-12/12col >=1280:w-8/12col mb-xl"},null,8,["modelValue","label","items"])]),default:b(()=>[y("div",O,[i($,{class:"w-full",elements:Re},{title:b(()=>[y("span",L,u(("localize"in e?e.localize:o(h))("COLORS",{capitalize:!0})),1)]),header:b(({item:e,isActive:r})=>[y("span",H,[y("div",{class:g(["block w-25 h-25 rounded-full self

1-center border border-subtle",`bg-${e.bg}`])},null,2),n(" "+u(e.bg),1)]),y("span",{class:g(["c-base-accordion__icon duration-300 ml-auto",{"rotate-z-0":!r,"rotate-z-180":r}])},[i(f,{name:"expand-more",class:"w-1.6em h-1.6em"})],2)]),panel:b(({item:a})=>[y("div",T,[o(Ce)&&"background"!==o(Ce)?s("",!0):(p(),r("section",j,[o(Ce)?s("",!0):(p(),r("h2",E,u(("localize"in e?e.localize:o(h))("BACKGROUND_COLORS",{capitalize:!0})),1)),(p(!0),r(d,null,m(a.backgroundColors,(e,o)=>(p(),r("div",{key:o,class:"border rounded-card border-subtle py-cardStack overflow-hidden min-h-180 p-2xs flex flex-col relative"},[y("h3",_,u(e.name),1),y("div",{class:"h-20 w-20 rounded-full border border-subtle absolute top-3xs right-3xs",style:x([`background:rgb(${e.r},${e.g},${e.b})`])},null,4),e.cssClass?(p(),r("div",A,[t[1]||(t[1]=y("span",null,"Class use:",-1)),y("span",{innerHTML:e.cssClass},null,8,B)])):s("",!0),y("div",G,[t[2]||(t[2]=y("span",null,"RGB:",-1)),y("span",null,u(e.r)+", "+u(e.g)+", "+u(e.b),1)]),y("div",D,[t[3]||(t[3]=y("span",null,"HEX:",-1)),y("span",null,u(Oe(e.r,e.g,e.b)),1)]),y("div",I,[t[4]||(t[4]=y("span",null,"Variabel:",-1)),y("span",null,u(`rgb(var(--theme-colors-${e.type}-${e.name}, ${e.r} ${e.g} ${e.b}) / 1)`),1)]),y("div",V,[y("div",X,[y("button",{class:"grow bg-primary hover:bg-primaryHover active:bg-primaryActive text-strong rounded-button text-body-sm-regular py-4xs px-3xs",onClick:r=>he(e.r,e.g,e.b)}," Copy RGB ",8,M),y("button",{class:"grow bg-primary hover:bg-primaryHover active:bg-primaryActive text-strong rounded-button text-body-sm-regular py-4xs px-3xs",onClick:r=>$e(Oe(e.r,e.g,e.b))}," Copy HEX ",8,P),y("button",{class:"grow bg-primary hover:bg-primaryHover active:bg-primaryActive text-strong rounded-button text-body-sm-regular py-4xs px-3xs",onClick:r=>we(e.type,e.name,e.r,e.g,e.b)}," Copy custom CSS property ",8,N)])])]))),128))])),o(Ce)&&"text"!==o(Ce)?s("",!0):(p(),r("section",F,[o(Ce)?s("",!0):(p(),r("h2",U,u(("localize"in e?e.localize:o(h))("TEXT_COLORS",{capitalize:!0})),1)),(p(!0),r(d,null,m(a.colors,(e,o)=>(p(),r("div",{key:o,class:"border rounded-card border-subtle py-cardStack overflow-hidden min-h-180 p-2xs flex flex-col relative"},[y("h3",K,u(e.name),1),y("div",{class:"h-20 w-20 rounded-full border border-subtle absolute top-3xs right-3xs",style:x([`background:rgb(${e.r},${e.g},${e.b})`])},null,4),e.cssClass?(p(),r("div",Z,[t[5]||(t[5]=y("span",null,"Class use:",-1)),y("span",{innerHTML:e.cssClass},null,8,J)])):s("",!0),y("div",W,[t[6]||(t[6]=y("span",null,"RGB:",-1)),y("span",null,u(e.r)+", "+u(e.g)+", "+u(e.b),1)]),y("div",q,[t[7]||(t[7]=y("span",null,"HEX:",-1)),y("span",null,u(Oe(e.r,e.g,e.b)),1)]),y("div",Q,[t[8]||(t[8]=y("span",null,"Variabel:",-1)),y("span",null,u(`rgb(var(--theme-colors-${e.type}-${e.name}, ${e.r} ${e.g} ${e.b}) / 1)`),1)]),y("div",Y,[y("div",ee,[y("button",{class:"grow bg-primary hover:bg-primaryHover active:bg-primaryActive text-strong rounded-button text-body-sm-regular py-4xs px-3xs",onClick:r=>he(e.r,e.g,e.b)}," Copy RGB ",8,re),y("button",{class:"grow bg-primary hover:bg-primaryHover active:bg-primaryActive text-strong rounded-button text-body-sm-regular py-4xs px-3xs",onClick:r=>$e(Oe(e.r,e.g,e.b))}," Copy HEX ",8,se),y("button",{class:"grow bg-primary hover:bg-primaryHover active:bg-primaryActive text-strong rounded-button text-body-sm-regular py-4xs px-3xs",onClick:r=>we(e.type,e.name,e.r,e.g,e.b)}," Copy custom CSS property ",8,te)])])]))),128))])),o(Ce)&&"border"!==o(Ce)?s("",!0):(p(),r("section",oe,[o(Ce)?s("",!0):(p(),r("h2",ae,u(("localize"in e?e.localize:o(h))("BORDER_COLORS",{capitalize:!0})),1)),(p(!0),r(d,null,m(a.borderColors,(e,o)=>(p(),r("div",{key:o,class:"border rounded-card border-subtle py-cardStack overflow-hidden min-h-180 p-2xs flex flex-col relative"},[y("h3",le,u(e.name),1),y("div",{class:"h-20 w-20 rounded-full border border-subtle absolute top-3xs right-3xs",style:x([`background:rgb(${e.r},${e.g},${e.b})`])},null,4),e.cssClass?(p(),r("div",ne,[t[9]||(t[9]=y("span",null,"Class use:",-1)),y("span",{innerHTML:e.cssClass},null,8,ie)])):s("",!0),y("div",ce,[t[10]||(t[10]=y("span",null,"RGB:",-1)),y("span",null,u(e.r)+", "+u(e.g)+", "+u(e.b),1)]),y("div",be,[t[11]||(t[11]=y("span",null,"HEX:",-1)),y("span",null,u(Oe(e.r,e.g,e.b)),1)]),y("div",de,[y("div",ge,[y("button",{class:"grow bg-primary hover:bg-primaryHover active:bg-primaryActive text-strong rounded-button text-body-sm-regular py-4xs px-3xs",onClick:r=>he(e.r,e.g,e.b)}," Copy RGB ",8,ue),y("button",{class:"grow bg-primary hover:bg-primaryHover active:bg-primaryActive text-strong rounded-button text-body-sm-regular py-4xs px-3xs",onClick:r=>$e(Oe(e.r,e.g,e.b))}," Copy HEX ",8,pe),y("button",{class:"grow bg-primary hover:bg-primaryHover active:bg-primaryActive text-strong rounded-button text-body-sm-regular py-4xs px-3xs",onClick:r=>we(e.type,e.name,e.r,e.g,e.b)}," Copy custom CSS property ",8,xe)])])]))),128))]))])]),_:1})]),i(C,{name:"t-color-toast"},{default:b(()=>[o(ve)?(p(),r("div",me,u(o(ve))+" copied to clipboard! ",1)):s("",!0)]),_:1})]),_:1},16)])}}};export{ye as default};