cladux-html 0.1.0 → 0.3.0
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.
- package/README.md +22 -11
- package/cl.css +2246 -2
- package/cl.js +866 -2
- package/cl.min.css +2 -0
- package/cl.min.js +2 -0
- package/cl.min.mjs +2 -0
- package/cl.mjs +868 -0
- package/components/accordion.css +103 -0
- package/components/accordion.min.css +2 -0
- package/components/badge.css +100 -0
- package/components/badge.min.css +2 -0
- package/components/button.css +178 -0
- package/components/button.min.css +2 -0
- package/components/card.css +88 -0
- package/components/card.min.css +2 -0
- package/components/carousel.css +75 -0
- package/components/carousel.min.css +2 -0
- package/components/checkbox.css +80 -0
- package/components/checkbox.min.css +2 -0
- package/components/combobox.css +260 -0
- package/components/combobox.min.css +2 -0
- package/components/dialog.css +128 -0
- package/components/dialog.min.css +2 -0
- package/components/dropdown-menu.css +178 -0
- package/components/dropdown-menu.min.css +2 -0
- package/components/input.css +71 -0
- package/components/input.min.css +2 -0
- package/components/kbd.css +34 -0
- package/components/kbd.min.css +2 -0
- package/components/label.css +23 -0
- package/components/label.min.css +2 -0
- package/components/popover.css +94 -0
- package/components/popover.min.css +2 -0
- package/components/select.css +89 -0
- package/components/select.min.css +2 -0
- package/components/separator.css +16 -0
- package/components/separator.min.css +2 -0
- package/components/sheet.css +134 -0
- package/components/sheet.min.css +2 -0
- package/components/skeleton.css +15 -0
- package/components/skeleton.min.css +2 -0
- package/components/slider.css +88 -0
- package/components/slider.min.css +2 -0
- package/components/switch.css +84 -0
- package/components/switch.min.css +2 -0
- package/components/tabs.css +121 -0
- package/components/tabs.min.css +2 -0
- package/components/textarea.css +61 -0
- package/components/textarea.min.css +2 -0
- package/components/toast.css +139 -0
- package/components/toast.min.css +2 -0
- package/components/tooltip.css +115 -0
- package/components/tooltip.min.css +2 -0
- package/core.css +178 -0
- package/core.min.css +2 -0
- package/package.json +35 -4
- package/types/accordion.d.ts +1 -0
- package/types/carousel.d.ts +8 -0
- package/types/combobox.d.ts +11 -0
- package/types/dialog.d.ts +3 -0
- package/types/floating.d.ts +12 -0
- package/types/index.d.ts +16 -0
- package/types/position.d.ts +17 -0
- package/types/slider.d.ts +5 -0
- package/types/tabs.d.ts +4 -0
- package/types/toast.d.ts +21 -0
package/cl.min.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/*! cladux-html v0.3.0 | Apache-2.0 | https://cladux.vercel.app/docs/html */
|
|
2
|
+
@layer cl.base,cl.components,cl.utilities;:root{--radius: .625rem;--background: oklch(1 0 0);--foreground: oklch(.145 0 0);--card: oklch(1 0 0);--card-foreground: oklch(.145 0 0);--popover: oklch(1 0 0);--popover-foreground: oklch(.145 0 0);--primary: oklch(.205 0 0);--primary-foreground: oklch(.985 0 0);--secondary: oklch(.97 0 0);--secondary-foreground: oklch(.205 0 0);--muted: oklch(.97 0 0);--muted-foreground: oklch(.556 0 0);--accent: oklch(.97 0 0);--accent-foreground: oklch(.205 0 0);--destructive: oklch(.577 .245 27.325);--border: oklch(.922 0 0);--input: oklch(.922 0 0);--ring: oklch(.708 0 0);--chart-1: oklch(.87 0 0);--chart-2: oklch(.556 0 0);--chart-3: oklch(.439 0 0);--chart-4: oklch(.371 0 0);--chart-5: oklch(.269 0 0);--sidebar: oklch(.985 0 0);--sidebar-foreground: oklch(.145 0 0);--sidebar-primary: oklch(.205 0 0);--sidebar-primary-foreground: oklch(.985 0 0);--sidebar-accent: oklch(.97 0 0);--sidebar-accent-foreground: oklch(.205 0 0);--sidebar-border: oklch(.922 0 0);--sidebar-ring: oklch(.708 0 0)}.dark,[data-theme=dark]{--background: oklch(.145 0 0);--foreground: oklch(.985 0 0);--card: oklch(.205 0 0);--card-foreground: oklch(.985 0 0);--popover: oklch(.205 0 0);--popover-foreground: oklch(.985 0 0);--primary: oklch(.922 0 0);--primary-foreground: oklch(.205 0 0);--secondary: oklch(.269 0 0);--secondary-foreground: oklch(.985 0 0);--muted: oklch(.269 0 0);--muted-foreground: oklch(.708 0 0);--accent: oklch(.269 0 0);--accent-foreground: oklch(.985 0 0);--destructive: oklch(.704 .191 22.216);--border: oklch(1 0 0 / 10%);--input: oklch(1 0 0 / 15%);--ring: oklch(.556 0 0);--chart-1: oklch(.87 0 0);--chart-2: oklch(.556 0 0);--chart-3: oklch(.439 0 0);--chart-4: oklch(.371 0 0);--chart-5: oklch(.269 0 0);--sidebar: oklch(.205 0 0);--sidebar-foreground: oklch(.985 0 0);--sidebar-primary: oklch(.488 .243 264.376);--sidebar-primary-foreground: oklch(.985 0 0);--sidebar-accent: oklch(.269 0 0);--sidebar-accent-foreground: oklch(.985 0 0);--sidebar-border: oklch(1 0 0 / 10%);--sidebar-ring: oklch(.556 0 0)}@layer cl.base{*,*:before,*:after{box-sizing:border-box;border:0 solid var(--border);outline-color:color-mix(in oklab,var(--ring) 50%,transparent)}*{margin:0;padding:0}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;font-family:var( --font-sans, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji" );line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-height:100dvh;background-color:var(--background);color:var(--foreground)}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit;color:inherit;background-color:transparent}button{cursor:pointer}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;text-wrap:balance;overflow-wrap:break-word}p{text-wrap:pretty;overflow-wrap:break-word}a{color:inherit;text-decoration:inherit}code,kbd,samp,pre{font-family:var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace)}}@layer cl.components{.cl-popover,.cl-menu,.cl-tooltip,.cl-combobox-content{--_slide: .5rem;position:fixed;inset:auto;z-index:50;margin:0;border:0 solid var(--border);overflow:visible;opacity:0;scale:.95;transition-property:opacity,scale,translate,display,overlay;transition-duration:.1s;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-behavior:allow-discrete}.cl-popover:popover-open,.cl-menu:popover-open,.cl-tooltip:popover-open,.cl-combobox-content:popover-open{opacity:1;scale:1}@starting-style{.cl-popover:popover-open,.cl-menu:popover-open,.cl-tooltip:popover-open,.cl-combobox-content:popover-open{opacity:0;scale:.95}:is(.cl-popover,.cl-menu,.cl-tooltip,.cl-combobox-content):popover-open[data-placed=bottom]{translate:0 calc(var(--_slide) * -1)}:is(.cl-popover,.cl-menu,.cl-tooltip,.cl-combobox-content):popover-open[data-placed=top]{translate:0 var(--_slide)}:is(.cl-popover,.cl-menu,.cl-tooltip,.cl-combobox-content):popover-open[data-placed=left]{translate:var(--_slide) 0}:is(.cl-popover,.cl-menu,.cl-tooltip,.cl-combobox-content):popover-open[data-placed=right]{translate:calc(var(--_slide) * -1) 0}}}@layer cl.components{.cl-accordion{display:flex;width:100%;flex-direction:column}.cl-accordion-item:not(:last-child){border-bottom:1px solid var(--border)}.cl-accordion-trigger{position:relative;display:flex;flex:1;align-items:flex-start;justify-content:space-between;padding:.625rem 0;border:1px solid transparent;border-radius:var(--radius);font-size:.875rem;line-height:1.25rem;font-weight:500;text-align:start;outline:none;cursor:pointer;list-style:none;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-accordion-trigger::-webkit-details-marker{display:none}@media(hover:hover){.cl-accordion-trigger:hover{text-decoration:underline}}.cl-accordion-trigger:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}.cl-accordion-item[data-disabled]>.cl-accordion-trigger{pointer-events:none;opacity:.5}.cl-accordion-trigger:after{content:"";flex-shrink:0;width:1rem;height:1rem;margin-inline-start:auto;background-color:var(--muted-foreground);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat}.cl-accordion-item[open]>.cl-accordion-trigger:after{rotate:180deg}.cl-accordion-item::details-content{display:grid;grid-template-rows:0fr;overflow:hidden;font-size:.875rem;line-height:1.25rem;transition:grid-template-rows .2s ease-out,content-visibility .2s ease-out allow-discrete}.cl-accordion-item[open]::details-content{grid-template-rows:1fr}.cl-accordion-item[data-closing]::details-content{transition:none}@media(prefers-reduced-motion:reduce){.cl-accordion-item::details-content{transition:none}}.cl-accordion-content{min-height:0;overflow:hidden;font-size:.875rem;line-height:1.25rem}.cl-accordion-content:after{content:"";display:block;height:.625rem}.cl-accordion-content a{text-decoration:underline;text-underline-offset:3px}@media(hover:hover){.cl-accordion-content a:hover{color:var(--foreground)}}.cl-accordion-content p:not(:last-child){margin-bottom:1rem}}@layer cl.components{.cl-badge{--_ring: color-mix(in oklab, var(--ring) 50%, transparent);display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;gap:.25rem;width:fit-content;height:1.25rem;overflow:hidden;padding:.125rem .5rem;border:1px solid transparent;border-radius:calc(var(--radius) * 2.6);font-size:.75rem;line-height:1rem;font-weight:500;white-space:nowrap;text-decoration:none;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-badge:has([data-icon=inline-start]){padding-inline-start:.375rem}.cl-badge:has([data-icon=inline-end]){padding-inline-end:.375rem}.cl-badge>svg{pointer-events:none;width:.75rem!important;height:.75rem!important}.cl-badge:not([data-variant]),.cl-badge[data-variant=default]{background-color:var(--primary);color:var(--primary-foreground)}.cl-badge[data-variant=secondary]{background-color:var(--secondary);color:var(--secondary-foreground)}.cl-badge[data-variant=destructive]{--_ring: color-mix(in oklab, var(--destructive) 20%, transparent);background-color:color-mix(in oklab,var(--destructive) 10%,transparent);color:var(--destructive)}.cl-badge[data-variant=outline]{border-color:var(--border);color:var(--foreground)}.cl-badge[data-variant=link]{color:var(--primary);text-underline-offset:4px}@media(hover:hover){a.cl-badge:not([data-variant]):hover,a.cl-badge[data-variant=default]:hover{background-color:color-mix(in oklab,var(--primary) 80%,transparent)}a.cl-badge[data-variant=secondary]:hover{background-color:color-mix(in oklab,var(--secondary) 80%,transparent)}a.cl-badge[data-variant=destructive]:hover{background-color:color-mix(in oklab,var(--destructive) 20%,transparent)}a.cl-badge[data-variant=outline]:hover,.cl-badge[data-variant=ghost]:hover{background-color:var(--muted);color:var(--muted-foreground)}.cl-badge[data-variant=link]:hover{text-decoration-line:underline}}:where(.dark,[data-theme=dark]) .cl-badge[data-variant=destructive]{--_ring: color-mix(in oklab, var(--destructive) 40%, transparent);background-color:color-mix(in oklab,var(--destructive) 20%,transparent)}@media(hover:hover){:where(.dark,[data-theme=dark]) .cl-badge[data-variant=ghost]:hover{background-color:color-mix(in oklab,var(--muted) 50%,transparent)}}.cl-badge:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px var(--_ring)}.cl-badge[aria-invalid=true]{--_ring: color-mix(in oklab, var(--destructive) 20%, transparent);border-color:var(--destructive)}:where(.dark,[data-theme=dark]) .cl-badge[aria-invalid=true]{--_ring: color-mix(in oklab, var(--destructive) 40%, transparent)}}@layer cl.components{.cl-button{--_h: 2rem;--_px: .625rem;--_px-icon: .5rem;--_gap: .375rem;--_svg: 1rem;--_ring: color-mix(in oklab, var(--ring) 50%, transparent);display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;gap:var(--_gap);height:var(--_h);padding:0 var(--_px);border:1px solid transparent;border-radius:var(--radius);background-color:transparent;background-clip:padding-box;color:inherit;font-size:.875rem;line-height:1.25rem;font-weight:500;white-space:nowrap;text-decoration:none;cursor:pointer;user-select:none;-webkit-user-select:none;outline:none;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-button:has([data-icon=inline-start]){padding-inline-start:var(--_px-icon)}.cl-button:has([data-icon=inline-end]){padding-inline-end:var(--_px-icon)}.cl-button svg{pointer-events:none;flex-shrink:0}.cl-button svg:not([class*=size-]){width:var(--_svg);height:var(--_svg)}.cl-button:active:not([aria-haspopup]){translate:0 1px}.cl-button:disabled,.cl-button[aria-disabled=true]{pointer-events:none;opacity:.5}.cl-button:not([data-variant]),.cl-button[data-variant=default]{background-color:var(--primary);color:var(--primary-foreground)}.cl-button[data-variant=outline]{border-color:var(--border);background-color:var(--background)}.cl-button[data-variant=secondary]{background-color:var(--secondary);color:var(--secondary-foreground)}.cl-button[data-variant=destructive]{--_ring: color-mix(in oklab, var(--destructive) 20%, transparent);background-color:color-mix(in oklab,var(--destructive) 10%,transparent);color:var(--destructive)}.cl-button[data-variant=link]{color:var(--primary);text-underline-offset:4px}.cl-button:is([data-variant=outline],[data-variant=ghost])[aria-expanded=true]{background-color:var(--muted);color:var(--foreground)}@media(hover:hover){.cl-button:not([data-variant]):hover,.cl-button[data-variant=default]:hover{background-color:color-mix(in oklab,var(--primary) 80%,transparent)}.cl-button:is([data-variant=outline],[data-variant=ghost]):hover{background-color:var(--muted);color:var(--foreground)}.cl-button[data-variant=secondary]:hover{background-color:color-mix(in oklch,var(--secondary),var(--foreground) 5%)}.cl-button[data-variant=destructive]:hover{background-color:color-mix(in oklab,var(--destructive) 20%,transparent)}.cl-button[data-variant=link]:hover{text-decoration-line:underline}}:where(.dark,[data-theme=dark]) .cl-button[data-variant=outline]{border-color:var(--input);background-color:color-mix(in oklab,var(--input) 30%,transparent)}:where(.dark,[data-theme=dark]) .cl-button[data-variant=destructive]{--_ring: color-mix(in oklab, var(--destructive) 40%, transparent);background-color:color-mix(in oklab,var(--destructive) 20%,transparent)}@media(hover:hover){:where(.dark,[data-theme=dark]) .cl-button[data-variant=outline]:hover{background-color:color-mix(in oklab,var(--input) 50%,transparent)}:where(.dark,[data-theme=dark]) .cl-button[data-variant=ghost]:hover{background-color:color-mix(in oklab,var(--muted) 50%,transparent)}:where(.dark,[data-theme=dark]) .cl-button[data-variant=destructive]:hover{background-color:color-mix(in oklab,var(--destructive) 30%,transparent)}}.cl-button:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px var(--_ring)}.cl-button[data-variant=destructive]:focus-visible{border-color:color-mix(in oklab,var(--destructive) 40%,transparent)}.cl-button[aria-invalid=true]{border-color:var(--destructive);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 20%,transparent)}:where(.dark,[data-theme=dark]) .cl-button[aria-invalid=true]{border-color:color-mix(in oklab,var(--destructive) 50%,transparent);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 40%,transparent)}.cl-button[data-size=xs]{--_h: 1.5rem;--_px: .5rem;--_px-icon: .375rem;--_gap: .25rem;--_svg: .75rem;border-radius:min(calc(var(--radius) * .8),10px);font-size:.75rem;line-height:1rem}.cl-button[data-size=sm]{--_h: 1.75rem;--_px-icon: .375rem;--_gap: .25rem;--_svg: .875rem;border-radius:min(calc(var(--radius) * .8),12px);font-size:.8rem;line-height:inherit}.cl-button[data-size=lg]{--_h: 2.25rem}.cl-button[data-size^=icon]{--_px: 0;--_px-icon: 0;--_gap: normal;width:var(--_h)}.cl-button[data-size=icon-xs]{--_h: 1.5rem;--_svg: .75rem;border-radius:min(calc(var(--radius) * .8),10px)}.cl-button[data-size=icon-sm]{--_h: 1.75rem;border-radius:min(calc(var(--radius) * .8),12px)}.cl-button[data-size=icon-lg]{--_h: 2.25rem}}@layer cl.components{.cl-card{--card-spacing: 1rem;display:flex;flex-direction:column;gap:var(--card-spacing);overflow:hidden;padding-block:var(--card-spacing);border-radius:calc(var(--radius) * 1.4);background-color:var(--card);color:var(--card-foreground);font-size:.875rem;line-height:1.25rem;box-shadow:0 0 0 1px color-mix(in oklab,var(--foreground) 10%,transparent)}.cl-card[data-size=sm]{--card-spacing: .75rem}.cl-card:has(.cl-card-footer){padding-bottom:0}.cl-card:has(>img:first-child){padding-top:0}.cl-card>img:first-child{border-top-left-radius:calc(var(--radius) * 1.4);border-top-right-radius:calc(var(--radius) * 1.4)}.cl-card>img:last-child{border-bottom-left-radius:calc(var(--radius) * 1.4);border-bottom-right-radius:calc(var(--radius) * 1.4)}.cl-card-header{container:card-header / inline-size;display:grid;grid-auto-rows:min-content;align-items:flex-start;gap:.25rem;padding-inline:var(--card-spacing);border-top-left-radius:calc(var(--radius) * 1.4);border-top-right-radius:calc(var(--radius) * 1.4)}.cl-card-header:has(.cl-card-action){grid-template-columns:1fr auto}.cl-card-header:has(.cl-card-description){grid-template-rows:auto auto}.cl-card-header.border-b,.cl-card-header[data-border]{padding-bottom:var(--card-spacing);border-bottom-width:1px}.cl-card-title{font-size:1rem;line-height:1.375;font-weight:500}.cl-card[data-size=sm] .cl-card-title{font-size:.875rem}.cl-card-description{color:var(--muted-foreground);font-size:.875rem;line-height:1.25rem}.cl-card-action{grid-column-start:2;grid-row:1 / span 2;align-self:flex-start;justify-self:flex-end}.cl-card-content{padding-inline:var(--card-spacing)}.cl-card-footer{display:flex;align-items:center;padding:var(--card-spacing);border-top-width:1px;border-bottom-left-radius:calc(var(--radius) * 1.4);border-bottom-right-radius:calc(var(--radius) * 1.4);background-color:color-mix(in oklab,var(--muted) 50%,transparent)}}@layer cl.components{.cl-carousel{--cl-carousel-per-view: 1;--cl-carousel-gap: 1rem;position:relative}.cl-carousel-content{display:flex;gap:var(--cl-carousel-gap);overflow:auto hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:var(--radius);outline:none}.cl-carousel-content::-webkit-scrollbar{display:none}.cl-carousel-content:focus-visible{box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}.cl-carousel-content[data-dragging]{scroll-snap-type:none;cursor:grabbing;-webkit-user-select:none;user-select:none}.cl-carousel-item{flex:0 0 calc((100% - (var(--cl-carousel-per-view) - 1) * var(--cl-carousel-gap)) / var(--cl-carousel-per-view));min-width:0;scroll-snap-align:start}.cl-carousel[data-orientation=vertical] .cl-carousel-content{flex-direction:column;overflow:hidden auto;overscroll-behavior-x:auto;overscroll-behavior-y:contain;scroll-snap-type:y mandatory}.cl-carousel :is(.cl-carousel-previous,.cl-carousel-next){position:absolute;inset-block:0;margin-block:auto;border-radius:calc(infinity * 1px);touch-action:manipulation}.cl-carousel .cl-button:is(.cl-carousel-previous,.cl-carousel-next){border-radius:calc(infinity * 1px)}.cl-carousel-previous{inset-inline-start:-3rem}.cl-carousel-next{inset-inline-end:-3rem}.cl-carousel:not([data-orientation=vertical]) :is(.cl-carousel-previous,.cl-carousel-next):dir(rtl) svg{rotate:180deg}.cl-carousel[data-orientation=vertical] :is(.cl-carousel-previous,.cl-carousel-next){inset:auto auto auto 50%;margin:0;translate:-50% 0;rotate:90deg}.cl-carousel[data-orientation=vertical] .cl-carousel-previous{top:-3rem}.cl-carousel[data-orientation=vertical] .cl-carousel-next{bottom:-3rem}}@layer cl.components{.cl-checkbox{appearance:none;-webkit-appearance:none;position:relative;display:inline-grid;flex-shrink:0;place-content:center;width:1rem;height:1rem;margin:0;border:1px solid var(--input);border-radius:4px;background-color:transparent;color:inherit;cursor:default;outline:none;transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-checkbox:before{content:"";width:.875rem;height:.875rem;background-color:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;visibility:hidden}.cl-checkbox:after{content:"";position:absolute;inset:-.5rem -.75rem}.cl-checkbox:checked{border-color:var(--primary);background-color:var(--primary);color:var(--primary-foreground)}.cl-checkbox:checked:before{visibility:visible}.cl-checkbox:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}.cl-checkbox:disabled{cursor:not-allowed;opacity:.5}.cl-checkbox[aria-invalid=true]{border-color:var(--destructive);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 20%,transparent)}.cl-checkbox[aria-invalid=true]:checked{border-color:var(--primary)}:where(.dark,[data-theme=dark]) .cl-checkbox{background-color:color-mix(in oklab,var(--input) 30%,transparent)}:where(.dark,[data-theme=dark]) .cl-checkbox:checked{background-color:var(--primary)}:where(.dark,[data-theme=dark]) .cl-checkbox[aria-invalid=true]{box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 40%,transparent)}:where(.dark,[data-theme=dark]) .cl-checkbox[aria-invalid=true]:not(:checked){border-color:color-mix(in oklab,var(--destructive) 50%,transparent)}}@layer cl.components{.cl-combobox{position:relative;display:flex;align-items:center;height:2rem;min-width:0;border:1px solid var(--input);border-radius:var(--radius);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-combobox:has(>.cl-combobox-input:focus-visible){border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}.cl-combobox:has(>.cl-combobox-input[aria-invalid=true]){border-color:var(--destructive);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 20%,transparent)}.cl-combobox:has(>.cl-combobox-input:disabled){background-color:color-mix(in oklab,var(--input) 50%,transparent);opacity:.5}:where(.dark,[data-theme=dark]) .cl-combobox{background-color:color-mix(in oklab,var(--input) 30%,transparent)}:where(.dark,[data-theme=dark]) .cl-combobox:has(>.cl-combobox-input:disabled){background-color:color-mix(in oklab,var(--input) 80%,transparent)}:where(.dark,[data-theme=dark]) .cl-combobox:has(>.cl-combobox-input[aria-invalid=true]){border-color:color-mix(in oklab,var(--destructive) 50%,transparent);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 40%,transparent)}.cl-combobox-input{flex:1;width:100%;min-width:0;height:2rem;padding:.25rem .375rem .25rem .625rem;border:0;border-radius:0;background-color:transparent;color:inherit;font-size:1rem;line-height:1.5rem;outline:none}.cl-combobox-input::placeholder{color:var(--muted-foreground)}.cl-combobox-input:disabled{pointer-events:none;cursor:not-allowed}@media(width>=48rem){.cl-combobox-input{font-size:.875rem;line-height:1.25rem}}.cl-combobox-trigger{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;margin-inline-end:.2rem;padding:0;border:0;border-radius:calc(var(--radius) - 3px);background-color:transparent;cursor:default;transition-property:color,background-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-combobox-trigger:before{content:"";width:1rem;height:1rem;background-color:var(--muted-foreground);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat}@media(hover:hover){.cl-combobox-trigger:hover{background-color:var(--muted)}}.cl-combobox-trigger:disabled{pointer-events:none}.cl-combobox-content{display:none;width:var(--cl-anchor-width, auto);min-width:max(9rem,calc(var(--cl-anchor-width, 0px) + 1.75rem));max-height:min(18rem,var(--cl-available-height, 18rem));overflow:hidden;padding:0;border-radius:var(--radius);background-color:var(--popover);color:var(--popover-foreground);font-size:1rem;line-height:1.5rem;box-shadow:0 0 0 1px color-mix(in oklab,var(--foreground) 10%,transparent),0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.cl-combobox-content:popover-open{display:block}.cl-combobox-list{max-height:min(15.75rem,calc(var(--cl-available-height, 18rem) - 2.25rem));overflow-y:auto;overscroll-behavior:contain;scroll-padding-block:.25rem;scrollbar-width:none;padding:.25rem}.cl-combobox-list::-webkit-scrollbar{display:none}.cl-combobox-content[data-empty] .cl-combobox-list{padding:0}.cl-combobox-item{position:relative;display:flex;align-items:center;gap:.5rem;width:100%;padding-block:.25rem;padding-inline:.375rem 2rem;border-radius:calc(var(--radius) * .8);font-size:.875rem;line-height:1.25rem;cursor:default;-webkit-user-select:none;user-select:none;outline:none}.cl-combobox-item[hidden]{display:none}.cl-combobox-item[data-highlighted]{background-color:var(--accent);color:var(--accent-foreground)}.cl-combobox-item[aria-disabled=true]{pointer-events:none;opacity:.5}.cl-combobox-item svg{flex-shrink:0;width:1rem;height:1rem;pointer-events:none}.cl-combobox-item[aria-selected=true]:after{content:"";position:absolute;inset-inline-end:.5rem;width:1rem;height:1rem;background-color:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;pointer-events:none}.cl-combobox-label{padding:.375rem .5rem;color:var(--muted-foreground);font-size:.75rem;line-height:1rem}.cl-combobox-separator{height:1px;margin:.25rem -.25rem;background-color:var(--border)}.cl-combobox-empty{display:none;justify-content:center;width:100%;padding-block:.5rem;color:var(--muted-foreground);font-size:.875rem;line-height:1.25rem;text-align:center}.cl-combobox-content[data-empty] .cl-combobox-empty{display:flex}}@layer cl.components{.cl-dialog{position:fixed;inset:50% auto auto 50%;z-index:50;gap:1rem;width:100%;height:auto;max-width:calc(100% - 2rem);max-height:none;margin:0;padding:1rem;border:0;border-radius:calc(var(--radius) * 1.4);background-color:var(--popover);color:var(--popover-foreground);font-size:.875rem;line-height:1.25rem;outline:none;box-shadow:0 0 0 1px color-mix(in oklab,var(--foreground) 10%,transparent);translate:-50% -50%;opacity:0;scale:.95;transition-property:opacity,scale,display,overlay;transition-duration:.1s;transition-timing-function:ease;transition-behavior:allow-discrete}.cl-dialog[open]{display:grid;opacity:1;scale:1}@starting-style{.cl-dialog[open]{opacity:0;scale:.95}}@media(width>=40rem){.cl-dialog{max-width:24rem}}.cl-dialog::backdrop{background-color:#0000;transition-property:background-color,backdrop-filter,display,overlay;transition-duration:.1s;transition-timing-function:ease;transition-behavior:allow-discrete}.cl-dialog[open]::backdrop{background-color:#0000001a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@starting-style{.cl-dialog[open]::backdrop{background-color:#0000;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}@media(prefers-reduced-motion:reduce){.cl-dialog,.cl-dialog::backdrop{transition-duration:0s}}.cl-dialog-header{display:flex;flex-direction:column;gap:.5rem}.cl-dialog-title{margin:0;font-size:1rem;line-height:1;font-weight:500}.cl-dialog-description{margin:0;color:var(--muted-foreground);font-size:.875rem;line-height:1.25rem}.cl-dialog-description>a{text-decoration-line:underline;text-underline-offset:3px}@media(hover:hover){.cl-dialog-description>a:hover{color:var(--foreground)}}.cl-dialog-footer{display:flex;flex-direction:column-reverse;gap:.5rem;margin:0 -1rem -1rem;padding:1rem;border-top:1px solid var(--border);border-radius:0 0 calc(var(--radius) * 1.4) calc(var(--radius) * 1.4);background-color:color-mix(in oklab,var(--muted) 50%,transparent)}@media(width>=40rem){.cl-dialog-footer{flex-direction:row;justify-content:flex-end}}.cl-dialog-close{position:absolute;top:.5rem;inset-inline-end:.5rem}}@layer cl.components{.cl-menu{display:none;width:var(--cl-anchor-width, auto);min-width:8rem;max-height:var(--cl-available-height, none);overflow-x:hidden;overflow-y:auto;padding:.25rem;border-radius:var(--radius);background-color:var(--popover);color:var(--popover-foreground);font-size:1rem;line-height:1.5rem;outline:none;box-shadow:0 0 0 1px color-mix(in oklab,var(--foreground) 10%,transparent),0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.cl-menu:popover-open{display:block}.cl-menu-item{position:relative;display:flex;align-items:center;gap:.375rem;width:100%;padding:.25rem .375rem;border:0 solid var(--border);border-radius:calc(var(--radius) * .8);background-color:transparent;color:inherit;font:inherit;font-size:.875rem;line-height:1.25rem;text-align:start;text-decoration:none;cursor:default;outline:none;user-select:none;-webkit-user-select:none}.cl-menu-item svg{pointer-events:none;flex-shrink:0}.cl-menu-item svg:not([class*=size-]){width:1rem;height:1rem}.cl-menu-item:focus{background-color:var(--accent);color:var(--accent-foreground)}.cl-menu-item:not([data-variant=destructive]):focus *{color:var(--accent-foreground)}.cl-menu-item[data-inset]{padding-inline-start:1.75rem}.cl-menu-item:disabled,.cl-menu-item[aria-disabled=true]{pointer-events:none;opacity:.5}.cl-menu-item[data-variant=destructive],.cl-menu-item[data-variant=destructive]>svg{color:var(--destructive)}.cl-menu-item[data-variant=destructive]:focus{background-color:color-mix(in oklab,var(--destructive) 10%,transparent);color:var(--destructive)}:where(.dark,[data-theme=dark]) .cl-menu-item[data-variant=destructive]:focus{background-color:color-mix(in oklab,var(--destructive) 20%,transparent)}.cl-menu-item:is([role=menuitemcheckbox],[role=menuitemradio]){padding-inline-end:2rem;padding-inline-start:.375rem}.cl-menu-item:is([role=menuitemcheckbox],[role=menuitemradio]):after{content:"";position:absolute;inset-inline-end:.5rem;width:1rem;height:1rem;background-color:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;visibility:hidden}.cl-menu-item[aria-checked=true]:after{visibility:visible}.cl-menu-label{padding:.25rem .375rem;color:var(--muted-foreground);font-size:.75rem;line-height:1rem;font-weight:500}.cl-menu-label[data-inset]{padding-inline-start:1.75rem}.cl-menu-separator{height:1px;margin:.25rem -.25rem;background-color:var(--border)}.cl-menu-shortcut{margin-inline-start:auto;color:var(--muted-foreground);font-size:.75rem;line-height:1rem;letter-spacing:.1em}.cl-menu-item:focus .cl-menu-shortcut{color:var(--accent-foreground)}}@layer cl.components{.cl-input{width:100%;min-width:0;height:2rem;padding:.25rem .625rem;border:1px solid var(--input);border-radius:var(--radius);background-color:transparent;color:inherit;font-size:1rem;line-height:1.5rem;outline:none;transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-input::placeholder{color:var(--muted-foreground)}.cl-input::file-selector-button{display:inline-flex;height:1.5rem;border:0;background-color:transparent;color:var(--foreground);font-size:.875rem;line-height:1.25rem;font-weight:500}.cl-input:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}.cl-input:disabled{pointer-events:none;cursor:not-allowed;opacity:.5;background-color:color-mix(in oklab,var(--input) 50%,transparent)}.cl-input[aria-invalid=true]{border-color:var(--destructive);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 20%,transparent)}@media(width>=48rem){.cl-input{font-size:.875rem;line-height:1.25rem}}:where(.dark,[data-theme=dark]) .cl-input{background-color:color-mix(in oklab,var(--input) 30%,transparent)}:where(.dark,[data-theme=dark]) .cl-input:disabled{background-color:color-mix(in oklab,var(--input) 80%,transparent)}:where(.dark,[data-theme=dark]) .cl-input[aria-invalid=true]{border-color:color-mix(in oklab,var(--destructive) 50%,transparent);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 40%,transparent)}}@layer cl.components{.cl-kbd{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;width:fit-content;min-width:1.25rem;height:1.25rem;padding-inline:.25rem;border-radius:calc(var(--radius) * .6);background-color:var(--muted);color:var(--muted-foreground);font-family:var(--font-sans, ui-sans-serif, system-ui, sans-serif);font-size:.75rem;line-height:1rem;font-weight:500;pointer-events:none;user-select:none;-webkit-user-select:none}.cl-kbd svg:not([class*=size-]){width:.75rem;height:.75rem}.cl-kbd-group{display:inline-flex;align-items:center;gap:.25rem}}@layer cl.components{.cl-label{display:flex;align-items:center;gap:.5rem;font-size:.875rem;line-height:1;font-weight:500;user-select:none;-webkit-user-select:none}:disabled~.cl-label{cursor:not-allowed;opacity:.5}:where([data-disabled=true]) .cl-label{pointer-events:none;opacity:.5}}@layer cl.components{.cl-popover{display:none;flex-direction:column;gap:.625rem;width:18rem;padding:.625rem;border-radius:var(--radius);background-color:var(--popover);color:var(--popover-foreground);font-size:.875rem;line-height:1.25rem;outline:none;box-shadow:0 0 0 1px color-mix(in oklab,var(--foreground) 10%,transparent),0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.cl-popover:popover-open{display:flex}.cl-popover-header{display:flex;flex-direction:column;gap:.125rem;font-size:.875rem;line-height:1.25rem}.cl-popover-title{margin:0;font-weight:500}.cl-popover-description{margin:0;color:var(--muted-foreground)}}@layer cl.components{.cl-select{--_h: 2rem;position:relative;width:fit-content}.cl-select[data-size=sm]{--_h: 1.75rem}.cl-select:has(select:disabled){opacity:.5}.cl-select>select{appearance:none;-webkit-appearance:none;width:100%;min-width:0;height:var(--_h);margin:0;padding:.25rem 2rem .25rem .625rem;border:1px solid var(--input);border-radius:var(--radius);background-color:transparent;color:inherit;font:inherit;font-size:.875rem;line-height:1.25rem;outline:none;user-select:none;-webkit-user-select:none;transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-select[data-size=sm]>select{padding-block:.125rem;border-radius:min(calc(var(--radius) * .8),10px)}.cl-select>select>:is(option,optgroup){background-color:Canvas;color:CanvasText}.cl-select:after{content:"";position:absolute;top:50%;inset-inline-end:.625rem;width:1rem;height:1rem;translate:0 -50%;background-color:var(--muted-foreground);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;pointer-events:none}.cl-select>select:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}.cl-select>select:disabled{pointer-events:none;cursor:not-allowed}.cl-select>select[aria-invalid=true]{border-color:var(--destructive);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 20%,transparent)}:where(.dark,[data-theme=dark]) .cl-select>select{background-color:color-mix(in oklab,var(--input) 30%,transparent)}@media(hover:hover){:where(.dark,[data-theme=dark]) .cl-select>select:hover{background-color:color-mix(in oklab,var(--input) 50%,transparent)}}:where(.dark,[data-theme=dark]) .cl-select>select[aria-invalid=true]{border-color:color-mix(in oklab,var(--destructive) 50%,transparent);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 40%,transparent)}}@layer cl.components{.cl-separator{flex-shrink:0;width:100%;height:1px;background-color:var(--border)}.cl-separator[data-orientation=vertical]{width:1px;height:auto;align-self:stretch}}@layer cl.components{.cl-sheet{--_from: 2.5rem 0;position:fixed;inset:0 0 0 auto;z-index:50;gap:1rem;width:75%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0 solid var(--border);border-left-width:1px;background-color:var(--popover);background-clip:padding-box;color:var(--popover-foreground);font-size:.875rem;line-height:1.25rem;outline:none;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;opacity:0;translate:var(--_from);transition-property:opacity,translate,display,overlay;transition-duration:.2s;transition-timing-function:ease-in-out;transition-behavior:allow-discrete}.cl-sheet[open]{display:flex;flex-direction:column;opacity:1;translate:0 0}@starting-style{.cl-sheet[open]{opacity:0;translate:var(--_from)}}.cl-sheet[data-side=left]{--_from: -2.5rem 0;inset:0 auto 0 0;border-left-width:0;border-right-width:1px}.cl-sheet:is([data-side=top],[data-side=bottom]){width:auto;height:auto;border-left-width:0}.cl-sheet[data-side=top]{--_from: 0 -2.5rem;inset:0 0 auto;border-bottom-width:1px}.cl-sheet[data-side=bottom]{--_from: 0 2.5rem;inset:auto 0 0;border-top-width:1px}@media(width>=40rem){.cl-sheet:not([data-side=top],[data-side=bottom]){max-width:24rem}}.cl-sheet::backdrop{background-color:#0000;transition-property:background-color,backdrop-filter,display,overlay;transition-duration:.1s;transition-behavior:allow-discrete}.cl-sheet[open]::backdrop{background-color:#0000001a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}@starting-style{.cl-sheet[open]::backdrop{background-color:#0000;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}@media(prefers-reduced-motion:reduce){.cl-sheet,.cl-sheet::backdrop{transition-duration:0s}}.cl-sheet-header{display:flex;flex-direction:column;gap:.125rem;padding:1rem}.cl-sheet-footer{display:flex;flex-direction:column;gap:.5rem;margin-top:auto;padding:1rem}.cl-sheet-title{margin:0;color:var(--foreground);font-size:1rem;line-height:1.5rem;font-weight:500}.cl-sheet-description{margin:0;color:var(--muted-foreground);font-size:.875rem;line-height:1.25rem}.cl-sheet-close{position:absolute;top:.75rem;inset-inline-end:.75rem}}@layer cl.components{@keyframes cl-pulse{50%{opacity:.5}}.cl-skeleton{border-radius:calc(var(--radius) * .8);background-color:var(--muted);animation:cl-pulse 2s cubic-bezier(.4,0,.6,1) infinite}}@layer cl.components{.cl-slider{appearance:none;-webkit-appearance:none;display:block;width:100%;height:1.75rem;margin:-.75rem 0;padding:0;background:transparent;touch-action:none;-webkit-user-select:none;user-select:none;outline:none}.cl-slider:disabled{pointer-events:none;opacity:.5}.cl-slider::-webkit-slider-runnable-track{height:.25rem;border-radius:calc(infinity * 1px);background:linear-gradient(to right,var(--primary) var(--cl-slider-fill, 0%),var(--muted) var(--cl-slider-fill, 0%))}.cl-slider:dir(rtl)::-webkit-slider-runnable-track{background:linear-gradient(to left,var(--primary) var(--cl-slider-fill, 0%),var(--muted) var(--cl-slider-fill, 0%))}.cl-slider::-moz-range-track{height:.25rem;border-radius:calc(infinity * 1px);background-color:var(--muted)}.cl-slider::-moz-range-progress{height:.25rem;border-radius:calc(infinity * 1px);background-color:var(--primary)}.cl-slider::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;box-sizing:border-box;width:.75rem;height:.75rem;margin-top:-.25rem;border:1px solid var(--ring);border-radius:calc(infinity * 1px);background-color:#fff;transition-property:color,box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-slider::-moz-range-thumb{box-sizing:border-box;width:.75rem;height:.75rem;border:1px solid var(--ring);border-radius:calc(infinity * 1px);background-color:#fff;transition-property:color,box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-slider:is(:focus-visible,:active)::-webkit-slider-thumb{box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}.cl-slider:is(:focus-visible,:active)::-moz-range-thumb{box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}@media(hover:hover){.cl-slider::-webkit-slider-thumb:hover{box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}.cl-slider::-moz-range-thumb:hover{box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}}}@layer cl.components{.cl-switch{--_w: 32px;--_h: 18.4px;--_thumb: 1rem;appearance:none;-webkit-appearance:none;position:relative;display:inline-flex;flex-shrink:0;align-items:center;width:var(--_w);height:var(--_h);margin:0;border:1px solid transparent;border-radius:calc(infinity * 1px);background-color:var(--input);cursor:default;outline:none;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-switch[data-size=sm]{--_w: 24px;--_h: 14px;--_thumb: .75rem}.cl-switch:before{content:"";display:block;width:var(--_thumb);height:var(--_thumb);border-radius:calc(infinity * 1px);background-color:var(--background);pointer-events:none;transition-property:transform,translate,scale,rotate;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-switch:after{content:"";position:absolute;inset:-.5rem -.75rem}.cl-switch:checked{background-color:var(--primary)}.cl-switch:checked:before{translate:calc(100% - 2px) 0}.cl-switch:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}.cl-switch:disabled{cursor:not-allowed;opacity:.5}.cl-switch[aria-invalid=true]{border-color:var(--destructive);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 20%,transparent)}:where(.dark,[data-theme=dark]) .cl-switch:not(:checked){background-color:color-mix(in oklab,var(--input) 80%,transparent)}:where(.dark,[data-theme=dark]) .cl-switch:before{background-color:var(--foreground)}:where(.dark,[data-theme=dark]) .cl-switch:checked:before{background-color:var(--primary-foreground)}:where(.dark,[data-theme=dark]) .cl-switch[aria-invalid=true]{border-color:color-mix(in oklab,var(--destructive) 50%,transparent);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 40%,transparent)}}@layer cl.components{.cl-tabs{display:flex;flex-direction:column;gap:.5rem}.cl-tabs-list{display:inline-flex;align-items:center;justify-content:center;width:fit-content;height:2rem;padding:3px;border-radius:var(--radius);background-color:var(--muted);color:var(--muted-foreground)}.cl-tabs-list[data-variant=line]{gap:.25rem;border-radius:0;background-color:transparent}.cl-tabs-trigger{position:relative;display:inline-flex;flex:1 1 0%;align-items:center;justify-content:center;gap:.375rem;height:calc(100% - 1px);padding:.125rem .375rem;border:1px solid transparent;border-radius:calc(var(--radius) * .8);background-color:transparent;color:color-mix(in oklab,var(--foreground) 60%,transparent);font:inherit;font-size:.875rem;line-height:1.25rem;font-weight:500;white-space:nowrap;cursor:pointer;outline:none;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-tabs-trigger svg{pointer-events:none;flex-shrink:0}.cl-tabs-trigger svg:not([class*=size-]){width:1rem;height:1rem}.cl-tabs-trigger:disabled{pointer-events:none;opacity:.5}.cl-tabs-trigger[aria-selected=true]{background-color:var(--background);color:var(--foreground)}.cl-tabs-list:not([data-variant=line]) .cl-tabs-trigger[aria-selected=true]{box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a}.cl-tabs-list[data-variant=line] .cl-tabs-trigger{background-color:transparent}.cl-tabs-trigger:after{content:"";position:absolute;inset-inline:0;bottom:-5px;height:2px;background-color:var(--foreground);opacity:0;transition:opacity .15s cubic-bezier(.4,0,.2,1)}.cl-tabs-list[data-variant=line] .cl-tabs-trigger[aria-selected=true]:after{opacity:1}@media(hover:hover){.cl-tabs-trigger:hover{color:var(--foreground)}}.cl-tabs-trigger:focus-visible{border-color:var(--ring);outline:1px solid var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}:where(.dark,[data-theme=dark]) .cl-tabs-trigger{color:var(--muted-foreground)}@media(hover:hover){:where(.dark,[data-theme=dark]) .cl-tabs-trigger:hover{color:var(--foreground)}}:where(.dark,[data-theme=dark]) .cl-tabs-trigger[aria-selected=true]{border-color:var(--input);background-color:color-mix(in oklab,var(--input) 30%,transparent);color:var(--foreground)}:where(.dark,[data-theme=dark]) .cl-tabs-list[data-variant=line] .cl-tabs-trigger[aria-selected=true]{border-color:transparent;background-color:transparent}.cl-tabs-content{flex:1 1 0%;font-size:.875rem;line-height:1.25rem;outline:none}.cl-tabs-content[hidden]{display:none}}@layer cl.components{.cl-textarea{display:flex;field-sizing:content;width:100%;min-height:4rem;padding:.5rem .625rem;border:1px solid var(--input);border-radius:var(--radius);background-color:transparent;color:inherit;font-size:1rem;line-height:1.5rem;outline:none;transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.cl-textarea::placeholder{color:var(--muted-foreground)}.cl-textarea:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px color-mix(in oklab,var(--ring) 50%,transparent)}.cl-textarea:disabled{cursor:not-allowed;opacity:.5;background-color:color-mix(in oklab,var(--input) 50%,transparent)}.cl-textarea[aria-invalid=true]{border-color:var(--destructive);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 20%,transparent)}@media(width>=48rem){.cl-textarea{font-size:.875rem;line-height:1.25rem}}:where(.dark,[data-theme=dark]) .cl-textarea{background-color:color-mix(in oklab,var(--input) 30%,transparent)}:where(.dark,[data-theme=dark]) .cl-textarea:disabled{background-color:color-mix(in oklab,var(--input) 80%,transparent)}:where(.dark,[data-theme=dark]) .cl-textarea[aria-invalid=true]{border-color:color-mix(in oklab,var(--destructive) 50%,transparent);box-shadow:0 0 0 3px color-mix(in oklab,var(--destructive) 40%,transparent)}}@layer cl.components{.cl-toaster{--gap: 14px;position:fixed;inset-inline-end:24px;bottom:24px;z-index:100;width:356px;height:var(--front-height, 0px);margin:0;padding:0;list-style:none}@media(width<600px){.cl-toaster{right:16px;bottom:16px;left:16px;width:auto}}.cl-toaster[data-expanded]:before{content:"";position:absolute;inset-inline:0;bottom:0;height:var(--expanded-height, 0px)}.cl-toast{--y: 0px;--scale: 1;position:absolute;right:0;bottom:0;left:0;display:flex;align-items:center;gap:6px;box-sizing:border-box;padding:16px;overflow:hidden;border:1px solid var(--border);border-radius:var(--radius);background-color:var(--popover);color:var(--popover-foreground);font-size:13px;box-shadow:0 4px 12px #0000001a;transform:translateY(var(--y)) scale(var(--scale));transform-origin:bottom center;transition-property:transform,opacity,height;transition-duration:.4s;transition-timing-function:ease}@starting-style{.cl-toast{opacity:0;transform:translateY(100%)}}.cl-toaster:not([data-expanded]) .cl-toast:not([data-front]){height:var(--front-height)}.cl-toaster:not([data-expanded]) .cl-toast:not([data-front])>*{opacity:0}.cl-toast>*{transition:opacity .4s}.cl-toast[data-hidden],.cl-toast[data-removed]{opacity:0;pointer-events:none}.cl-toast[data-removed]{transform:translateY(calc(var(--y) + 25%)) scale(var(--scale));transition-duration:.2s}.cl-toast-icon{display:flex;flex-shrink:0;align-self:center;margin-inline-end:4px}.cl-toast-icon svg{width:1rem;height:1rem}.cl-toast[data-type=loading] .cl-toast-icon svg{animation:cl-spin 1s linear infinite}@keyframes cl-spin{to{rotate:360deg}}.cl-toast-content{display:flex;flex-direction:column;gap:2px}.cl-toast-title{font-weight:500;line-height:1.5}.cl-toast-description{color:#3f3f3f;font-weight:400;line-height:1.4}:where(.dark,[data-theme=dark]) .cl-toast-description{color:#e8e8e8}.cl-toast-action{flex-shrink:0;height:24px;margin-inline-start:auto;padding:0 8px;border:0;border-radius:4px;background-color:var(--popover-foreground);color:var(--popover);font:inherit;font-size:12px;font-weight:500;cursor:pointer}@media(prefers-reduced-motion:reduce){.cl-toast,.cl-toast>*{transition-duration:0ms}}}@layer cl.components{.cl-tooltip{display:none;align-items:center;gap:.375rem;width:fit-content;max-width:20rem;padding:.375rem .75rem;border-radius:calc(var(--radius) * .8);background-color:var(--foreground);color:var(--background);font-size:.75rem;line-height:1rem;pointer-events:none}.cl-tooltip:popover-open{display:inline-flex}.cl-tooltip:has(.cl-kbd){padding-inline-end:.375rem}.cl-tooltip:after{content:"";position:absolute;width:.625rem;height:.625rem;border-radius:2px;background-color:var(--foreground);rotate:45deg;z-index:-1}.cl-tooltip[data-placed=top]:after{top:calc(100% - 7px);left:calc(50% - 5px)}.cl-tooltip[data-placed=bottom]:after{bottom:calc(100% - 7px);left:calc(50% - 5px)}.cl-tooltip[data-placed=left]:after{left:calc(100% - 7px);top:calc(50% - 5px)}.cl-tooltip[data-placed=right]:after{right:calc(100% - 7px);top:calc(50% - 5px)}.cl-tooltip .cl-kbd{position:relative;z-index:50;border-radius:calc(var(--radius) * .6);background-color:color-mix(in oklab,var(--background) 20%,transparent);color:var(--background)}:where(.dark,[data-theme=dark]) .cl-tooltip .cl-kbd{background-color:color-mix(in oklab,var(--background) 10%,transparent)}}@layer cl.components;@layer cl.utilities{.cl-container{width:100%;max-width:var(--cl-max, 72rem);margin-inline:auto;padding-inline:1rem}.cl-stack{display:flex;flex-direction:column;gap:var(--cl-gap, 1rem)}.cl-cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--cl-gap, .5rem)}.cl-grid-auto{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(var(--cl-min, 16rem),100%),1fr));gap:var(--cl-gap, 1rem)}.cl-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}}
|
package/cl.min.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/*! cladux-html v0.3.0 | Apache-2.0 | https://cladux.vercel.app/docs/html */
|
|
2
|
+
"use strict";(()=>{var M=new WeakMap,Gt=()=>matchMedia("(prefers-reduced-motion: reduce)").matches;function _(t){let e=t.querySelector(":scope > .cl-accordion-content");if(!e||Gt()){t.open=!1;return}let o=t.getAttribute("name");t.removeAttribute("name"),t.dataset.closing="";let n=e.animate([{height:`${e.offsetHeight}px`},{height:"0px"}],{duration:200,easing:"ease-out",fill:"forwards"});M.set(t,{animation:n,name:o}),n.onfinish=()=>{t.open=!1,n.cancel(),J(t)}}function J(t){let e=M.get(t);e&&(M.delete(t),e.name!==null&&t.setAttribute("name",e.name),requestAnimationFrame(()=>delete t.dataset.closing))}function Q(t,e){let o=e.closest(".cl-accordion-trigger"),n=o?.parentElement;if(!(n instanceof HTMLDetailsElement)||!n.matches(".cl-accordion-item")||o!==n.querySelector(":scope > summary"))return;let r=M.get(n);if(r){t.preventDefault(),r.animation.cancel(),J(n);return}if(n.open){t.preventDefault(),_(n);return}let s=n.getAttribute("name");if(s)for(let i of document.querySelectorAll("details.cl-accordion-item[open]"))i!==n&&i.getAttribute("name")===s&&_(i)}function v(t){let e=t?.closest(".cl-carousel"),o=e?.querySelector(".cl-carousel-content");if(!e||!o)return null;let n=[...o.querySelectorAll(":scope > .cl-carousel-item")];return{root:e,content:o,items:n,vertical:e.dataset.orientation==="vertical"}}var Vt=()=>matchMedia("(prefers-reduced-motion: reduce)").matches,Z=({content:t,vertical:e})=>!e&&getComputedStyle(t).direction==="rtl"?-1:1,I=t=>Math.abs(t.vertical?t.content.scrollTop:t.content.scrollLeft),O=({content:t,vertical:e})=>e?t.scrollHeight-t.clientHeight:t.scrollWidth-t.clientWidth;function D({content:t,items:e,vertical:o}){let n=e[0];if(!n)return 0;let r=getComputedStyle(t),s=parseFloat(o?r.rowGap:r.columnGap)||0;return(o?n.offsetHeight:n.offsetWidth)+s}function tt(t,e){let o=Math.min(Math.max(e,0),O(t));t.content.scrollTo({[t.vertical?"top":"left"]:o*Z(t),behavior:Vt()?"instant":"smooth"})}var H=new WeakMap;function et(t,e){let o=D(t);if(!o)return;let n=Math.round(O(t)/o),r=H.get(t.content)?.index??Math.round(I(t)/o),s=Math.min(Math.max(r+e,0),n);clearTimeout(H.get(t.content)?.timer);let i=window.setTimeout(()=>H.delete(t.content),700);H.set(t.content,{index:s,timer:i}),tt(t,s*o)}function nt(t){let e=I(t),o=t.root.querySelector(".cl-carousel-previous"),n=t.root.querySelector(".cl-carousel-next");o&&(o.disabled=e<=1),n&&(n.disabled=e>=O(t)-1)}function q(t=document){let e=[...t.querySelectorAll(".cl-carousel")];t instanceof HTMLElement&&t.matches(".cl-carousel")&&e.push(t);for(let o of e){let n=v(o);n&&(n.content.hasAttribute("tabindex")||(n.content.tabIndex=0),n.items.forEach((r,s)=>{r.setAttribute("role","group"),r.setAttribute("aria-roledescription","slide"),r.hasAttribute("aria-label")||r.setAttribute("aria-label",`${s+1} of ${n.items.length}`)}),nt(n))}}function ot(t){let e=t.closest(".cl-carousel-previous, .cl-carousel-next"),o=v(e);e&&o&&et(o,e.matches(".cl-carousel-next")?1:-1)}function rt(t,e){if(e.closest("input, textarea, select, [contenteditable]"))return;let o=v(e);if(!o||!["ArrowLeft","ArrowRight"].includes(t.key))return;let n=getComputedStyle(o.root).direction==="rtl",r=t.key==="ArrowRight"!==n;t.preventDefault(),et(o,r?1:-1)}var k=new WeakSet;function it(t){let e=t.target;!(e instanceof HTMLElement)||!e.matches(".cl-carousel-content")||k.has(e)||(k.add(e),requestAnimationFrame(()=>{k.delete(e);let o=v(e);o&&nt(o)}))}function st(t,e){if(t.pointerType!=="mouse"||t.button!==0)return;let o=e.closest(".cl-carousel-content"),n=v(o);if(!o||!n||e.closest("a, button, input, textarea, select, label"))return;let r=n.vertical?"scrollTop":"scrollLeft",s=o[r],i=n.vertical?t.clientY:t.clientX,c=Math.round(I(n)/(D(n)||1)),l=0;t.preventDefault();let b=d=>d.stopPropagation(),a=d=>{l=(n.vertical?d.clientY:d.clientX)-i,Math.abs(l)>3&&(o.dataset.dragging=""),o[r]=s-l},u=()=>{if(document.removeEventListener("pointermove",a),document.removeEventListener("pointerup",u),document.removeEventListener("pointercancel",u),!o.hasAttribute("data-dragging"))return;document.addEventListener("click",b,{capture:!0,once:!0}),setTimeout(()=>document.removeEventListener("click",b,!0));let d=D(n),f=-l*Z(n),h=Math.abs(f)>d/5?Math.sign(f):0;tt(n,(c+h)*d);let y=()=>delete o.dataset.dragging;o.addEventListener("scrollend",y,{once:!0}),setTimeout(y,600)};document.addEventListener("pointermove",a),document.addEventListener("pointerup",u),document.addEventListener("pointercancel",u)}var ct={top:"bottom",bottom:"top",left:"right",right:"left"};function A(t,e,o={}){let{align:n="center",offset:r=4,padding:s=8}=o,i=o.side??"bottom",c=e.getBoundingClientRect();t.style.setProperty("--cl-anchor-width",`${c.width}px`);let l={width:t.offsetWidth,height:t.offsetHeight},b=document.documentElement.clientWidth,a=document.documentElement.clientHeight,u={top:c.top-r-s,bottom:a-c.bottom-r-s,left:c.left-r-s,right:b-c.right-r-s},d=i==="top"||i==="bottom"?l.height:l.width;u[i]<d&&u[ct[i]]>u[i]&&(i=ct[i]);let f,h;i==="top"||i==="bottom"?(f=i==="bottom"?c.bottom+r:c.top-r-l.height,h=n==="start"?c.left:n==="end"?c.right-l.width:c.left+(c.width-l.width)/2,h=Math.min(Math.max(h,s),b-l.width-s),t.style.setProperty("--cl-available-height",`${u[i]}px`)):(h=i==="right"?c.right+r:c.left-r-l.width,f=n==="start"?c.top:n==="end"?c.bottom-l.height:c.top+(c.height-l.height)/2,f=Math.min(Math.max(f,s),a-l.height-s)),t.style.top=`${f}px`,t.style.left=`${h}px`,t.dataset.placed=i;let y=i==="left"?"right":i==="right"?"left":`${c.left+c.width/2-h}px`,Yt=i==="top"?"bottom":i==="bottom"?"top":`${c.top+c.height/2-f}px`;t.style.transformOrigin=`${y} ${Yt}`}var N='.cl-combobox-item:not([aria-disabled="true"])',jt=0,lt=t=>t.id||(t.id=`cl-combobox-${++jt}`);function g(t){let e=t?.closest(".cl-combobox"),o=e?.querySelector(".cl-combobox-input"),n=e?.querySelector(".cl-combobox-content"),r=n?.querySelector(".cl-combobox-list");return e&&o&&n&&r?{root:e,input:o,content:n,list:r}:null}var E=({content:t})=>t.matches(":popover-open"),T=({list:t})=>[...t.querySelectorAll(".cl-combobox-item")],ut=t=>T(t).filter(e=>!e.hidden&&e.matches(N)),F=t=>t.textContent?.trim()??"",at=t=>t.normalize("NFD").replace(/\p{Diacritic}/gu,"").toLowerCase();function $(t=document){let e=[...t.querySelectorAll(".cl-combobox")];t instanceof HTMLElement&&t.matches(".cl-combobox")&&e.push(t);for(let o of e){let n=g(o);if(!n)continue;let{input:r,list:s}=n;r.setAttribute("role","combobox"),r.setAttribute("aria-autocomplete","list"),r.setAttribute("aria-haspopup","listbox"),r.setAttribute("aria-expanded",String(E(n))),r.setAttribute("aria-controls",lt(s)),r.autocomplete="off",s.setAttribute("role","listbox");for(let i of T(n))i.setAttribute("role","option"),lt(i),i.hasAttribute("aria-selected")||i.setAttribute("aria-selected","false")}}function dt({input:t,content:e}){A(e,t,{side:"bottom",align:"start",offset:6})}function L(t,e,o=!0){for(let n of T(t))n.toggleAttribute("data-highlighted",n===e);e?(t.input.setAttribute("aria-activedescendant",e.id),o&&e.scrollIntoView({block:"nearest"})):t.input.removeAttribute("aria-activedescendant")}function mt(t,e){let o=at(e.trim());for(let n of T(t))n.hidden=!!o&&!at(F(n)).includes(o);for(let n of t.list.querySelectorAll('[role="group"]'))n.hidden=!n.querySelector(".cl-combobox-item:not([hidden])");for(let n of t.list.querySelectorAll(".cl-combobox-separator"))n.hidden=!!o;t.content.toggleAttribute("data-empty",ut(t).length===0)}function w(t){E(t)||($(t.root),mt(t,""),t.content.showPopover(),t.input.setAttribute("aria-expanded","true"),dt(t),L(t,T(t).find(e=>e.getAttribute("aria-selected")==="true")??null))}function x(t){if(!E(t))return;t.content.hidePopover(),t.input.setAttribute("aria-expanded","false"),L(t,null);let e=T(t).find(o=>o.getAttribute("aria-selected")==="true");t.input.value=e?F(e):""}function pt(t,e){for(let n of T(t))n.setAttribute("aria-selected",String(n===e));let o=t.root.querySelector('input[type="hidden"]');o&&(o.value=e.dataset.value??F(e)),x(t),t.input.dispatchEvent(new Event("change",{bubbles:!0}))}function ft(t){let e=g(t);if(!e)return;let o=t.closest(N);if(o&&e.list.contains(o))return pt(e,o);if(t.closest(".cl-combobox-trigger"))return e.input.focus(),E(e)?x(e):w(e);t===e.input&&!e.input.disabled&&w(e)}function bt(t){let e=g(t);!e||t!==e.input||(w(e),mt(e,e.input.value),L(e,null))}function ht(t,e){let o=g(e);if(!o||e!==o.input)return;let n=ut(o),r=n.findIndex(i=>i.hasAttribute("data-highlighted")),s=i=>{if(t.preventDefault(),!E(o))return w(o);L(o,n[(i+n.length)%n.length]??null)};switch(t.key){case"ArrowDown":return s(r+1);case"ArrowUp":return s(r<0?-1:r-1);case"Enter":E(o)&&r>=0&&(t.preventDefault(),pt(o,n[r]));return;case"Escape":E(o)&&(t.preventDefault(),x(o));return;case"Tab":return x(o)}}function Et(t){let e=t.closest(N),o=g(e);e&&o&&!e.hasAttribute("data-highlighted")&&L(o,e,!1)}function gt(t,e){e.closest(".cl-combobox-content, .cl-combobox-trigger")&&t.preventDefault()}function Tt(t,e){let o=g(e);if(!o||e!==o.input)return;let n=t.relatedTarget;n&&o.root.contains(n)||x(o)}function vt(){for(let t of document.querySelectorAll(".cl-combobox-content:popover-open")){let e=g(t);e&&dt(e)}}function B(t){let e=document.getElementById(t);e instanceof HTMLDialogElement&&!e.open&&e.showModal()}function xt(t,e){let o=e.closest("[data-dialog-open]");if(o){B(o.dataset.dialogOpen);return}let n=e.closest("[data-dialog-close]");if(n){n.closest("dialog")?.close();return}if(e instanceof HTMLDialogElement&&e.matches(".cl-dialog, .cl-sheet")){let r=e.getBoundingClientRect();t.clientX>=r.left&&t.clientX<=r.right&&t.clientY>=r.top&&t.clientY<=r.bottom||e.close()}}var R=".cl-popover, .cl-menu",Lt=10,S='.cl-menu-item:not(:disabled):not([aria-disabled="true"])';function W(t){return t.dataset.anchor&&document.getElementById(t.dataset.anchor)||document.querySelector(`[popovertarget="${CSS.escape(t.id)}"]`)}function z(t,e,o,n){A(t,e,{side:t.dataset.side||o,align:t.dataset.align||(t.matches(".cl-menu")?"start":"center"),offset:n})}var K=!1;function yt(t){let e=t.target;!(e instanceof HTMLElement)||!e.matches(R)||t.newState==="open"&&(e.style.visibility="hidden",e.dataset.placed=e.dataset.side||"bottom")}function Mt(t){let e=t.target;if(!(e instanceof HTMLElement)||!e.matches(R))return;let o=t.newState==="open",n=W(e);if(n?.setAttribute("aria-expanded",String(o)),!!o){if(n&&z(e,n,"bottom",4),e.style.visibility="",e.matches(".cl-menu")){e.hasAttribute("tabindex")||(e.tabIndex=-1);let r=e.querySelector(S);(K&&r?r:e).focus({preventScroll:!0})}K=!1}}function Ht(){for(let t of document.querySelectorAll(`${R}, .cl-tooltip`)){if(!t.matches(":popover-open"))continue;let e=t.matches(".cl-tooltip")?document.querySelector(`[aria-describedby~="${CSS.escape(t.id)}"]`):W(t);e&&z(t,e,t.matches(".cl-tooltip")?"top":"bottom",t.matches(".cl-tooltip")?Lt:4)}}function At(t,e){if(e.matches("[popovertarget]")&&["Enter"," ","ArrowDown"].includes(t.key)){K=!0,t.key==="ArrowDown"&&(t.preventDefault(),e.click());return}let o=e.closest(".cl-menu");if(!o)return;let n=[...o.querySelectorAll(S)],r=n.indexOf(document.activeElement),s=i=>{t.preventDefault(),n[(i+n.length)%n.length]?.focus()};switch(t.key){case"ArrowDown":return s(r+1);case"ArrowUp":return s(r<0?-1:r-1);case"Home":return s(0);case"End":return s(-1);case"Tab":o.hidePopover();return;default:if(t.key.length===1&&/\S/.test(t.key)){let i=t.key.toLowerCase();[...n.slice(r+1),...n.slice(0,r+1)].find(l=>l.textContent?.trim().toLowerCase().startsWith(i))?.focus()}}}function wt(t){let e=t.closest(S);e&&e.closest(".cl-menu")&&document.activeElement!==e&&e.focus({preventScroll:!0})}function St(t){let e=t.target;e instanceof HTMLElement&&e.matches(".cl-menu")&&e.contains(document.activeElement)&&e.focus({preventScroll:!0})}function Pt(t){let e=t.closest(S),o=e?.closest(".cl-menu");if(!e||!o)return;let n=e.getAttribute("role");if(n==="menuitemcheckbox")e.setAttribute("aria-checked",String(e.getAttribute("aria-checked")!=="true"));else if(n==="menuitemradio"){let r=e.closest('[role="group"]')??o;for(let s of r.querySelectorAll('[role="menuitemradio"]'))s.setAttribute("aria-checked",String(s===e))}e.hasAttribute("data-keep-open")||(o.hidePopover(),W(o)?.focus())}function Ct(t){let e=t.closest("[aria-describedby]");if(!e)return null;for(let o of e.getAttribute("aria-describedby").split(/\s+/)){let n=document.getElementById(o);if(n?.matches(".cl-tooltip"))return{owner:e,tip:n}}return null}function _t(t,e){e.matches(":popover-open")||(e.dataset.placed=e.dataset.side||"top",e.showPopover()),z(e,t,"top",Lt)}function kt(t){t.matches(":popover-open")&&t.hidePopover()}function X(t,e){if(t instanceof PointerEvent&&t.pointerType==="touch"||t instanceof FocusEvent&&!e.matches(":focus-visible"))return;let o=Ct(e);o&&_t(o.owner,o.tip)}function U(t,e){let o=Ct(e);if(!o)return;let n=t.relatedTarget;n&&o.owner.contains(n)||kt(o.tip)}function Dt(){for(let t of document.querySelectorAll(".cl-tooltip:popover-open"))kt(t)}var Ot=t=>{let e=t.min===""?0:Number(t.min),o=t.max===""?100:Number(t.max);return{min:e,max:o}};function Y(t){let{min:e,max:o}=Ot(t),n=o>e?(Number(t.value)-e)/(o-e)*100:0;t.style.setProperty("--cl-slider-fill",`${n}%`)}function qt(t){t instanceof HTMLInputElement&&t.matches(".cl-slider")&&Y(t)}function G(t=document){t instanceof HTMLInputElement&&t.matches(".cl-slider")&&Y(t);for(let e of t.querySelectorAll("input.cl-slider"))Y(e)}function Nt(t){t instanceof HTMLFormElement&&setTimeout(()=>G(t))}function It(t,e){let o=t.getBoundingClientRect(),n=Math.min(1,Math.max(0,(e-o.left-12/2)/(o.width-12)));getComputedStyle(t).direction==="rtl"&&(n=1-n);let{min:r,max:s}=Ot(t),i=t.step==="any"?0:Number(t.step||1),c=r+n*(s-r);i>0&&(c=r+Math.round((c-r)/i)*i);let l=t.value;t.value=String(c),t.value!==l&&t.dispatchEvent(new Event("input",{bubbles:!0}))}function Ft(t,e){if(t.pointerType==="mouse"||!(e instanceof HTMLInputElement)||!e.matches(".cl-slider")||e.disabled)return;let o=e,n=o.value;o.focus({preventScroll:!0});try{o.setPointerCapture(t.pointerId)}catch{}It(o,t.clientX);let r=i=>{i.pointerId===t.pointerId&&It(o,i.clientX)},s=i=>{i.pointerId===t.pointerId&&(o.removeEventListener("pointermove",r),o.removeEventListener("pointerup",s),o.removeEventListener("pointercancel",s),o.value!==n&&o.dispatchEvent(new Event("change",{bubbles:!0})))};o.addEventListener("pointermove",r),o.addEventListener("pointerup",s),o.addEventListener("pointercancel",s)}function $t(t){let e=t.closest('[role="tablist"]');if(!(!e||t.matches(":disabled")))for(let o of e.querySelectorAll('[role="tab"]')){let n=o===t;o.setAttribute("aria-selected",String(n)),o.tabIndex=n?0:-1;let r=document.getElementById(o.getAttribute("aria-controls")??"");r&&(r.hidden=!n)}}function Bt(t){let e=t.closest('.cl-tabs [role="tab"]');e&&$t(e)}function Kt(t,e){let o=e.closest('.cl-tabs [role="tab"]'),n=o?.closest('[role="tablist"]');if(!o||!n)return;let r=n.getAttribute("aria-orientation")==="vertical",s=[...n.querySelectorAll('[role="tab"]:not(:disabled)')],i=s.indexOf(o),c=r?{ArrowDown:i+1,ArrowUp:i-1,Home:0,End:s.length-1}:{ArrowRight:i+1,ArrowLeft:i-1,Home:0,End:s.length-1};if(!(t.key in c))return;t.preventDefault();let l=s[(c[t.key]+s.length)%s.length];l.focus(),$t(l)}function Rt(t=document){for(let e of t.querySelectorAll('.cl-tabs [role="tab"]'))e.tabIndex=e.getAttribute("aria-selected")==="true"?0:-1}var Wt={success:'<circle cx="12" cy="12" r="10"/><path d="m16 9-5.5 5.5L8 12"/>',info:'<circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/>',warning:'<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/>',error:'<path d="m15 9-6 6"/><path d="M2.586 16.726A2 2 0 0 1 2 15.312V8.688a2 2 0 0 1 .586-1.414l4.688-4.688A2 2 0 0 1 8.688 2h6.624a2 2 0 0 1 1.414.586l4.688 4.688A2 2 0 0 1 22 8.688v6.624a2 2 0 0 1-.586 1.414l-4.688 4.688a2 2 0 0 1-1.414.586H8.688a2 2 0 0 1-1.414-.586z"/><path d="m9 9 6 6"/>',loading:'<path d="M21 12a9 9 0 1 1-6.219-8.56"/>'},Jt=t=>`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${t}</svg>`,Qt=3,V=14;function Zt(){let t=document.querySelector("ol.cl-toaster");return t||(t=document.createElement("ol"),t.className="cl-toaster",t.setAttribute("aria-label","Notifications"),t.setAttribute("aria-live","polite"),t.addEventListener("pointerenter",()=>{t.dataset.expanded="",C(t)}),t.addEventListener("pointerleave",()=>{delete t.dataset.expanded,C(t)}),document.body.append(t)),t}function C(t){let e=[...t.querySelectorAll(".cl-toast:not([data-removed])")].reverse(),o=t.dataset.expanded!==void 0,n=e[0];t.style.setProperty("--front-height",`${n?Number(n.dataset.height):0}px`);let r=0;e.forEach((s,i)=>{s.toggleAttribute("data-front",i===0),s.toggleAttribute("data-hidden",i>=Qt),s.style.zIndex=String(e.length-i);let c=o?-r:-i*V;s.style.setProperty("--y",`${c}px`),s.style.setProperty("--scale",o?"1":String(1-i*.05)),r+=Number(s.dataset.height)+V}),t.style.setProperty("--expanded-height",`${Math.max(0,r-V)}px`)}function P(t){if(t.dataset.removed!==void 0)return;t.dataset.removed="";let e=t.closest(".cl-toaster");e&&C(e),setTimeout(()=>{t.remove(),e&&!e.querySelector(".cl-toast")&&delete e.dataset.expanded},200)}function m(t,e={}){let{description:o,type:n="default",action:r}=e,s=e.duration??(n==="loading"?1/0:4e3),i=document.createElement("li");if(i.className="cl-toast",i.dataset.type=n,i.setAttribute("role",n==="error"?"alert":"status"),Wt[n]){let a=document.createElement("div");a.className="cl-toast-icon",a.innerHTML=Jt(Wt[n]),i.append(a)}let c=document.createElement("div");c.className="cl-toast-content";let l=document.createElement("div");if(l.className="cl-toast-title",l.textContent=t,c.append(l),o){let a=document.createElement("div");a.className="cl-toast-description",a.textContent=o,c.append(a)}if(i.append(c),r){let a=document.createElement("button");a.type="button",a.className="cl-toast-action",a.textContent=r.label,a.addEventListener("click",u=>{r.onClick?.(u),P(i)}),i.append(a)}let b=Zt();if(i.toggleAttribute("data-front",!0),b.append(i),i.dataset.height=String(i.offsetHeight),C(b),Number.isFinite(s)){let a=s,u=Date.now(),d=setTimeout(()=>P(i),a);i.addEventListener("pointerenter",()=>{clearTimeout(d),a-=Date.now()-u}),i.addEventListener("pointerleave",()=>{u=Date.now(),d=setTimeout(()=>P(i),Math.max(a,1e3))})}return()=>P(i)}m.success=(t,e)=>m(t,{...e,type:"success"});m.info=(t,e)=>m(t,{...e,type:"info"});m.warning=(t,e)=>m(t,{...e,type:"warning"});m.error=(t,e)=>m(t,{...e,type:"error"});function zt(t){let e=t.closest("[data-toast]");if(!e)return;let{toast:o,toastDescription:n,toastType:r}=e.dataset;m(o,{description:n,type:r||"default"})}var Xt=!1,p=t=>t instanceof Element?t:null;function j(){if(Xt||typeof document>"u")return;Xt=!0,document.addEventListener("click",n=>{let r=p(n.target);r&&(Q(n,r),ot(r),ft(r),xt(n,r),Pt(r),Bt(r),zt(r))}),document.addEventListener("keydown",n=>{let r=p(n.target);n.key==="Escape"&&Dt(),r&&(rt(n,r),ht(n,r),At(n,r),Kt(n,r))}),document.addEventListener("input",n=>{let r=p(n.target);r&&(bt(r),qt(r))}),document.addEventListener("reset",n=>{let r=p(n.target);r&&Nt(r)}),document.addEventListener("pointerdown",n=>{let r=p(n.target);r&&(st(n,r),gt(n,r),Ft(n,r))}),document.addEventListener("beforetoggle",yt,!0),document.addEventListener("toggle",Mt,!0),document.addEventListener("pointerleave",St,!0),document.addEventListener("pointermove",n=>{let r=p(n.target);r&&(Et(r),wt(r))}),document.addEventListener("pointerover",n=>{let r=p(n.target);r&&X(n,r)}),document.addEventListener("pointerout",n=>{let r=p(n.target);r&&U(n,r)}),document.addEventListener("focusin",n=>{let r=p(n.target);r&&X(n,r)}),document.addEventListener("focusout",n=>{let r=p(n.target);r&&(Tt(n,r),U(n,r))});let t=()=>{Ht(),vt()};window.addEventListener("scroll",t,{capture:!0,passive:!0}),window.addEventListener("resize",t,{passive:!0}),document.addEventListener("scroll",it,{capture:!0,passive:!0}),window.addEventListener("resize",()=>q(),{passive:!0});let e=n=>{Rt(n),G(n),$(n),q(n)},o=()=>{e(document),new MutationObserver(n=>{for(let r of n)for(let s of r.addedNodes)s instanceof Element&&e(s)}).observe(document.body,{childList:!0,subtree:!0})};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",o):o()}var Ut={start:j,toast:m,openDialog:B};window.cl=Ut;j();})();
|
package/cl.min.mjs
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/*! cladux-html v0.3.0 | Apache-2.0 | https://cladux.vercel.app/docs/html */
|
|
2
|
+
var H=new WeakMap,Ut=()=>matchMedia("(prefers-reduced-motion: reduce)").matches;function j(t){let e=t.querySelector(":scope > .cl-accordion-content");if(!e||Ut()){t.open=!1;return}let o=t.getAttribute("name");t.removeAttribute("name"),t.dataset.closing="";let n=e.animate([{height:`${e.offsetHeight}px`},{height:"0px"}],{duration:200,easing:"ease-out",fill:"forwards"});H.set(t,{animation:n,name:o}),n.onfinish=()=>{t.open=!1,n.cancel(),_(t)}}function _(t){let e=H.get(t);e&&(H.delete(t),e.name!==null&&t.setAttribute("name",e.name),requestAnimationFrame(()=>delete t.dataset.closing))}function J(t,e){let o=e.closest(".cl-accordion-trigger"),n=o?.parentElement;if(!(n instanceof HTMLDetailsElement)||!n.matches(".cl-accordion-item")||o!==n.querySelector(":scope > summary"))return;let r=H.get(n);if(r){t.preventDefault(),r.animation.cancel(),_(n);return}if(n.open){t.preventDefault(),j(n);return}let s=n.getAttribute("name");if(s)for(let i of document.querySelectorAll("details.cl-accordion-item[open]"))i!==n&&i.getAttribute("name")===s&&j(i)}function v(t){let e=t?.closest(".cl-carousel"),o=e?.querySelector(".cl-carousel-content");if(!e||!o)return null;let n=[...o.querySelectorAll(":scope > .cl-carousel-item")];return{root:e,content:o,items:n,vertical:e.dataset.orientation==="vertical"}}var Yt=()=>matchMedia("(prefers-reduced-motion: reduce)").matches,Q=({content:t,vertical:e})=>!e&&getComputedStyle(t).direction==="rtl"?-1:1,O=t=>Math.abs(t.vertical?t.content.scrollTop:t.content.scrollLeft),q=({content:t,vertical:e})=>e?t.scrollHeight-t.clientHeight:t.scrollWidth-t.clientWidth;function I({content:t,items:e,vertical:o}){let n=e[0];if(!n)return 0;let r=getComputedStyle(t),s=parseFloat(o?r.rowGap:r.columnGap)||0;return(o?n.offsetHeight:n.offsetWidth)+s}function Z(t,e){let o=Math.min(Math.max(e,0),q(t));t.content.scrollTo({[t.vertical?"top":"left"]:o*Q(t),behavior:Yt()?"instant":"smooth"})}var A=new WeakMap;function tt(t,e){let o=I(t);if(!o)return;let n=Math.round(q(t)/o),r=A.get(t.content)?.index??Math.round(O(t)/o),s=Math.min(Math.max(r+e,0),n);clearTimeout(A.get(t.content)?.timer);let i=window.setTimeout(()=>A.delete(t.content),700);A.set(t.content,{index:s,timer:i}),Z(t,s*o)}function et(t){let e=O(t),o=t.root.querySelector(".cl-carousel-previous"),n=t.root.querySelector(".cl-carousel-next");o&&(o.disabled=e<=1),n&&(n.disabled=e>=q(t)-1)}function N(t=document){let e=[...t.querySelectorAll(".cl-carousel")];t instanceof HTMLElement&&t.matches(".cl-carousel")&&e.push(t);for(let o of e){let n=v(o);n&&(n.content.hasAttribute("tabindex")||(n.content.tabIndex=0),n.items.forEach((r,s)=>{r.setAttribute("role","group"),r.setAttribute("aria-roledescription","slide"),r.hasAttribute("aria-label")||r.setAttribute("aria-label",`${s+1} of ${n.items.length}`)}),et(n))}}function nt(t){let e=t.closest(".cl-carousel-previous, .cl-carousel-next"),o=v(e);e&&o&&tt(o,e.matches(".cl-carousel-next")?1:-1)}function ot(t,e){if(e.closest("input, textarea, select, [contenteditable]"))return;let o=v(e);if(!o||!["ArrowLeft","ArrowRight"].includes(t.key))return;let n=getComputedStyle(o.root).direction==="rtl",r=t.key==="ArrowRight"!==n;t.preventDefault(),tt(o,r?1:-1)}var D=new WeakSet;function rt(t){let e=t.target;!(e instanceof HTMLElement)||!e.matches(".cl-carousel-content")||D.has(e)||(D.add(e),requestAnimationFrame(()=>{D.delete(e);let o=v(e);o&&et(o)}))}function it(t,e){if(t.pointerType!=="mouse"||t.button!==0)return;let o=e.closest(".cl-carousel-content"),n=v(o);if(!o||!n||e.closest("a, button, input, textarea, select, label"))return;let r=n.vertical?"scrollTop":"scrollLeft",s=o[r],i=n.vertical?t.clientY:t.clientX,c=Math.round(O(n)/(I(n)||1)),l=0;t.preventDefault();let b=d=>d.stopPropagation(),a=d=>{l=(n.vertical?d.clientY:d.clientX)-i,Math.abs(l)>3&&(o.dataset.dragging=""),o[r]=s-l},u=()=>{if(document.removeEventListener("pointermove",a),document.removeEventListener("pointerup",u),document.removeEventListener("pointercancel",u),!o.hasAttribute("data-dragging"))return;document.addEventListener("click",b,{capture:!0,once:!0}),setTimeout(()=>document.removeEventListener("click",b,!0));let d=I(n),f=-l*Q(n),h=Math.abs(f)>d/5?Math.sign(f):0;Z(n,(c+h)*d);let M=()=>delete o.dataset.dragging;o.addEventListener("scrollend",M,{once:!0}),setTimeout(M,600)};document.addEventListener("pointermove",a),document.addEventListener("pointerup",u),document.addEventListener("pointercancel",u)}var st={top:"bottom",bottom:"top",left:"right",right:"left"};function x(t,e,o={}){let{align:n="center",offset:r=4,padding:s=8}=o,i=o.side??"bottom",c=e.getBoundingClientRect();t.style.setProperty("--cl-anchor-width",`${c.width}px`);let l={width:t.offsetWidth,height:t.offsetHeight},b=document.documentElement.clientWidth,a=document.documentElement.clientHeight,u={top:c.top-r-s,bottom:a-c.bottom-r-s,left:c.left-r-s,right:b-c.right-r-s},d=i==="top"||i==="bottom"?l.height:l.width;u[i]<d&&u[st[i]]>u[i]&&(i=st[i]);let f,h;i==="top"||i==="bottom"?(f=i==="bottom"?c.bottom+r:c.top-r-l.height,h=n==="start"?c.left:n==="end"?c.right-l.width:c.left+(c.width-l.width)/2,h=Math.min(Math.max(h,s),b-l.width-s),t.style.setProperty("--cl-available-height",`${u[i]}px`)):(h=i==="right"?c.right+r:c.left-r-l.width,f=n==="start"?c.top:n==="end"?c.bottom-l.height:c.top+(c.height-l.height)/2,f=Math.min(Math.max(f,s),a-l.height-s)),t.style.top=`${f}px`,t.style.left=`${h}px`,t.dataset.placed=i;let M=i==="left"?"right":i==="right"?"left":`${c.left+c.width/2-h}px`,Xt=i==="top"?"bottom":i==="bottom"?"top":`${c.top+c.height/2-f}px`;t.style.transformOrigin=`${M} ${Xt}`}var F='.cl-combobox-item:not([aria-disabled="true"])',Gt=0,ct=t=>t.id||(t.id=`cl-combobox-${++Gt}`);function g(t){let e=t?.closest(".cl-combobox"),o=e?.querySelector(".cl-combobox-input"),n=e?.querySelector(".cl-combobox-content"),r=n?.querySelector(".cl-combobox-list");return e&&o&&n&&r?{root:e,input:o,content:n,list:r}:null}var E=({content:t})=>t.matches(":popover-open"),T=({list:t})=>[...t.querySelectorAll(".cl-combobox-item")],at=t=>T(t).filter(e=>!e.hidden&&e.matches(F)),$=t=>t.textContent?.trim()??"",lt=t=>t.normalize("NFD").replace(/\p{Diacritic}/gu,"").toLowerCase();function B(t=document){let e=[...t.querySelectorAll(".cl-combobox")];t instanceof HTMLElement&&t.matches(".cl-combobox")&&e.push(t);for(let o of e){let n=g(o);if(!n)continue;let{input:r,list:s}=n;r.setAttribute("role","combobox"),r.setAttribute("aria-autocomplete","list"),r.setAttribute("aria-haspopup","listbox"),r.setAttribute("aria-expanded",String(E(n))),r.setAttribute("aria-controls",ct(s)),r.autocomplete="off",s.setAttribute("role","listbox");for(let i of T(n))i.setAttribute("role","option"),ct(i),i.hasAttribute("aria-selected")||i.setAttribute("aria-selected","false")}}function ut({input:t,content:e}){x(e,t,{side:"bottom",align:"start",offset:6})}function y(t,e,o=!0){for(let n of T(t))n.toggleAttribute("data-highlighted",n===e);e?(t.input.setAttribute("aria-activedescendant",e.id),o&&e.scrollIntoView({block:"nearest"})):t.input.removeAttribute("aria-activedescendant")}function dt(t,e){let o=lt(e.trim());for(let n of T(t))n.hidden=!!o&&!lt($(n)).includes(o);for(let n of t.list.querySelectorAll('[role="group"]'))n.hidden=!n.querySelector(".cl-combobox-item:not([hidden])");for(let n of t.list.querySelectorAll(".cl-combobox-separator"))n.hidden=!!o;t.content.toggleAttribute("data-empty",at(t).length===0)}function w(t){E(t)||(B(t.root),dt(t,""),t.content.showPopover(),t.input.setAttribute("aria-expanded","true"),ut(t),y(t,T(t).find(e=>e.getAttribute("aria-selected")==="true")??null))}function L(t){if(!E(t))return;t.content.hidePopover(),t.input.setAttribute("aria-expanded","false"),y(t,null);let e=T(t).find(o=>o.getAttribute("aria-selected")==="true");t.input.value=e?$(e):""}function mt(t,e){for(let n of T(t))n.setAttribute("aria-selected",String(n===e));let o=t.root.querySelector('input[type="hidden"]');o&&(o.value=e.dataset.value??$(e)),L(t),t.input.dispatchEvent(new Event("change",{bubbles:!0}))}function pt(t){let e=g(t);if(!e)return;let o=t.closest(F);if(o&&e.list.contains(o))return mt(e,o);if(t.closest(".cl-combobox-trigger"))return e.input.focus(),E(e)?L(e):w(e);t===e.input&&!e.input.disabled&&w(e)}function ft(t){let e=g(t);!e||t!==e.input||(w(e),dt(e,e.input.value),y(e,null))}function bt(t,e){let o=g(e);if(!o||e!==o.input)return;let n=at(o),r=n.findIndex(i=>i.hasAttribute("data-highlighted")),s=i=>{if(t.preventDefault(),!E(o))return w(o);y(o,n[(i+n.length)%n.length]??null)};switch(t.key){case"ArrowDown":return s(r+1);case"ArrowUp":return s(r<0?-1:r-1);case"Enter":E(o)&&r>=0&&(t.preventDefault(),mt(o,n[r]));return;case"Escape":E(o)&&(t.preventDefault(),L(o));return;case"Tab":return L(o)}}function ht(t){let e=t.closest(F),o=g(e);e&&o&&!e.hasAttribute("data-highlighted")&&y(o,e,!1)}function Et(t,e){e.closest(".cl-combobox-content, .cl-combobox-trigger")&&t.preventDefault()}function gt(t,e){let o=g(e);if(!o||e!==o.input)return;let n=t.relatedTarget;n&&o.root.contains(n)||L(o)}function Tt(){for(let t of document.querySelectorAll(".cl-combobox-content:popover-open")){let e=g(t);e&&ut(e)}}function S(t){let e=document.getElementById(t);e instanceof HTMLDialogElement&&!e.open&&e.showModal()}function vt(t,e){let o=e.closest("[data-dialog-open]");if(o){S(o.dataset.dialogOpen);return}let n=e.closest("[data-dialog-close]");if(n){n.closest("dialog")?.close();return}if(e instanceof HTMLDialogElement&&e.matches(".cl-dialog, .cl-sheet")){let r=e.getBoundingClientRect();t.clientX>=r.left&&t.clientX<=r.right&&t.clientY>=r.top&&t.clientY<=r.bottom||e.close()}}var R=".cl-popover, .cl-menu",xt=10,P='.cl-menu-item:not(:disabled):not([aria-disabled="true"])';function W(t){return t.dataset.anchor&&document.getElementById(t.dataset.anchor)||document.querySelector(`[popovertarget="${CSS.escape(t.id)}"]`)}function z(t,e,o,n){x(t,e,{side:t.dataset.side||o,align:t.dataset.align||(t.matches(".cl-menu")?"start":"center"),offset:n})}var K=!1;function Lt(t){let e=t.target;!(e instanceof HTMLElement)||!e.matches(R)||t.newState==="open"&&(e.style.visibility="hidden",e.dataset.placed=e.dataset.side||"bottom")}function yt(t){let e=t.target;if(!(e instanceof HTMLElement)||!e.matches(R))return;let o=t.newState==="open",n=W(e);if(n?.setAttribute("aria-expanded",String(o)),!!o){if(n&&z(e,n,"bottom",4),e.style.visibility="",e.matches(".cl-menu")){e.hasAttribute("tabindex")||(e.tabIndex=-1);let r=e.querySelector(P);(K&&r?r:e).focus({preventScroll:!0})}K=!1}}function Mt(){for(let t of document.querySelectorAll(`${R}, .cl-tooltip`)){if(!t.matches(":popover-open"))continue;let e=t.matches(".cl-tooltip")?document.querySelector(`[aria-describedby~="${CSS.escape(t.id)}"]`):W(t);e&&z(t,e,t.matches(".cl-tooltip")?"top":"bottom",t.matches(".cl-tooltip")?xt:4)}}function Ht(t,e){if(e.matches("[popovertarget]")&&["Enter"," ","ArrowDown"].includes(t.key)){K=!0,t.key==="ArrowDown"&&(t.preventDefault(),e.click());return}let o=e.closest(".cl-menu");if(!o)return;let n=[...o.querySelectorAll(P)],r=n.indexOf(document.activeElement),s=i=>{t.preventDefault(),n[(i+n.length)%n.length]?.focus()};switch(t.key){case"ArrowDown":return s(r+1);case"ArrowUp":return s(r<0?-1:r-1);case"Home":return s(0);case"End":return s(-1);case"Tab":o.hidePopover();return;default:if(t.key.length===1&&/\S/.test(t.key)){let i=t.key.toLowerCase();[...n.slice(r+1),...n.slice(0,r+1)].find(l=>l.textContent?.trim().toLowerCase().startsWith(i))?.focus()}}}function At(t){let e=t.closest(P);e&&e.closest(".cl-menu")&&document.activeElement!==e&&e.focus({preventScroll:!0})}function wt(t){let e=t.target;e instanceof HTMLElement&&e.matches(".cl-menu")&&e.contains(document.activeElement)&&e.focus({preventScroll:!0})}function St(t){let e=t.closest(P),o=e?.closest(".cl-menu");if(!e||!o)return;let n=e.getAttribute("role");if(n==="menuitemcheckbox")e.setAttribute("aria-checked",String(e.getAttribute("aria-checked")!=="true"));else if(n==="menuitemradio"){let r=e.closest('[role="group"]')??o;for(let s of r.querySelectorAll('[role="menuitemradio"]'))s.setAttribute("aria-checked",String(s===e))}e.hasAttribute("data-keep-open")||(o.hidePopover(),W(o)?.focus())}function Pt(t){let e=t.closest("[aria-describedby]");if(!e)return null;for(let o of e.getAttribute("aria-describedby").split(/\s+/)){let n=document.getElementById(o);if(n?.matches(".cl-tooltip"))return{owner:e,tip:n}}return null}function Vt(t,e){e.matches(":popover-open")||(e.dataset.placed=e.dataset.side||"top",e.showPopover()),z(e,t,"top",xt)}function Ct(t){t.matches(":popover-open")&&t.hidePopover()}function X(t,e){if(t instanceof PointerEvent&&t.pointerType==="touch"||t instanceof FocusEvent&&!e.matches(":focus-visible"))return;let o=Pt(e);o&&Vt(o.owner,o.tip)}function U(t,e){let o=Pt(e);if(!o)return;let n=t.relatedTarget;n&&o.owner.contains(n)||Ct(o.tip)}function kt(){for(let t of document.querySelectorAll(".cl-tooltip:popover-open"))Ct(t)}var It=t=>{let e=t.min===""?0:Number(t.min),o=t.max===""?100:Number(t.max);return{min:e,max:o}};function Y(t){let{min:e,max:o}=It(t),n=o>e?(Number(t.value)-e)/(o-e)*100:0;t.style.setProperty("--cl-slider-fill",`${n}%`)}function Ot(t){t instanceof HTMLInputElement&&t.matches(".cl-slider")&&Y(t)}function G(t=document){t instanceof HTMLInputElement&&t.matches(".cl-slider")&&Y(t);for(let e of t.querySelectorAll("input.cl-slider"))Y(e)}function qt(t){t instanceof HTMLFormElement&&setTimeout(()=>G(t))}function Dt(t,e){let o=t.getBoundingClientRect(),n=Math.min(1,Math.max(0,(e-o.left-12/2)/(o.width-12)));getComputedStyle(t).direction==="rtl"&&(n=1-n);let{min:r,max:s}=It(t),i=t.step==="any"?0:Number(t.step||1),c=r+n*(s-r);i>0&&(c=r+Math.round((c-r)/i)*i);let l=t.value;t.value=String(c),t.value!==l&&t.dispatchEvent(new Event("input",{bubbles:!0}))}function Nt(t,e){if(t.pointerType==="mouse"||!(e instanceof HTMLInputElement)||!e.matches(".cl-slider")||e.disabled)return;let o=e,n=o.value;o.focus({preventScroll:!0});try{o.setPointerCapture(t.pointerId)}catch{}Dt(o,t.clientX);let r=i=>{i.pointerId===t.pointerId&&Dt(o,i.clientX)},s=i=>{i.pointerId===t.pointerId&&(o.removeEventListener("pointermove",r),o.removeEventListener("pointerup",s),o.removeEventListener("pointercancel",s),o.value!==n&&o.dispatchEvent(new Event("change",{bubbles:!0})))};o.addEventListener("pointermove",r),o.addEventListener("pointerup",s),o.addEventListener("pointercancel",s)}function Ft(t){let e=t.closest('[role="tablist"]');if(!(!e||t.matches(":disabled")))for(let o of e.querySelectorAll('[role="tab"]')){let n=o===t;o.setAttribute("aria-selected",String(n)),o.tabIndex=n?0:-1;let r=document.getElementById(o.getAttribute("aria-controls")??"");r&&(r.hidden=!n)}}function $t(t){let e=t.closest('.cl-tabs [role="tab"]');e&&Ft(e)}function Bt(t,e){let o=e.closest('.cl-tabs [role="tab"]'),n=o?.closest('[role="tablist"]');if(!o||!n)return;let r=n.getAttribute("aria-orientation")==="vertical",s=[...n.querySelectorAll('[role="tab"]:not(:disabled)')],i=s.indexOf(o),c=r?{ArrowDown:i+1,ArrowUp:i-1,Home:0,End:s.length-1}:{ArrowRight:i+1,ArrowLeft:i-1,Home:0,End:s.length-1};if(!(t.key in c))return;t.preventDefault();let l=s[(c[t.key]+s.length)%s.length];l.focus(),Ft(l)}function Kt(t=document){for(let e of t.querySelectorAll('.cl-tabs [role="tab"]'))e.tabIndex=e.getAttribute("aria-selected")==="true"?0:-1}var Rt={success:'<circle cx="12" cy="12" r="10"/><path d="m16 9-5.5 5.5L8 12"/>',info:'<circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/>',warning:'<path d="m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3"/><path d="M12 9v4"/><path d="M12 17h.01"/>',error:'<path d="m15 9-6 6"/><path d="M2.586 16.726A2 2 0 0 1 2 15.312V8.688a2 2 0 0 1 .586-1.414l4.688-4.688A2 2 0 0 1 8.688 2h6.624a2 2 0 0 1 1.414.586l4.688 4.688A2 2 0 0 1 22 8.688v6.624a2 2 0 0 1-.586 1.414l-4.688 4.688a2 2 0 0 1-1.414.586H8.688a2 2 0 0 1-1.414-.586z"/><path d="m9 9 6 6"/>',loading:'<path d="M21 12a9 9 0 1 1-6.219-8.56"/>'},jt=t=>`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${t}</svg>`,_t=3,V=14;function Jt(){let t=document.querySelector("ol.cl-toaster");return t||(t=document.createElement("ol"),t.className="cl-toaster",t.setAttribute("aria-label","Notifications"),t.setAttribute("aria-live","polite"),t.addEventListener("pointerenter",()=>{t.dataset.expanded="",k(t)}),t.addEventListener("pointerleave",()=>{delete t.dataset.expanded,k(t)}),document.body.append(t)),t}function k(t){let e=[...t.querySelectorAll(".cl-toast:not([data-removed])")].reverse(),o=t.dataset.expanded!==void 0,n=e[0];t.style.setProperty("--front-height",`${n?Number(n.dataset.height):0}px`);let r=0;e.forEach((s,i)=>{s.toggleAttribute("data-front",i===0),s.toggleAttribute("data-hidden",i>=_t),s.style.zIndex=String(e.length-i);let c=o?-r:-i*V;s.style.setProperty("--y",`${c}px`),s.style.setProperty("--scale",o?"1":String(1-i*.05)),r+=Number(s.dataset.height)+V}),t.style.setProperty("--expanded-height",`${Math.max(0,r-V)}px`)}function C(t){if(t.dataset.removed!==void 0)return;t.dataset.removed="";let e=t.closest(".cl-toaster");e&&k(e),setTimeout(()=>{t.remove(),e&&!e.querySelector(".cl-toast")&&delete e.dataset.expanded},200)}function m(t,e={}){let{description:o,type:n="default",action:r}=e,s=e.duration??(n==="loading"?1/0:4e3),i=document.createElement("li");if(i.className="cl-toast",i.dataset.type=n,i.setAttribute("role",n==="error"?"alert":"status"),Rt[n]){let a=document.createElement("div");a.className="cl-toast-icon",a.innerHTML=jt(Rt[n]),i.append(a)}let c=document.createElement("div");c.className="cl-toast-content";let l=document.createElement("div");if(l.className="cl-toast-title",l.textContent=t,c.append(l),o){let a=document.createElement("div");a.className="cl-toast-description",a.textContent=o,c.append(a)}if(i.append(c),r){let a=document.createElement("button");a.type="button",a.className="cl-toast-action",a.textContent=r.label,a.addEventListener("click",u=>{r.onClick?.(u),C(i)}),i.append(a)}let b=Jt();if(i.toggleAttribute("data-front",!0),b.append(i),i.dataset.height=String(i.offsetHeight),k(b),Number.isFinite(s)){let a=s,u=Date.now(),d=setTimeout(()=>C(i),a);i.addEventListener("pointerenter",()=>{clearTimeout(d),a-=Date.now()-u}),i.addEventListener("pointerleave",()=>{u=Date.now(),d=setTimeout(()=>C(i),Math.max(a,1e3))})}return()=>C(i)}m.success=(t,e)=>m(t,{...e,type:"success"});m.info=(t,e)=>m(t,{...e,type:"info"});m.warning=(t,e)=>m(t,{...e,type:"warning"});m.error=(t,e)=>m(t,{...e,type:"error"});function Wt(t){let e=t.closest("[data-toast]");if(!e)return;let{toast:o,toastDescription:n,toastType:r}=e.dataset;m(o,{description:n,type:r||"default"})}var zt=!1,p=t=>t instanceof Element?t:null;function Qt(){if(zt||typeof document>"u")return;zt=!0,document.addEventListener("click",n=>{let r=p(n.target);r&&(J(n,r),nt(r),pt(r),vt(n,r),St(r),$t(r),Wt(r))}),document.addEventListener("keydown",n=>{let r=p(n.target);n.key==="Escape"&&kt(),r&&(ot(n,r),bt(n,r),Ht(n,r),Bt(n,r))}),document.addEventListener("input",n=>{let r=p(n.target);r&&(ft(r),Ot(r))}),document.addEventListener("reset",n=>{let r=p(n.target);r&&qt(r)}),document.addEventListener("pointerdown",n=>{let r=p(n.target);r&&(it(n,r),Et(n,r),Nt(n,r))}),document.addEventListener("beforetoggle",Lt,!0),document.addEventListener("toggle",yt,!0),document.addEventListener("pointerleave",wt,!0),document.addEventListener("pointermove",n=>{let r=p(n.target);r&&(ht(r),At(r))}),document.addEventListener("pointerover",n=>{let r=p(n.target);r&&X(n,r)}),document.addEventListener("pointerout",n=>{let r=p(n.target);r&&U(n,r)}),document.addEventListener("focusin",n=>{let r=p(n.target);r&&X(n,r)}),document.addEventListener("focusout",n=>{let r=p(n.target);r&&(gt(n,r),U(n,r))});let t=()=>{Mt(),Tt()};window.addEventListener("scroll",t,{capture:!0,passive:!0}),window.addEventListener("resize",t,{passive:!0}),document.addEventListener("scroll",rt,{capture:!0,passive:!0}),window.addEventListener("resize",()=>N(),{passive:!0});let e=n=>{Kt(n),G(n),B(n),N(n)},o=()=>{e(document),new MutationObserver(n=>{for(let r of n)for(let s of r.addedNodes)s instanceof Element&&e(s)}).observe(document.body,{childList:!0,subtree:!0})};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",o):o()}var ge={start:Qt,toast:m,openDialog:S};export{ge as cl,S as openDialog,x as place,Qt as start,m as toast};
|