@ecopages/radiant-ui 0.1.0-rc.7 → 0.1.0

package/dist/components/ui/sidebar/sidebar.css

@@ -138,9 +138,6 @@ rui-sidebar {
     rui-sidebar .rui-sidebar > .rui-sidebar__pane {
       height: 100%;
     }
-    rui-sidebar-trigger {
-      display: none;
-    }
   }
   @media (min-width: 1280px) {
     .rui-sidebar-provider__body {
@@ -570,70 +567,79 @@ rui-sidebar {
   height: var(--spacing-4, var(--space-4));
   flex-shrink: 0;
 }
-.rui-sidebar__trigger[data-sidebar-state='expanded']:not(.rui-sidebar__trigger--inset)
+rui-sidebar-trigger[placement='header'] .rui-sidebar__trigger-glyph--collapse,
+rui-sidebar-trigger:not([placement='header'], [placement='inset'])[data-sidebar-state='expanded']
 	.rui-sidebar__trigger-glyph--collapse,
-.rui-sidebar__trigger--header .rui-sidebar__trigger-glyph--collapse {
-  display: block;
-}
-.rui-sidebar__trigger[data-sidebar-state='collapsed']:not(.rui-sidebar__trigger--header):not(
-		.rui-sidebar__trigger--inset
-	)
-	.rui-sidebar__trigger-glyph--expand {
-  display: block;
-}
-.rui-sidebar__trigger--inset[data-sidebar-state='expanded'] .rui-sidebar__trigger-glyph--close,
-.rui-sidebar__trigger--inset[data-sidebar-state='collapsed'] .rui-sidebar__trigger-glyph--menu {
+rui-sidebar-trigger:not([placement='header'], [placement='inset'])[data-sidebar-state='collapsed']
+	.rui-sidebar__trigger-glyph--expand,
+rui-sidebar-trigger[placement='inset'][data-sidebar-state='expanded'] .rui-sidebar__trigger-glyph--close,
+rui-sidebar-trigger[placement='inset'][data-sidebar-state='collapsed'] .rui-sidebar__trigger-glyph--menu {
   display: block;
 }
-:is(.rui-sidebar-provider:has(> rui-sidebar[data-collapsible='off']:not([data-mobile='true'])),
-.rui-sidebar-provider:has(
-	> .rui-sidebar-provider__body > rui-sidebar[data-collapsible='off']:not([data-mobile='true'])
-)) rui-sidebar-trigger.rui-sidebar-trigger-placement--header, :is(.rui-sidebar-provider:has(> rui-sidebar[data-collapsible='off']:not([data-mobile='true'])),
-.rui-sidebar-provider:has(
-	> .rui-sidebar-provider__body > rui-sidebar[data-collapsible='off']:not([data-mobile='true'])
-)) 
-	rui-sidebar-trigger[data-placement='header'], :is(.rui-sidebar-provider:has(> rui-sidebar[data-collapsible='off']:not([data-mobile='true'])),
-.rui-sidebar-provider:has(
-	> .rui-sidebar-provider__body > rui-sidebar[data-collapsible='off']:not([data-mobile='true'])
-)) 
-	rui-sidebar-trigger.rui-sidebar-trigger-placement--inset, :is(.rui-sidebar-provider:has(> rui-sidebar[data-collapsible='off']:not([data-mobile='true'])),
-.rui-sidebar-provider:has(
-	> .rui-sidebar-provider__body > rui-sidebar[data-collapsible='off']:not([data-mobile='true'])
-)) 
-	rui-sidebar-trigger[data-placement='inset'] {
-  display: none;
-}
-:is(.rui-sidebar-provider:has(> rui-sidebar[data-state='expanded']:not([data-mobile='true'])),
-.rui-sidebar-provider:has(
-	> .rui-sidebar-provider__body > rui-sidebar[data-state='expanded']:not([data-mobile='true'])
-)) rui-sidebar-trigger.rui-sidebar-trigger-placement--inset, :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='expanded']:not([data-mobile='true'])),
-.rui-sidebar-provider:has(
-	> .rui-sidebar-provider__body > rui-sidebar[data-state='expanded']:not([data-mobile='true'])
-)) 
-	rui-sidebar-trigger[data-placement='inset'] {
+rui-sidebar-trigger[data-sidebar-mobile][data-sidebar-state='expanded'][placement='inset'],
+rui-sidebar-trigger[data-sidebar-mobile][data-sidebar-state='collapsed'][placement='header'],
+rui-sidebar-trigger[data-sidebar-mobile='false'][data-sidebar-collapsible='off'] {
   display: none;
 }
-:is(.rui-sidebar-provider:has(> rui-sidebar[data-state='collapsed']:not([data-mobile='true'])),
-.rui-sidebar-provider:has(
-	> .rui-sidebar-provider__body > rui-sidebar[data-state='collapsed']:not([data-mobile='true'])
-)) rui-sidebar-trigger.rui-sidebar-trigger-placement--header, :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='collapsed']:not([data-mobile='true'])),
-.rui-sidebar-provider:has(
-	> .rui-sidebar-provider__body > rui-sidebar[data-state='collapsed']:not([data-mobile='true'])
-)) 
-	rui-sidebar-trigger[data-placement='header'] {
-  display: none;
-}
-:is(.rui-sidebar-provider:has(> rui-sidebar[data-state='expanded'][data-mobile='true']),
-.rui-sidebar-provider:has(> .rui-sidebar-provider__body > rui-sidebar[data-state='expanded'][data-mobile='true'])) rui-sidebar-trigger.rui-sidebar-trigger-placement--inset, :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='expanded'][data-mobile='true']),
-.rui-sidebar-provider:has(> .rui-sidebar-provider__body > rui-sidebar[data-state='expanded'][data-mobile='true'])) 
-	rui-sidebar-trigger[data-placement='inset'] {
-  display: none;
+@media (min-width: 768px) {
+  rui-sidebar[data-collapsible='off'] rui-sidebar-trigger:not([data-sidebar-mobile]),
+	rui-sidebar[data-state='expanded'] rui-sidebar-trigger:not([data-sidebar-mobile])[placement='inset'],
+	rui-sidebar[data-state='collapsed'] rui-sidebar-trigger:not([data-sidebar-mobile])[placement='header'],
+	.rui-sidebar-provider:has(
+			> rui-sidebar:only-of-type[data-collapsible='off'],
+			> .rui-sidebar-provider__body > rui-sidebar:only-of-type[data-collapsible='off']
+		)
+		> :is(.rui-sidebar__inset, .rui-sidebar-provider__site-header)
+		> rui-sidebar-trigger:not([data-sidebar-mobile]),
+	.rui-sidebar-provider:has(
+			> rui-sidebar:only-of-type[data-collapsible='off'],
+			> .rui-sidebar-provider__body > rui-sidebar:only-of-type[data-collapsible='off']
+		)
+		> .rui-sidebar-provider__body
+		> .rui-sidebar__inset
+		> rui-sidebar-trigger:not([data-sidebar-mobile]),
+	.rui-sidebar-provider:has(
+			> rui-sidebar:only-of-type[data-state='expanded'],
+			> .rui-sidebar-provider__body > rui-sidebar:only-of-type[data-state='expanded']
+		)
+		> :is(.rui-sidebar__inset, .rui-sidebar-provider__site-header)
+		> rui-sidebar-trigger:not([data-sidebar-mobile])[placement='inset'],
+	.rui-sidebar-provider:has(
+			> rui-sidebar:only-of-type[data-state='expanded'],
+			> .rui-sidebar-provider__body > rui-sidebar:only-of-type[data-state='expanded']
+		)
+		> .rui-sidebar-provider__body
+		> .rui-sidebar__inset
+		> rui-sidebar-trigger:not([data-sidebar-mobile])[placement='inset'],
+	.rui-sidebar-provider:has(
+			> rui-sidebar:only-of-type[data-state='collapsed'],
+			> .rui-sidebar-provider__body > rui-sidebar:only-of-type[data-state='collapsed']
+		)
+		> :is(.rui-sidebar__inset, .rui-sidebar-provider__site-header)
+		> rui-sidebar-trigger:not([data-sidebar-mobile])[placement='header'],
+	.rui-sidebar-provider:has(
+			> rui-sidebar:only-of-type[data-state='collapsed'],
+			> .rui-sidebar-provider__body > rui-sidebar:only-of-type[data-state='collapsed']
+		)
+		> .rui-sidebar-provider__body
+		> .rui-sidebar__inset
+		> rui-sidebar-trigger:not([data-sidebar-mobile])[placement='header'] {
+    display: none;
+  }
 }
-:is(.rui-sidebar-provider:has(> rui-sidebar[data-state='collapsed'][data-mobile='true']),
-.rui-sidebar-provider:has(> .rui-sidebar-provider__body > rui-sidebar[data-state='collapsed'][data-mobile='true'])) rui-sidebar-trigger.rui-sidebar-trigger-placement--header, :is(.rui-sidebar-provider:has(> rui-sidebar[data-state='collapsed'][data-mobile='true']),
-.rui-sidebar-provider:has(> .rui-sidebar-provider__body > rui-sidebar[data-state='collapsed'][data-mobile='true'])) 
-	rui-sidebar-trigger[data-placement='header'] {
-  display: none;
+@media (max-width: 767px) {
+  rui-sidebar-trigger:not([data-sidebar-mobile])[placement='header'] {
+    display: none;
+  }
+  rui-sidebar:not([data-mobile='true']) .rui-sidebar__pane {
+    pointer-events: none;
+    width: 0px;
+    min-width: 0px;
+    overflow: hidden;
+    opacity: 0%;
+    width: 0;
+    flex: 0 0 auto;
+  }
 }
 .rui-sidebar[data-mobile='true'] {
   position: fixed;

package/dist/components/ui/sidebar/sidebar.d.ts

@@ -1,8 +1,8 @@
 import { type JsxCustomElementAttributes, type JsxElementProps, type JsxRenderable } from '@ecopages/jsx';
 import type { RuiSidebar as RuiSidebarElement, RuiSidebarProps } from './sidebar.script';
 import './sidebar.script';
-import type { RuiSidebarTrigger as RuiSidebarTriggerElement, RuiSidebarTriggerProps } from './sidebar-trigger.script';
 import './sidebar-trigger.script';
+export { RuiSidebarTrigger, type RuiSidebarTriggerViewProps } from './sidebar-trigger';
 export type RuiSidebarProviderProps = JsxElementProps<HTMLDivElement> & {
     /**
      * Layout context. `default` is the standard shell; `full` removes chrome;
@@ -125,6 +125,8 @@ export type RuiSidebarMenuButtonProps = RuiSidebarMenuButtonControlProps | RuiSi
  * collapses to icon mode, only this element remains visible; it must keep an
  * accessible name via `tooltip` or visible children.
  *
+ * Stamps `[data-ref="menu-button"]`.
+ *
  * @cssclass rui-sidebar__menu-button - Clickable menu surface (`<a>`/`<button>`).
  * @cssclass rui-sidebar__menu-button--active - Current-page marker (`aria-current="page"`).
  */
@@ -143,7 +145,10 @@ export declare function RuiSidebarInset({ children, class: className, ...props }
 export type RuiSidebarViewProps = JsxCustomElementAttributes<RuiSidebarElement, RuiSidebarProps & {
     id: string;
 }>;
+/**
+ * Sidebar view. Stamps `[data-ref="root"]`, `[data-ref="pane"]`, optional
+ * `[data-ref="scrim"]` and `[data-ref="handle"]`.
+ *
+ * @cssclass rui-sidebar - Pane surface.
+ */
 export declare function RuiSidebar({ children, open, label, ...props }: RuiSidebarViewProps): JsxRenderable;
-export type RuiSidebarTriggerViewProps = JsxCustomElementAttributes<RuiSidebarTriggerElement, RuiSidebarTriggerProps>;
-export declare function RuiSidebarTrigger({ children, class: className, triggerLabel, placement, variant, size, ...props }: RuiSidebarTriggerViewProps): JsxRenderable;
-export {};

package/dist/components/ui/sidebar/sidebar.script.d.ts

@@ -64,28 +64,45 @@ export type RuiSidebarResizeDetail = {
 /**
  * `<rui-sidebar>` — a resizable, collapsible side panel.
  *
- * The sidebar hosts pane content in the view-owned light-DOM shell. When the
- * parent supplies a `RuiSidebarRail` element (or the `collapsible` mode is not
- * `off`), the sidebar manages open/closed state, a focusable resize handle,
- * and keyboard navigation that follows the APG Window Splitter pattern.
+ * The custom element is a behavior host: it does not render pane content.
+ * Import the script and place light-DOM children that match the contract below,
+ * or use the `RuiSidebar*` view helpers which stamp the same targets.
  *
  * When `collapsible="off"` (the default), the pane stays open and exposes
  * a draggable resize handle. When `collapsible="icon"`, the pane collapses
  * to a narrow rail. When `collapsible="full"`, the pane is hidden until
  * toggled, and shown as an overlay drawer below the mobile breakpoint.
  *
- * The host reflects `data-state`, `data-collapsible`, `data-variant`,
- * `data-side`, and `data-mobile` so the stylesheet can drive every visual
- * mode without imperative JS.
+ * ## Light-DOM contract
  *
- * @see https://www.w3.org/WAI/ARIA/apg/patterns/windowsplitter/
+ * Required:
+ * - `[data-ref="root"]` — inner shell. Host mirrors `data-state`, `data-collapsible`,
+ *   `data-variant`, `data-side`, and `data-mobile` on the shell and the host.
+ * - `[data-ref="pane"]` — pane landmark. Host sets `aria-label`, `inert`, and
+ *   `data-side` / `data-variant`.
+ *
+ * Optional:
+ * - `[data-ref="scrim"]` — mobile overlay dismiss control. Host toggles `hidden`.
+ * - `[data-ref="handle"]` — resize handle (`role="separator"`). Host toggles `hidden`
+ *   and sets `aria-orientation`, `aria-valuenow` / `min` / `max`, and `aria-label`.
+ * - `[data-ref="menu-button"]` — menu links. When `matchActive` is set, host
+ *   toggles `rui-sidebar__menu-button--active` and `aria-current="page"`.
+ *
+ * Host-owned on `<rui-sidebar>`: `role="complementary"`, `aria-label`, `data-state`,
+ * `data-collapsible`, `data-variant`, `data-side`, `data-mobile`, `data-pane-width`.
+ *
+ * Do not set `inert` on the pane or `aria-expanded` on the handle — the host owns those.
+ *
+ * Nested hosts: none. `rui-sidebar-trigger` controls this host via `toggle()`.
  *
+ * @see https://www.w3.org/WAI/ARIA/apg/patterns/windowsplitter/
  * @element rui-sidebar
- * @fires rui-sidebar-toggle - Emitted on every open/closed transition.
- *        `detail` is `{ open, state }`.
- * @fires rui-sidebar-resize - Emitted on every width change. `detail` is `{ width }`.
- * @fires rui-sidebar-mobile-change - Emitted when the host flips between
- *        mobile drawer mode and inline mode. `detail` is `{ mobile: boolean }`.
+ * @fires rui-sidebar-toggle - Emitted on every open/closed transition; `detail` is `{ open, state }`.
+ * @fires rui-sidebar-resize - Emitted on every width change; `detail` is `{ width }`.
+ * @fires rui-sidebar-mobile-change - Emitted when the host flips between mobile drawer and inline mode; `detail` is `{ mobile: boolean }`.
+ *
+ * @remarks
+ * Public methods: `toggle()`, `syncActiveLinks()`. BEM classes live on the view helpers.
  */
 export declare class RuiSidebar extends RadiantElement {
     variant: RuiSidebarVariant;
@@ -121,7 +138,7 @@ export declare class RuiSidebar extends RadiantElement {
     private dragStartCoord;
     private dragStartSize;
     private navigationCleanups;
-    /** @remarks Remains `false` until a projected active link has been scrolled. */
+    /** @remarks Set by the first update cycle so later cycles never scroll. */
     private didScrollActiveOnMount;
     /**
      * @remarks Captured once before defaults are applied. `setOpen` later assigns
@@ -134,22 +151,27 @@ export declare class RuiSidebar extends RadiantElement {
      * `mobileBreakpoint` before that microtask.
      */
     private mobileReady;
+    /**
+     * @remarks Skip `syncPresentation` here — it runs in `onConnected` after
+     * viewport and uncontrolled `open` defaults apply. An early sync used
+     * `defaultOpen` while `isMobile` was still false, which flashed the mobile
+     * drawer on docs-style layouts before the connect microtask closed it.
+     */
     connectedCallback(): void;
     protected onConnected(): void;
     /**
-     * @remarks Light-DOM hydrate/update can recreate menu links after the connect
-     * microtask sync. Re-apply active classes once the render commits.
+     * @remarks Re-renders that recreate menu links need their active classes
+     * back. The first cycle ends after `onConnected()`, so it covers the
+     * initial sync and `scrollActiveOnMount`.
      */
-    hydrate(): void;
-    update(): void;
-    requestUpdate(): void;
+    protected updated(changed: ReadonlySet<string>): void;
     disconnectedCallback(): void;
-    private syncActiveLinksAfterRender;
     /**
      * Keep host and inner shell `data-*` in sync. Host attrs drive
      * `:has(> rui-sidebar[...])`; inner `.rui-sidebar` drives visual styles.
      */
     private syncPresentation;
+    private syncHandlePresentation;
     private isOpen;
     /**
      * Optional `Number` props initialize to `0` when no attribute/default is set

package/dist/components/ui/slider/index.js

@@ -1,2 +1,2 @@
-import{RadiantElement as be,customElement as Me,event as Ie,onEvent as k,onUpdated as we,prop as d,query as V}from"@ecopages/radiant";function Te(e){if(!Number.isFinite(e)||e<=0)return 0;let t=e.toString().match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);if(!t)return 0;let r=t[1]?.length??0,i=t[2]?Number(t[2]):0;return Math.min(15,Math.max(0,r-i))}function lt(e,t){return typeof t=="number"&&Number.isFinite(t)&&t>=0?Math.min(15,Math.round(t)):Te(e)}function ot(e,t){return Number.isFinite(e)?e.toFixed(t):""}function ht(e,t,r){let i=Number.isFinite(e)?e:0,n=Number.isFinite(t)?t:100,a=Math.min(i,n),u=Math.max(i,n),s=Number.isFinite(r)&&r>0?r:1,m=u-a,v=g=>{let M=Number.isFinite(g)?g:a,I=a+Math.round((M-a)/s)*s;return Math.min(u,Math.max(a,I))};return{lowerBound:a,upperBound:u,step:s,clamp:v,ratioFor:g=>m===0?0:(v(g)-a)/m,valueFromRatio:g=>{let M=Math.min(1,Math.max(0,Number.isFinite(g)?g:0));return v(a+M*m)}}}function mt(e,t,r){switch(r){case"ArrowRight":case"ArrowUp":return e.clamp(t+e.step);case"ArrowLeft":case"ArrowDown":return e.clamp(t-e.step);case"Home":return e.lowerBound;case"End":return e.upperBound;case"PageUp":return e.clamp(t+e.step*10);case"PageDown":return e.clamp(t-e.step*10);default:return}}var ct,dt,gt,bt,ft,pt,_t,Tt,vt,xt,yt,Vt,Mt,It,wt,Pt,Rt,St,At,Et,Dt,Ct,kt,Ft,Lt,jt,Ot,Bt,Nt,Ut,$t,zt,Gt,Kt,Xt,qt,Yt,Jt,Qt,Wt,Zt,Ht,te,ee,ie,re,ae,ne,se,ue,le,oe,he,me,ce,de;function ve(e,t,r,i,n,a){var u,s,m,v,g,M,I,F=Symbol.metadata||Symbol.for("Symbol.metadata"),J=Object.defineProperty,U=Object.create,Q=[U(null),U(null)],W=t.length;function L(l,x,_){return function(o,h){x&&(h=o,o=e);for(var y=0;y<l.length;y++)h=l[y].apply(o,_?[h]:[]);return _?h:o}}function R(l,x,_,o){if(typeof l!="function"&&(o||l!==void 0))throw new TypeError(x+" must "+(_||"be")+" a function"+(o?"":" or undefined"));return l}function Z(l,x,_,o,h,y,A,T,w,P,tt){function $(b){if(!tt(b))throw new TypeError("Attempted to access private element on non-instance")}var z=[].concat(x[0]),et=x[3],G=!A,D=h===1,it=h===3,rt=h===4,j=h===2;function O(b,E,st){return function(N,ut){return E&&(ut=N,N=l),st&&st(N),c[b].call(N,ut)}}if(!G){var c={},K=[],S=it?"get":rt||D?"set":"value";if(w?(P||D?c={get:ge(function(){return et(this)},o,"get"),set:function(b){x[4](this,b)}}:c[S]=et,P||ge(c[S],o,j?"":S)):P||(c=Object.getOwnPropertyDescriptor(l,o)),!P&&!w){if((s=Q[+T][o])&&(s^h)!==7)throw Error("Decorating two elements with the same name ("+c[S].name+") is not supported yet");Q[+T][o]=h<3?1:h}}for(var f=l,B=z.length-1;B>=0;B-=_?2:1){var at=R(z[B],"A decorator","be",!0),nt=_?z[B-1]:void 0,X={},C={kind:["field","accessor","method","getter","setter","class"][h],name:o,metadata:u,addInitializer:function(b,E){if(b.v)throw new TypeError("attempted to call addInitializer after decoration was finished");R(E,"An initializer","be",!0),y.push(E)}.bind(null,X)};if(G)s=at.call(nt,f,C),X.v=1,R(s,"class decorators","return")&&(f=s);else if(C.static=T,C.private=w,s=C.access={has:w?tt.bind():function(b){return o in b}},rt||(s.get=w?j?function(b){return $(b),c.value}:O("get",0,$):function(b){return b[o]}),j||it||(s.set=w?O("set",0,$):function(b,E){b[o]=E}),f=at.call(nt,D?{get:c.get,set:c.set}:c[S],C),X.v=1,D){if(typeof f=="object"&&f)(s=R(f.get,"accessor.get"))&&(c.get=s),(s=R(f.set,"accessor.set"))&&(c.set=s),(s=R(f.init,"accessor.init"))&&K.unshift(s);else if(f!==void 0)throw new TypeError("accessor decorators must return an object with get, set, or init properties or undefined")}else R(f,(P?"field":"method")+" decorators","return")&&(P?K.unshift(f):c[S]=f)}return h<2&&A.push(L(K,T,1),L(y,T,0)),P||G||(w?D?A.splice(-1,0,O("get",T),O("set",T)):A.push(j?c[S]:R.call.bind(c[S])):J(l,o,c)),f}function H(l){return J(l,F,{configurable:!0,enumerable:!0,value:u})}return a!==void 0&&(u=a[F]),u=U(u??null),g=[],M=function(l){l&&g.push(L(l))},I=function(l,x){for(var _=0;_<r.length;_++){var o=r[_],h=o[1],y=7&h;if((8&h)==l&&!y==x){var A=o[2],T=!!o[3],w=16&h;Z(l?e:e.prototype,o,w,T?"#"+A:xe(A),y,y<2?[]:l?v=v||[]:m=m||[],g,!!l,T,x,l&&T?function(P){return Ve(P)===e}:n)}}},I(8,0),I(0,0),I(8,1),I(0,1),M(m),M(v),s=g,W||H(e),{e:s,get c(){var l=[];return W&&[H(e=Z(e,[t],i,e.name,5,l)),L(l,1)]}}}function xe(e){var t=ye(e,"string");return typeof t=="symbol"?t:t+""}function ye(e,t){if(typeof e!="object"||!e)return e;var r=e[Symbol.toPrimitive];if(r!==void 0){var i=r.call(e,t||"default");if(typeof i!="object")return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return(t==="string"?String:Number)(e)}function ge(e,t,r){typeof t=="symbol"&&(t=(t=t.description)?"["+t+"]":"");try{Object.defineProperty(e,"name",{configurable:!0,value:r?r+" "+t:t})}catch{}return e}function Ve(e){if(Object(e)!==e)throw TypeError("right-hand side of 'in' should be an object, got "+(e!==null?typeof e:"null"));return e}var pe,fe=class extends be{static{({e:[gt,bt,ft,pt,_t,Tt,vt,xt,yt,Vt,Mt,It,wt,Pt,Rt,St,At,Et,Dt,Ct,kt,Ft,Lt,jt,Ot,Bt,Nt,Ut,$t,zt,Gt,Kt,Xt,qt,Yt,Jt,Qt,Wt,Zt,Ht,te,ee,ie,re,ae,ne,se,ue,le,oe,he,me,ce,de,ct],c:[pe,dt]}=ve(this,[Me("rui-slider")],[[d({type:String,defaultValue:"single"}),0,"variant"],[d({type:String,defaultValue:"horizontal"}),0,"orientation"],[d({type:Number,reflect:!0,defaultValue:50}),0,"value"],[d({type:Number,reflect:!0,attribute:"range-min",defaultValue:25}),0,"rangeMin"],[d({type:Number,reflect:!0,attribute:"range-max",defaultValue:75}),0,"rangeMax"],[d({type:Number,defaultValue:0}),0,"min"],[d({type:Number,defaultValue:100}),0,"max"],[d({type:Number,defaultValue:1}),0,"step"],[d({type:Number,attribute:"value-precision",defaultValue:Number.NaN}),0,"valuePrecision"],[d({type:Number,defaultValue:0}),0,"minDistance"],[d({type:Boolean,reflect:!0,defaultValue:!1}),0,"disabled"],[d({type:Boolean,attribute:"read-only",reflect:!0,defaultValue:!1}),0,"readOnly"],[d({type:String,defaultValue:""}),0,"label"],[d({type:String,defaultValue:""}),0,"name"],[d({type:Boolean,attribute:"show-value",defaultValue:!1}),0,"showValue"],[d({type:Boolean,attribute:"value-title",defaultValue:!1}),0,"valueTitle"],[Ie({name:"rui-change",bubbles:!0,composed:!0}),0,"changeEvent"],[V({ref:"input"}),0,"inputTarget"],[V({ref:"maxInput"}),0,"maxInputTarget"],[V({ref:"root"}),0,"rootTarget"],[V({ref:"header"}),0,"headerTarget"],[V({ref:"label"}),0,"labelTarget"],[V({ref:"rangeTrack"}),0,"rangeTrack"],[V({ref:"value"}),0,"valueTarget"],[V({ref:"singleThumb"}),0,"singleThumb"],[V({ref:"rangeMinThumb"}),0,"rangeMinThumb"],[V({ref:"rangeMaxThumb"}),0,"rangeMaxThumb"],[we(["value","rangeMin","rangeMax","min","max","step","valuePrecision","minDistance","variant","orientation","disabled","readOnly","label","name","showValue","valueTitle"]),2,"onPropsUpdated"],[k({ref:"rangeTrack",type:"pointerdown"}),2,"onPointerDown"],[k({document:!0,type:"pointermove"}),2,"onPointerMove"],[k({document:!0,type:"pointerup"}),2,"onPointerUp"],[k({document:!0,type:"pointercancel"}),2,"onPointerCancel"],[k({selector:"[data-thumb]",type:"keydown"}),2,"onThumbKeydown"]],0,void 0,be))}variant=(ct(this),gt(this));orientation=(bt(this),ft(this));value=(pt(this),_t(this));rangeMin=(Tt(this),vt(this));rangeMax=(xt(this),yt(this));min=(Vt(this),Mt(this));max=(It(this),wt(this));step=(Pt(this),Rt(this));valuePrecision=(St(this),At(this));minDistance=(Et(this),Dt(this));disabled=(Ct(this),kt(this));readOnly=(Ft(this),Lt(this));label=(jt(this),Ot(this));name=(Bt(this),Nt(this));showValue=(Ut(this),$t(this));valueTitle=(zt(this),Gt(this));changeEvent=(Kt(this),Xt(this));inputTarget=(qt(this),Yt(this));maxInputTarget=(Jt(this),Qt(this));rootTarget=(Wt(this),Zt(this));headerTarget=(Ht(this),te(this));labelTarget=(ee(this),ie(this));rangeTrack=(re(this),ae(this));valueTarget=(ne(this),se(this));singleThumb=(ue(this),le(this));rangeMinThumb=(oe(this),he(this));rangeMaxThumb=(me(this),ce(this));activeThumb=(de(this),null);activePointerId=null;pending=null;lastEmitted="";onConnected(){this.syncChrome(),this.syncValues(this.committedValues())}onPropsUpdated(){this.activeThumb||(this.syncChrome(),this.syncValues(this.committedValues()))}get isRange(){return this.variant==="range"}get isVertical(){return this.orientation==="vertical"}get numericRange(){return ht(this.min,this.max,this.step)}get resolvedValuePrecision(){return lt(this.step,this.valuePrecision)}formatValue(t){return ot(t,this.resolvedValuePrecision)}formatValues(t){return t.length===2?`${this.formatValue(t[0])} \u2013 ${this.formatValue(t[1])}`:this.formatValue(t[0])}get defaultValueTarget(){return this.querySelector("[data-default-value]")}thumbFor(t){return t==="value"?this.singleThumb:t==="min"?this.rangeMinThumb:this.rangeMaxThumb}parseThumb(t){return this.isRange?t==="min"||t==="max"?t:null:t==="value"?t:null}constrainPair(t,r,i){let n=this.numericRange,a=n.clamp(t),u=n.clamp(r);a>u&&([a,u]=[u,a]);let s=Math.max(0,this.minDistance);return u-a<s&&(i==="min"?a=n.clamp(u-s):u=n.clamp(a+s)),[a,u]}committedValues(){return this.isRange?this.constrainPair(this.rangeMin,this.rangeMax):[this.numericRange.clamp(this.value)]}liveValues(){return this.pending??this.committedValues()}changeDetail(t){return t.length===2?{values:[t[0],t[1]]}:{value:t[0]}}emitIfChanged(t){let r=t.join(",");r!==this.lastEmitted&&(this.lastEmitted=r,this.changeEvent.emit(this.changeDetail(t)))}reflectValues(t){if(t.length===2){this.rangeMin!==t[0]&&(this.rangeMin=t[0]),this.rangeMax!==t[1]&&(this.rangeMax=t[1]);return}this.value!==t[0]&&(this.value=t[0])}syncValues(t){this.paint(t),this.reflectValues(t)}syncChrome(){this.syncRootChrome(),this.syncThumbChrome()}syncRootChrome(){let t=!!this.valueTarget&&(!this.defaultValueTarget||this.showValue);this.rootTarget?.classList.toggle("rui-slider--single",!this.isRange),this.rootTarget?.classList.toggle("rui-slider--range",this.isRange),this.rootTarget?.classList.toggle("rui-slider--vertical",this.isVertical),this.labelTarget?.toggleAttribute("hidden",!this.label),this.labelTarget&&(this.labelTarget.textContent=this.label),this.defaultValueTarget?.toggleAttribute("hidden",!this.showValue),this.headerTarget?.toggleAttribute("hidden",!this.label&&!t)}syncThumbChrome(){let t=this.disabled?-1:0,r=this.isVertical?"vertical":"horizontal",i=this.numericRange;for(let{id:n,label:a,visible:u}of this.getThumbChrome()){let s=this.thumbFor(n);s&&(s.toggleAttribute("hidden",!u),s.toggleAttribute("disabled",this.disabled||!u),s.setAttribute("tabindex",String(u?t:-1)),s.setAttribute("aria-label",a),s.setAttribute("aria-orientation",r),s.setAttribute("aria-valuemin",String(i.lowerBound)),s.setAttribute("aria-valuemax",String(i.upperBound)),s.setAttribute("aria-readonly",String(this.readOnly)))}}getThumbChrome(){let t=this.isRange;return[{id:"value",label:this.label||"Value",visible:!t},{id:"min",label:this.label?`${this.label} minimum`:"Minimum value",visible:t},{id:"max",label:this.label?`${this.label} maximum`:"Maximum value",visible:t}]}paint(t){let r=this.numericRange,i=t[0],n=t.length===2?t[1]:t[0],a=`${r.ratioFor(i)*100}%`,u=`${r.ratioFor(n)*100}%`,s=`${(r.ratioFor(n)-r.ratioFor(i))*100}%`,m=this.rangeTrack;m?.style.setProperty("--rui-slider-fill-start",t.length===2?a:"0%"),m?.style.setProperty("--rui-slider-fill-size",t.length===2?s:u),m?.style.setProperty("--rui-slider-value",a),m?.style.setProperty("--rui-slider-min",a),m?.style.setProperty("--rui-slider-max",u),this.singleThumb&&(this.singleThumb.setAttribute("aria-valuenow",String(i)),this.singleThumb.setAttribute("aria-valuetext",this.formatValue(i))),this.rangeMinThumb&&(this.rangeMinThumb.setAttribute("aria-valuenow",String(i)),this.rangeMinThumb.setAttribute("aria-valuetext",this.formatValue(i)),this.rangeMinThumb.setAttribute("aria-valuemax",String(n))),this.rangeMaxThumb&&(this.rangeMaxThumb.setAttribute("aria-valuemin",String(i)),this.rangeMaxThumb.setAttribute("aria-valuenow",String(n)),this.rangeMaxThumb.setAttribute("aria-valuetext",this.formatValue(n))),this.valueTarget&&(this.valueTarget.textContent=this.formatValues(t)),this.syncInputs(t),this.syncValueTitle(t)}syncInputs(t){if(this.inputTarget&&(this.inputTarget.disabled=this.disabled,this.inputTarget.readOnly=this.readOnly,this.inputTarget.value=String(t[0]),this.name?this.inputTarget.name=this.name:this.inputTarget.removeAttribute("name")),!!this.maxInputTarget){if(this.maxInputTarget.disabled=this.disabled,this.maxInputTarget.readOnly=this.readOnly,t.length===2){this.maxInputTarget.value=String(t[1]),this.name?this.maxInputTarget.name=`${this.name}-max`:this.maxInputTarget.removeAttribute("name");return}this.maxInputTarget.value="",this.maxInputTarget.removeAttribute("name")}}syncValueTitle(t){let r=[[this.inputTarget,"input"],[this.maxInputTarget,"maxInput"],[this.rangeTrack,"track"],[this.singleThumb,"value"],[this.rangeMinThumb,"min"],[this.rangeMaxThumb,"max"]],i=this.getValueTitles(t);for(let[n,a]of r){let u=i[a];u?n?.setAttribute("title",u):n?.removeAttribute("title")}}getValueTitles(t){if(!this.valueTitle)return{};if(t.length===1){let n=this.formatValue(t[0]);return{input:n,value:n}}let[r,i]=t;return{input:this.formatValue(r),maxInput:this.formatValue(i),min:this.formatValue(r),max:this.formatValue(i),track:this.formatValues(t)}}valueFromPointer(t){let r=this.rangeTrack;if(!r)return this.numericRange.lowerBound;let i=r.getBoundingClientRect();if(i.width===0||i.height===0)return this.numericRange.lowerBound;let n=this.isVertical?1-(t.clientY-i.top)/i.height:(t.clientX-i.left)/i.width;return this.numericRange.valueFromRatio(n)}nearestThumb(t){if(!this.isRange)return"value";let[r,i]=this.liveValues();return Math.abs(t-r)<=Math.abs(t-i)?"min":"max"}moveThumb(t,r){if(this.activeThumb=t,this.isRange){let n=this.pending??this.committedValues();this.pending=this.constrainPair(t==="min"?r:n[0],t==="max"?r:n[1],t)}else this.pending=[this.numericRange.clamp(r)];let i=this.pending;return this.paint(i),this.emitIfChanged(i),i}commit(){let t=this.liveValues();this.pending=null,this.activeThumb=null,this.activePointerId=null,this.syncValues(t)}revert(){this.pending=null,this.activeThumb=null,this.activePointerId=null,this.lastEmitted=this.committedValues().join(","),this.paint(this.committedValues())}releasePointer(t){let r=this.rangeTrack;r?.hasPointerCapture(t.pointerId)&&r.releasePointerCapture(t.pointerId)}onPointerDown(t){if(t.button!==0||this.disabled||this.readOnly)return;let r=t.target.closest("[data-thumb]"),i=this.parseThumb(r?.getAttribute("data-thumb")??null),n=this.valueFromPointer(t),a=i??this.nearestThumb(n);this.pending=this.committedValues(),this.lastEmitted=this.pending.join(","),this.activeThumb=a,this.activePointerId=t.pointerId,this.rangeTrack?.setPointerCapture(t.pointerId),this.thumbFor(a)?.focus(),i||this.moveThumb(a,n),t.preventDefault()}onPointerMove(t){!this.activeThumb||t.pointerId!==this.activePointerId||this.moveThumb(this.activeThumb,this.valueFromPointer(t))}onPointerUp(t){!this.activeThumb||t.pointerId!==this.activePointerId||(this.releasePointer(t),this.commit())}onPointerCancel(t){!this.activeThumb||t.pointerId!==this.activePointerId||(this.releasePointer(t),this.revert())}onThumbKeydown(t){if(this.disabled||this.readOnly)return;let r=t.target.closest("[data-thumb]"),i=this.parseThumb(r?.getAttribute("data-thumb")??null);if(!i)return;let n=this.committedValues(),a=i==="max"?n[n.length-1]:n[0],u=mt(this.numericRange,a,t.key);u!=null&&(t.preventDefault(),this.lastEmitted=n.join(","),this.moveThumb(i,u),this.commit())}static{dt()}};import{jsx as p,jsxs as Y}from"@ecopages/jsx/jsx-runtime";function q(...e){return e.filter(Boolean).join(" ")}function _e({children:e,class:t,...r}){return p("span",{...r,class:q("rui-slider__value",t),"data-ref":"value","aria-hidden":"true",children:e})}function Pe({disabled:e,min:t,max:r,label:i,variant:n}){let a=n!=="range";return p("div",{class:"rui-slider__range",children:Y("div",{class:"rui-slider__range-track","data-ref":"rangeTrack",children:[p("div",{class:"rui-slider__range-fill","data-ref":"rangeFill"}),p("button",{type:"button",class:"rui-slider__thumb","data-ref":"singleThumb","data-thumb":"value",role:"slider",tabindex:e||!a?-1:0,"aria-label":i||"Value","aria-valuemin":t,"aria-valuemax":r,disabled:e||!a,hidden:!a}),p("button",{type:"button",class:"rui-slider__thumb","data-ref":"rangeMinThumb","data-thumb":"min",role:"slider",tabindex:e||a?-1:0,"aria-label":i?`${i} minimum`:"Minimum value","aria-valuemin":t,"aria-valuemax":r,disabled:e||a,hidden:a}),p("button",{type:"button",class:"rui-slider__thumb","data-ref":"rangeMaxThumb","data-thumb":"max",role:"slider",tabindex:e||a?-1:0,"aria-label":i?`${i} maximum`:"Maximum value","aria-valuemin":t,"aria-valuemax":r,disabled:e||a,hidden:a})]})})}function Re({values:e,variant:t="single",orientation:r="horizontal",label:i,showValue:n=!1,valueTitle:a=!1,disabled:u,name:s,min:m,max:v,children:g,...M}){let I=g??p(_e,{"data-default-value":!0,hidden:!n}),F=!!g||n;return p("rui-slider",{...M,variant:t,orientation:r,label:i,showValue:n,valueTitle:a,disabled:u,name:s,min:m,max:v,rangeMin:e?.[0],rangeMax:e?.[1],children:Y("div",{class:q("rui-slider",t==="range"?"rui-slider--range":"rui-slider--single",r==="vertical"&&"rui-slider--vertical"),"data-ref":"root",children:[Y("div",{class:"rui-slider__header","data-ref":"header",hidden:!i&&!F,children:[p("span",{class:"rui-slider__label","data-ref":"label",hidden:!i,children:i}),I]}),p(Pe,{disabled:u,min:m,max:v,label:i,variant:t}),p("input",{type:"hidden","data-ref":"input",name:s||void 0}),p("input",{type:"hidden","data-ref":"maxInput"})]})})}export{Re as RuiSlider,pe as RuiSliderElement,_e as RuiSliderValue};
+import{bindTo as le,customElement as Me,event as we,onEvent as C,onUpdated as Pe,prop as T,query as D}from"@ecopages/radiant";import{FormAssociatedElement as he}from"@ecopages/radiant/form-associated-element";function ft(e){return e?e.split(",").map(t=>Number(t.trim())).filter(t=>Number.isFinite(t)):[]}function Te(e){return e.join(",")}var gt={fromAttribute:e=>ft(e),toAttribute:e=>e.length>0?Te(e):null,fromProperty:e=>Array.isArray(e)?e.map(Number).filter(t=>Number.isFinite(t)):typeof e=="number"&&Number.isFinite(e)?[e]:typeof e=="string"?ft(e):[]};function xe(e){if(!Number.isFinite(e)||e<=0)return 0;let t=e.toString().match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);if(!t)return 0;let i=t[1]?.length??0,r=t[2]?Number(t[2]):0;return Math.min(15,Math.max(0,i-r))}function K(e,t){return typeof t=="number"&&Number.isFinite(t)&&t>=0?Math.min(15,Math.round(t)):xe(e)}function E(e,t){return Number.isFinite(e)?e.toFixed(t):""}function bt(e,t,i){if(Object.is(e,t))return!0;if(!Number.isFinite(e)||!Number.isFinite(t))return!1;let r=Number.isFinite(i)&&i>0?i:1,a=Number.EPSILON*Math.max(Math.abs(e),Math.abs(t),r)*4;return Math.abs(e-t)<=Math.min(a,r*1e-6)}function q(e,t,i){let r=Number.isFinite(e)?e:0,a=Number.isFinite(t)?t:100,n=Math.min(r,a),u=Math.max(r,a),s=Number.isFinite(i)&&i>0?i:1,h=u-n,v=c=>{let g=Number.isFinite(c)?c:n,_=n+Math.round((g-n)/s)*s;return Math.min(u,Math.max(n,_))};return{lowerBound:n,upperBound:u,step:s,clamp:v,ratioFor:c=>h===0?0:(v(c)-n)/h,valueFromRatio:c=>{let g=Math.min(1,Math.max(0,Number.isFinite(c)?c:0));return v(n+g*h)}}}function pt(e,t,i){switch(i){case"ArrowRight":case"ArrowUp":return e.clamp(t+e.step);case"ArrowLeft":case"ArrowDown":return e.clamp(t-e.step);case"Home":return e.lowerBound;case"End":return e.upperBound;case"PageUp":return e.clamp(t+e.step*10);case"PageDown":return e.clamp(t-e.step*10);default:return}}var vt,_t,Tt,xt,yt,Vt,At,St,Mt,wt,Pt,Rt,Et,Dt,It,Ft,Nt,Lt,kt,Ct,jt,Ot,Ut,Bt,$t,zt,Gt,Xt,Kt,qt,Yt,Jt,Qt,Wt,Zt,Ht,te,ee,ie,re,ne,ae,se,ue;function ye(e,t,i,r,a,n){var u,s,h,v,c,g,_,I=Symbol.metadata||Symbol.for("Symbol.metadata"),j=Object.defineProperty,b=Object.create,O=[b(null),b(null)],U=t.length;function B(o,A,x){return function(l,m){A&&(m=l,l=e);for(var S=0;S<o.length;S++)m=o[S].apply(l,x?[m]:[]);return x?m:l}}function P(o,A,x,l){if(typeof o!="function"&&(l||o!==void 0))throw new TypeError(A+" must "+(x||"be")+" a function"+(l?"":" or undefined"));return o}function nt(o,A,x,l,m,S,F,y,M,w,st){function Y(f){if(!st(f))throw new TypeError("Attempted to access private element on non-instance")}var J=[].concat(A[0]),ut=A[3],Q=!F,L=m===1,ot=m===3,lt=m===4,$=m===2;function z(f,N,mt){return function(X,dt){return N&&(dt=X,X=o),mt&&mt(X),d[f].call(X,dt)}}if(!Q){var d={},W=[],R=ot?"get":lt||L?"set":"value";if(M?(w||L?d={get:oe(function(){return ut(this)},l,"get"),set:function(f){A[4](this,f)}}:d[R]=ut,w||oe(d[R],l,$?"":R)):w||(d=Object.getOwnPropertyDescriptor(o,l)),!w&&!M){if((s=O[+y][l])&&(s^m)!==7)throw Error("Decorating two elements with the same name ("+d[R].name+") is not supported yet");O[+y][l]=m<3?1:m}}for(var p=o,G=J.length-1;G>=0;G-=x?2:1){var ht=P(J[G],"A decorator","be",!0),ct=x?J[G-1]:void 0,Z={},k={kind:["field","accessor","method","getter","setter","class"][m],name:l,metadata:u,addInitializer:function(f,N){if(f.v)throw new TypeError("attempted to call addInitializer after decoration was finished");P(N,"An initializer","be",!0),S.push(N)}.bind(null,Z)};if(Q)s=ht.call(ct,p,k),Z.v=1,P(s,"class decorators","return")&&(p=s);else if(k.static=y,k.private=M,s=k.access={has:M?st.bind():function(f){return l in f}},lt||(s.get=M?$?function(f){return Y(f),d.value}:z("get",0,Y):function(f){return f[l]}),$||ot||(s.set=M?z("set",0,Y):function(f,N){f[l]=N}),p=ht.call(ct,L?{get:d.get,set:d.set}:d[R],k),Z.v=1,L){if(typeof p=="object"&&p)(s=P(p.get,"accessor.get"))&&(d.get=s),(s=P(p.set,"accessor.set"))&&(d.set=s),(s=P(p.init,"accessor.init"))&&W.unshift(s);else if(p!==void 0)throw new TypeError("accessor decorators must return an object with get, set, or init properties or undefined")}else P(p,(w?"field":"method")+" decorators","return")&&(w?W.unshift(p):d[R]=p)}return m<2&&F.push(B(W,y,1),B(S,y,0)),w||Q||(M?L?F.splice(-1,0,z("get",y),z("set",y)):F.push($?d[R]:P.call.bind(d[R])):j(o,l,d)),p}function at(o){return j(o,I,{configurable:!0,enumerable:!0,value:u})}return n!==void 0&&(u=n[I]),u=b(u??null),c=[],g=function(o){o&&c.push(B(o))},_=function(o,A){for(var x=0;x<i.length;x++){var l=i[x],m=l[1],S=7&m;if((8&m)==o&&!S==A){var F=l[2],y=!!l[3],M=16&m;nt(o?e:e.prototype,l,M,y?"#"+F:Ve(F),S,S<2?[]:o?v=v||[]:h=h||[],c,!!o,y,A,o&&y?function(w){return Se(w)===e}:a)}}},_(8,0),_(0,0),_(8,1),_(0,1),g(h),g(v),s=c,U||at(e),{e:s,get c(){var o=[];return U&&[at(e=nt(e,[t],r,e.name,5,o)),B(o,1)]}}}function Ve(e){var t=Ae(e,"string");return typeof t=="symbol"?t:t+""}function Ae(e,t){if(typeof e!="object"||!e)return e;var i=e[Symbol.toPrimitive];if(i!==void 0){var r=i.call(e,t||"default");if(typeof r!="object")return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return(t==="string"?String:Number)(e)}function oe(e,t,i){typeof t=="symbol"&&(t=(t=t.description)?"["+t+"]":"");try{Object.defineProperty(e,"name",{configurable:!0,value:i?i+" "+t:t})}catch{}return e}function Se(e){if(Object(e)!==e)throw TypeError("right-hand side of 'in' should be an object, got "+(e!==null?typeof e:"null"));return e}var H=50,tt=25,et=75,me=100;function de(e,t,i,r,a){let n=e.clamp(t),u=e.clamp(i);n>u&&([n,u]=[u,n]);let s=Math.max(0,r);return u-n<s&&(a==="min"?n=e.clamp(u-s):u=e.clamp(n+s)),[n,u]}function Re(e){return Array.isArray(e.value)?[...e.value]:typeof e.value=="number"?[e.value]:e.variant==="range"?[tt,et]:[H]}function fe(e){let t=q(e.min,e.max,e.step);if(e.variant==="range"||e.values.length>=2){let i=e.values[0]??tt,r=e.values[1]??et;return de(t,i,r,e.minDistance??0)}return[t.clamp(e.values[0]??H)]}function ge(e,t,i){let r=K(t,i);return e.length===2?`${E(e[0],r)} \u2013 ${E(e[1],r)}`:E(e[0],r)}function be(e){let t=e.variant??"single",i=e.min??0,r=e.max??me,a=e.step??1,n=e.minDistance??0,u=Re(e),s=fe({variant:t,values:u,min:i,max:r,step:a,minDistance:n}),h=q(i,r,a);return{variant:s.length===2?"range":"single",min:i,max:r,step:a,minDistance:n,committed:s,readoutPrecision:K(a,e.valuePrecision),readoutText:ge(s,a,e.valuePrecision),trackStyle:pe(s,h),isRange:s.length===2,valuePrecision:typeof e.valuePrecision=="number"&&Number.isFinite(e.valuePrecision)?e.valuePrecision:void 0}}function pe(e,t){let i=e[0],r=e.length===2?e[1]:e[0],a=`${t.ratioFor(i)*100}%`,n=`${t.ratioFor(r)*100}%`,u=`${(t.ratioFor(r)-t.ratioFor(i))*100}%`;return{"--rui-slider-fill-start":e.length===2?a:"0%","--rui-slider-fill-size":e.length===2?u:n,"--rui-slider-value":a,"--rui-slider-min":a,"--rui-slider-max":n}}var ve,ce=class extends he{static{({e:[Tt,xt,yt,Vt,At,St,Mt,wt,Pt,Rt,Et,Dt,It,Ft,Nt,Lt,kt,Ct,jt,Ot,Ut,Bt,$t,zt,Gt,Xt,Kt,qt,Yt,Jt,Qt,Wt,Zt,Ht,te,ee,ie,re,ne,ae,se,ue,vt],c:[ve,_t]}=ye(this,[Me("rui-slider")],[[T({type:String,defaultValue:"single"}),0,"variant"],[T({type:String,defaultValue:"horizontal"}),0,"orientation"],[T({type:Array,reflect:!0,defaultValue:[H],transform:gt}),0,"value"],[T({type:Number,defaultValue:0}),0,"min"],[T({type:Number,defaultValue:me}),0,"max"],[T({type:Number,defaultValue:1}),0,"step"],[T({type:Number,attribute:"value-precision",defaultValue:Number.NaN}),0,"valuePrecision"],[T({type:Number,defaultValue:0}),0,"minDistance"],[T({type:Boolean,attribute:"read-only",reflect:!0,defaultValue:!1}),0,"readOnly"],[[T({type:String,defaultValue:""}),le([{ref:"label",bool:"hidden",invert:!0},{ref:"label",text:!0}])],0,"label"],[[T({type:Boolean,attribute:"show-value",defaultValue:!1}),le({selector:"[data-default-value]",bool:"hidden",invert:!0})],0,"showValue"],[T({type:Boolean,attribute:"value-title",defaultValue:!1}),0,"valueTitle"],[we({name:"rui-change",bubbles:!0,composed:!0}),0,"changeEvent"],[D({ref:"root"}),0,"rootTarget"],[D({ref:"header"}),0,"headerTarget"],[D({ref:"label"}),0,"labelTarget"],[D({ref:"rangeTrack"}),0,"rangeTrack"],[D({ref:"value"}),0,"valueTarget"],[D({ref:"singleThumb"}),0,"singleThumb"],[D({ref:"rangeMinThumb"}),0,"rangeMinThumb"],[D({ref:"rangeMaxThumb"}),0,"rangeMaxThumb"],[Pe(["value","min","max","step","valuePrecision","minDistance","variant","orientation","disabled","readOnly","effectiveDisabled","label","name","showValue","valueTitle"]),2,"onPropsUpdated"],[C({ref:"rangeTrack",type:"pointerdown"}),2,"onPointerDown"],[C({document:!0,type:"pointermove"}),2,"onPointerMove"],[C({document:!0,type:"pointerup"}),2,"onPointerUp"],[C({document:!0,type:"pointercancel"}),2,"onPointerCancel"],[C({selector:"[data-thumb]",type:"keydown"}),2,"onThumbKeydown"]],0,void 0,he))}variant=(vt(this),Tt(this));orientation=(xt(this),yt(this));value=(Vt(this),At(this));min=(St(this),Mt(this));max=(wt(this),Pt(this));step=(Rt(this),Et(this));valuePrecision=(Dt(this),It(this));minDistance=(Ft(this),Nt(this));readOnly=(Lt(this),kt(this));label=(Ct(this),jt(this));showValue=(Ot(this),Ut(this));valueTitle=(Bt(this),$t(this));changeEvent=(zt(this),Gt(this));rootTarget=(Xt(this),Kt(this));headerTarget=(qt(this),Yt(this));labelTarget=(Jt(this),Qt(this));rangeTrack=(Wt(this),Zt(this));valueTarget=(Ht(this),te(this));singleThumb=(ee(this),ie(this));rangeMinThumb=(re(this),ne(this));rangeMaxThumb=(ae(this),se(this));activeThumb=(ue(this),null);activePointerId=null;pending=null;lastEmitted="";onConnected(){this.adoptLegacyRangeAttributes(),this.syncChrome(),this.syncValues(this.committedValues())}formValue(){if(!this.name)return null;let t=this.liveValues();if(t.length===2){let i=new FormData;return i.append(this.name,String(t[0])),i.append(`${this.name}-max`,String(t[1])),i}return String(t[0]??"")}formState(){return this.committedValues().join(",")}restoreFormState(t){this.value=String(t).split(",").map(Number).filter(i=>Number.isFinite(i)),this.syncValues(this.committedValues())}adoptLegacyRangeAttributes(){if(this.hasAttribute("value"))return;let t=this.getAttribute("range-min"),i=this.getAttribute("range-max");if(t===null&&i===null)return;let r=t!==null?Number(t):tt,a=i!==null?Number(i):et;this.value=[r,a]}onPropsUpdated(){this.activeThumb||(this.syncChrome(),this.syncValues(this.committedValues()))}get isRange(){return this.liveValues().length===2}get isVertical(){return this.orientation==="vertical"}get numericRange(){return q(this.min,this.max,this.step)}get resolvedValuePrecision(){return K(this.step,this.valuePrecision)}formatValue(t){return E(t,this.resolvedValuePrecision)}formatValues(t){return ge(t,this.step,this.valuePrecision)}get defaultValueTarget(){return this.querySelector("[data-default-value]")}thumbFor(t){return t==="value"?this.singleThumb:t==="min"?this.rangeMinThumb:this.rangeMaxThumb}parseThumb(t){return this.isRange?t==="min"||t==="max"?t:null:t==="value"?t:null}constrainPair(t,i,r){return de(this.numericRange,t,i,this.minDistance,r)}committedValues(){return fe({variant:this.variant,values:this.value,min:this.min,max:this.max,step:this.step,minDistance:this.minDistance})}liveValues(){return this.pending??this.committedValues()}changeDetail(t){return{value:t}}emitIfChanged(t){let i=t.join(",");i!==this.lastEmitted&&(this.lastEmitted=i,this.changeEvent.emit(this.changeDetail(t)))}reflectValues(t){let i=this.value;i.length===t.length&&t.every((n,u)=>bt(i[u],n,this.step))||(this.value=t)}syncValues(t){this.paint(t),this.reflectValues(t);let i=t.length>=2?"range":"single";this.variant!==i&&(this.variant=i)}syncChrome(){this.syncRootChrome(),this.syncThumbChrome()}syncRootChrome(){let t=!!this.valueTarget&&(!this.defaultValueTarget||this.showValue);this.rootTarget?.classList.toggle("rui-slider--single",!this.isRange),this.rootTarget?.classList.toggle("rui-slider--range",this.isRange),this.rootTarget?.classList.toggle("rui-slider--vertical",this.isVertical),this.headerTarget?.toggleAttribute("hidden",!this.label&&!t)}syncThumbChrome(){let t=this.effectiveDisabled?-1:0,i=this.isVertical?"vertical":"horizontal",r=this.numericRange;for(let{id:a,label:n,visible:u}of this.getThumbChrome()){let s=this.thumbFor(a);s&&(s.toggleAttribute("hidden",!u),s.toggleAttribute("disabled",this.effectiveDisabled||!u),s.setAttribute("tabindex",String(u?t:-1)),s.setAttribute("aria-label",n),s.setAttribute("aria-orientation",i),s.setAttribute("aria-valuemin",String(r.lowerBound)),s.setAttribute("aria-valuemax",String(r.upperBound)),s.setAttribute("aria-readonly",String(this.readOnly)))}}getThumbChrome(){let t=this.isRange;return[{id:"value",label:this.label||"Value",visible:!t},{id:"min",label:this.label?`${this.label} minimum`:"Minimum value",visible:t},{id:"max",label:this.label?`${this.label} maximum`:"Maximum value",visible:t}]}paint(t){let i=t[0],r=t.length===2?t[1]:t[0],a=this.rangeTrack,n=pe(t,this.numericRange);for(let[u,s]of Object.entries(n))a?.style.setProperty(u,s);this.singleThumb&&(this.singleThumb.setAttribute("aria-valuenow",String(i)),this.singleThumb.setAttribute("aria-valuetext",this.formatValue(i))),this.rangeMinThumb&&(this.rangeMinThumb.setAttribute("aria-valuenow",String(i)),this.rangeMinThumb.setAttribute("aria-valuetext",this.formatValue(i)),this.rangeMinThumb.setAttribute("aria-valuemax",String(r))),this.rangeMaxThumb&&(this.rangeMaxThumb.setAttribute("aria-valuemin",String(i)),this.rangeMaxThumb.setAttribute("aria-valuenow",String(r)),this.rangeMaxThumb.setAttribute("aria-valuetext",this.formatValue(r))),this.valueTarget&&(this.valueTarget.textContent=this.formatValues(t)),this.syncFormValue(),this.syncValueTitle(t)}syncValueTitle(t){let i=[[this.rangeTrack,"track"],[this.singleThumb,"value"],[this.rangeMinThumb,"min"],[this.rangeMaxThumb,"max"]],r=this.getValueTitles(t);for(let[a,n]of i){let u=r[n];u?a?.setAttribute("title",u):a?.removeAttribute("title")}}getValueTitles(t){if(!this.valueTitle)return{};if(t.length===1)return{value:this.formatValue(t[0])};let[i,r]=t;return{min:this.formatValue(i),max:this.formatValue(r),track:this.formatValues(t)}}valueFromPointer(t){let i=this.rangeTrack;if(!i)return this.numericRange.lowerBound;let r=i.getBoundingClientRect();if(r.width===0||r.height===0)return this.numericRange.lowerBound;let a=this.isVertical?1-(t.clientY-r.top)/r.height:(t.clientX-r.left)/r.width;return this.numericRange.valueFromRatio(a)}nearestThumb(t){if(!this.isRange)return"value";let[i,r]=this.liveValues();return Math.abs(t-i)<=Math.abs(t-r)?"min":"max"}moveThumb(t,i){if(this.activeThumb=t,this.isRange){let a=this.pending??this.committedValues();this.pending=this.constrainPair(t==="min"?i:a[0],t==="max"?i:a[1],t)}else this.pending=[this.numericRange.clamp(i)];let r=this.pending;return this.paint(r),this.emitIfChanged(r),r}commit(){let t=this.liveValues();this.pending=null,this.activeThumb=null,this.activePointerId=null,this.syncValues(t)}revert(){this.pending=null,this.activeThumb=null,this.activePointerId=null,this.lastEmitted=this.committedValues().join(","),this.paint(this.committedValues())}releasePointer(t){let i=this.rangeTrack;i?.hasPointerCapture(t.pointerId)&&i.releasePointerCapture(t.pointerId)}onPointerDown(t){if(t.button!==0||this.effectiveDisabled||this.readOnly)return;let i=t.target.closest("[data-thumb]"),r=this.parseThumb(i?.getAttribute("data-thumb")??null),a=this.valueFromPointer(t),n=r??this.nearestThumb(a);this.pending=this.committedValues(),this.lastEmitted=this.pending.join(","),this.activeThumb=n,this.activePointerId=t.pointerId,this.rangeTrack?.setPointerCapture(t.pointerId),this.thumbFor(n)?.focus(),r||this.moveThumb(n,a),t.preventDefault()}onPointerMove(t){!this.activeThumb||t.pointerId!==this.activePointerId||this.moveThumb(this.activeThumb,this.valueFromPointer(t))}onPointerUp(t){!this.activeThumb||t.pointerId!==this.activePointerId||(this.releasePointer(t),this.commit())}onPointerCancel(t){!this.activeThumb||t.pointerId!==this.activePointerId||(this.releasePointer(t),this.revert())}onThumbKeydown(t){if(this.effectiveDisabled||this.readOnly)return;let i=t.target.closest("[data-thumb]"),r=this.parseThumb(i?.getAttribute("data-thumb")??null);if(!r)return;let a=this.committedValues(),n=r==="max"?a[a.length-1]:a[0],u=pt(this.numericRange,n,t.key);u!=null&&(t.preventDefault(),this.lastEmitted=a.join(","),this.moveThumb(r,u),this.commit())}static{_t()}};import{jsx as V,jsxs as rt}from"@ecopages/jsx/jsx-runtime";function it(...e){return e.filter(Boolean).join(" ")}function _e({children:e,class:t,...i}){return V("span",{...i,class:it("rui-slider__value",t),"data-ref":"value","aria-hidden":"true",children:e})}function Ee({disabled:e,min:t,max:i,label:r,variant:a,committed:n,readoutPrecision:u,trackStyle:s}){let h=a!=="range",v=r||"Value",c=n[0],g=n.length===2?n[1]:n[0],_=E(c,u),I=E(g,u);return V("div",{class:"rui-slider__range",children:rt("div",{class:"rui-slider__range-track","data-ref":"rangeTrack",style:s,children:[V("div",{class:"rui-slider__range-fill","data-ref":"rangeFill"}),V("button",{type:"button",class:"rui-slider__thumb","data-ref":"singleThumb","data-thumb":"value",role:"slider",tabindex:e||!h?-1:0,"aria-label":v,"aria-valuemin":t,"aria-valuemax":i,"aria-valuenow":c,"aria-valuetext":_,disabled:e||!h,hidden:!h}),V("button",{type:"button",class:"rui-slider__thumb","data-ref":"rangeMinThumb","data-thumb":"min",role:"slider",tabindex:e||h?-1:0,"aria-label":r?`${r} minimum`:"Minimum value","aria-valuemin":t,"aria-valuemax":g,"aria-valuenow":c,"aria-valuetext":_,disabled:e||h,hidden:h}),V("button",{type:"button",class:"rui-slider__thumb","data-ref":"rangeMaxThumb","data-thumb":"max",role:"slider",tabindex:e||h?-1:0,"aria-label":r?`${r} maximum`:"Maximum value","aria-valuemin":c,"aria-valuemax":i,"aria-valuenow":g,"aria-valuetext":I,disabled:e||h,hidden:h})]})})}function De({variant:e,orientation:t="horizontal",label:i,showValue:r=!1,valueTitle:a=!1,disabled:n,name:u,min:s,max:h,step:v,value:c,valuePrecision:g,minDistance:_,children:I,...j}){let b=be({variant:e,value:c,min:s,max:h,step:v,minDistance:_,valuePrecision:g}),O=I??V(_e,{"data-default-value":!0,hidden:!r,children:b.readoutText}),U=!!I||r;return V("rui-slider",{...j,variant:b.variant,orientation:t,label:i,showValue:r,valueTitle:a,disabled:n,name:u,min:b.min,max:b.max,step:b.step,value:b.committed,minDistance:b.minDistance,valuePrecision:b.valuePrecision,children:V(Ie,{seed:b,orientation:t,label:i,disabled:n,hasVisibleReadout:U,valueReadout:O})})}function Ie({seed:e,orientation:t,label:i,disabled:r,hasVisibleReadout:a,valueReadout:n}){return rt("div",{class:it("rui-slider",e.isRange?"rui-slider--range":"rui-slider--single",t==="vertical"&&"rui-slider--vertical"),"data-ref":"root",children:[rt("div",{class:"rui-slider__header","data-ref":"header",hidden:!i&&!a,children:[V("span",{class:"rui-slider__label","data-ref":"label",hidden:!i,children:i}),n]}),V(Ee,{disabled:r,min:e.min,max:e.max,label:i,variant:e.variant,committed:e.committed,readoutPrecision:e.readoutPrecision,trackStyle:e.trackStyle})]})}export{De as RuiSlider,ve as RuiSliderElement,_e as RuiSliderValue};
 //# sourceMappingURL=index.js.map