@editora/ui-core 0.1.21 → 0.1.22
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/dist/accordion.cjs.js +3 -3
- package/dist/accordion.esm.js +3 -3
- package/dist/alert-dialog.cjs.js +32 -32
- package/dist/alert-dialog.esm.js +95 -75
- package/dist/alert.cjs.js +6 -6
- package/dist/alert.esm.js +6 -6
- package/dist/animated-list.cjs.js +4 -4
- package/dist/animated-list.esm.js +4 -4
- package/dist/animated-text.cjs.js +4 -4
- package/dist/animated-text.esm.js +4 -4
- package/dist/app-header.cjs.js +3 -3
- package/dist/app-header.esm.js +3 -3
- package/dist/aspect-ratio.cjs.js +3 -3
- package/dist/aspect-ratio.esm.js +3 -3
- package/dist/avatar.cjs.js +14 -14
- package/dist/avatar.esm.js +31 -29
- package/dist/badge.cjs.js +4 -4
- package/dist/badge.esm.js +4 -4
- package/dist/block-controls.cjs.js +4 -4
- package/dist/block-controls.esm.js +4 -4
- package/dist/box.cjs.js +2 -2
- package/dist/box.esm.js +2 -2
- package/dist/breadcrumb.cjs.js +5 -5
- package/dist/breadcrumb.esm.js +5 -5
- package/dist/button.cjs.js +1 -1
- package/dist/button.esm.js +1 -1
- package/dist/{calendar-DLY4acgn.mjs → calendar-DbxYRdlv.mjs} +227 -183
- package/dist/{calendar-Dkof-FTK.js → calendar-Qa-cFOp3.js} +74 -35
- package/dist/calendar.cjs.js +1 -1
- package/dist/calendar.esm.js +1 -1
- package/dist/card.cjs.js +8 -8
- package/dist/card.esm.js +63 -20
- package/dist/chart.cjs.js +4 -4
- package/dist/chart.esm.js +6 -6
- package/dist/checkbox.cjs.js +2 -2
- package/dist/checkbox.esm.js +2 -2
- package/dist/collapsible.cjs.js +7 -7
- package/dist/collapsible.esm.js +7 -7
- package/dist/color-picker.cjs.js +30 -10
- package/dist/color-picker.esm.js +82 -60
- package/dist/combobox.cjs.js +29 -27
- package/dist/combobox.esm.js +51 -45
- package/dist/command.cjs.js +2 -2
- package/dist/command.esm.js +2 -2
- package/dist/components/ui-alert-dialog.d.ts +1 -0
- package/dist/components/ui-alert-dialog.d.ts.map +1 -1
- package/dist/components/ui-avatar.d.ts +1 -0
- package/dist/components/ui-avatar.d.ts.map +1 -1
- package/dist/components/ui-button.d.ts +1 -0
- package/dist/components/ui-button.d.ts.map +1 -1
- package/dist/components/ui-calendar.d.ts.map +1 -1
- package/dist/components/ui-card.d.ts +3 -0
- package/dist/components/ui-card.d.ts.map +1 -1
- package/dist/components/ui-checkbox.d.ts.map +1 -1
- package/dist/components/ui-color-picker.d.ts.map +1 -1
- package/dist/components/ui-combobox.d.ts.map +1 -1
- package/dist/components/ui-data-table.d.ts.map +1 -1
- package/dist/components/ui-date-field.d.ts.map +1 -1
- package/dist/components/ui-date-picker.d.ts.map +1 -1
- package/dist/components/ui-date-range-picker.d.ts.map +1 -1
- package/dist/components/ui-date-range-time-picker.d.ts.map +1 -1
- package/dist/components/ui-date-time-picker.d.ts.map +1 -1
- package/dist/components/ui-dock.d.ts +1 -0
- package/dist/components/ui-dock.d.ts.map +1 -1
- package/dist/components/ui-drawer.d.ts.map +1 -1
- package/dist/components/ui-dropdown.d.ts.map +1 -1
- package/dist/components/ui-field.d.ts.map +1 -1
- package/dist/components/ui-file-upload.d.ts.map +1 -1
- package/dist/components/ui-gantt.d.ts.map +1 -1
- package/dist/components/ui-input.d.ts.map +1 -1
- package/dist/components/ui-menu.d.ts.map +1 -1
- package/dist/components/ui-multi-select.d.ts.map +1 -1
- package/dist/components/ui-number-field.d.ts.map +1 -1
- package/dist/components/ui-password-field.d.ts.map +1 -1
- package/dist/components/ui-pin-input.d.ts +1 -0
- package/dist/components/ui-pin-input.d.ts.map +1 -1
- package/dist/components/ui-placement-grid.d.ts.map +1 -1
- package/dist/components/ui-progress.d.ts.map +1 -1
- package/dist/components/ui-radio.d.ts.map +1 -1
- package/dist/components/ui-rating.d.ts +1 -0
- package/dist/components/ui-rating.d.ts.map +1 -1
- package/dist/components/ui-select.d.ts.map +1 -1
- package/dist/components/ui-sortable.d.ts.map +1 -1
- package/dist/components/ui-switch.d.ts.map +1 -1
- package/dist/components/ui-table.d.ts.map +1 -1
- package/dist/components/ui-tabs.d.ts +1 -0
- package/dist/components/ui-tabs.d.ts.map +1 -1
- package/dist/components/ui-tags-input.d.ts +1 -0
- package/dist/components/ui-tags-input.d.ts.map +1 -1
- package/dist/components/ui-textarea.d.ts.map +1 -1
- package/dist/components/ui-time-field.d.ts.map +1 -1
- package/dist/components/ui-toggle-group.d.ts.map +1 -1
- package/dist/components/ui-toggle.d.ts.map +1 -1
- package/dist/components/ui-tree.d.ts.map +1 -1
- package/dist/components/ui-wizard.d.ts.map +1 -1
- package/dist/context-menu.cjs.js +3 -3
- package/dist/context-menu.esm.js +4 -4
- package/dist/control-name-BmoI1m3a.js +1 -0
- package/dist/control-name-Bpj7F34X.mjs +48 -0
- package/dist/data-table.cjs.js +5 -2
- package/dist/data-table.esm.js +145 -142
- package/dist/date-field.cjs.js +5 -5
- package/dist/date-field.esm.js +34 -31
- package/dist/date-picker.cjs.js +16 -16
- package/dist/date-picker.esm.js +48 -44
- package/dist/date-range-picker.cjs.js +5 -5
- package/dist/date-range-picker.esm.js +120 -118
- package/dist/date-range-time-picker.cjs.js +22 -22
- package/dist/date-range-time-picker.esm.js +88 -84
- package/dist/date-time-picker.cjs.js +23 -23
- package/dist/date-time-picker.esm.js +102 -98
- package/dist/{date-time-utils-Dmost5Ee.js → date-time-utils-BzfTpeU-.js} +1 -1
- package/dist/{date-time-utils-y1N2gvG2.mjs → date-time-utils-Cps2aSu2.mjs} +1 -1
- package/dist/description.cjs.js +3 -3
- package/dist/description.esm.js +3 -3
- package/dist/dialog.cjs.js +2 -2
- package/dist/dialog.esm.js +2 -2
- package/dist/dock.cjs.js +12 -12
- package/dist/dock.esm.js +72 -74
- package/dist/drawer.cjs.js +19 -19
- package/dist/drawer.esm.js +58 -58
- package/dist/dropdown.cjs.js +13 -13
- package/dist/dropdown.esm.js +49 -48
- package/dist/empty-state.cjs.js +3 -3
- package/dist/empty-state.esm.js +3 -3
- package/dist/field-error.cjs.js +1 -1
- package/dist/field-error.esm.js +1 -1
- package/dist/field.cjs.js +12 -12
- package/dist/field.esm.js +84 -75
- package/dist/fieldset.cjs.js +4 -4
- package/dist/fieldset.esm.js +4 -4
- package/dist/file-upload.cjs.js +3 -3
- package/dist/file-upload.esm.js +5 -3
- package/dist/floating-toolbar.cjs.js +8 -8
- package/dist/floating-toolbar.esm.js +9 -9
- package/dist/form.cjs.js +11 -11
- package/dist/form.esm.js +11 -11
- package/dist/gantt.cjs.js +43 -32
- package/dist/gantt.esm.js +99 -88
- package/dist/icon-cloud.cjs.js +3 -3
- package/dist/icon-cloud.esm.js +3 -3
- package/dist/icon.cjs.js +1 -1
- package/dist/icon.esm.js +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.esm.js +121 -118
- package/dist/inline-edit.cjs.js +1 -1
- package/dist/inline-edit.esm.js +1 -1
- package/dist/input.cjs.js +14 -14
- package/dist/input.esm.js +39 -32
- package/dist/label.cjs.js +3 -3
- package/dist/label.esm.js +3 -3
- package/dist/{listbox-B6QgECax.js → listbox-CTpRpuF7.js} +1 -1
- package/dist/{listbox-DJamVeFj.mjs → listbox-hMVOhKHC.mjs} +1 -1
- package/dist/listbox.cjs.js +1 -1
- package/dist/listbox.esm.js +1 -1
- package/dist/marquee.cjs.js +3 -3
- package/dist/marquee.esm.js +3 -3
- package/dist/{menu-item-styles-CbNUEwP2.js → menu-item-styles-B4onAr4C.js} +3 -3
- package/dist/{menu-item-styles-CZiPwPwl.mjs → menu-item-styles-IGSFLAHu.mjs} +3 -3
- package/dist/menu.cjs.js +7 -7
- package/dist/menu.esm.js +29 -28
- package/dist/menubar.cjs.js +1 -1
- package/dist/menubar.esm.js +2 -2
- package/dist/meter.cjs.js +1 -1
- package/dist/meter.esm.js +1 -1
- package/dist/multi-select.cjs.js +17 -17
- package/dist/multi-select.esm.js +51 -43
- package/dist/navigation-menu.cjs.js +1 -1
- package/dist/navigation-menu.esm.js +1 -1
- package/dist/number-field.cjs.js +11 -13
- package/dist/number-field.esm.js +29 -27
- package/dist/number-ticker.cjs.js +4 -4
- package/dist/number-ticker.esm.js +4 -4
- package/dist/odometer.cjs.js +2 -2
- package/dist/odometer.esm.js +2 -2
- package/dist/orbiter.cjs.js +3 -3
- package/dist/orbiter.esm.js +3 -3
- package/dist/pagination.cjs.js +1 -1
- package/dist/pagination.esm.js +1 -1
- package/dist/password-field.cjs.js +23 -23
- package/dist/password-field.esm.js +48 -47
- package/dist/pin-input.cjs.js +8 -6
- package/dist/pin-input.esm.js +21 -15
- package/dist/placement-grid.cjs.js +4 -4
- package/dist/placement-grid.esm.js +58 -58
- package/dist/plugin-panel.cjs.js +1 -1
- package/dist/plugin-panel.esm.js +1 -1
- package/dist/popover.cjs.js +5 -5
- package/dist/popover.esm.js +4 -4
- package/dist/primitives/control-name.d.ts +30 -0
- package/dist/primitives/control-name.d.ts.map +1 -0
- package/dist/primitives/trigger.d.ts +2 -0
- package/dist/primitives/trigger.d.ts.map +1 -0
- package/dist/progress.cjs.js +4 -4
- package/dist/progress.esm.js +20 -18
- package/dist/quick-actions.cjs.js +3 -3
- package/dist/quick-actions.esm.js +3 -3
- package/dist/radio-group.cjs.js +1 -1
- package/dist/radio-group.esm.js +1 -1
- package/dist/radio.cjs.js +2 -2
- package/dist/radio.esm.js +2 -2
- package/dist/rating.cjs.js +17 -16
- package/dist/rating.esm.js +91 -92
- package/dist/{runtime-D1gFh1fS.mjs → runtime-CFnK53iC.mjs} +133 -94
- package/dist/runtime-DwE-tizc.js +1 -0
- package/dist/runtime.cjs.js +1 -1
- package/dist/runtime.d.ts +1 -1
- package/dist/runtime.d.ts.map +1 -1
- package/dist/runtime.esm.js +29 -26
- package/dist/select.cjs.js +20 -19
- package/dist/select.esm.js +36 -32
- package/dist/selection-popup.cjs.js +2 -2
- package/dist/selection-popup.esm.js +2 -2
- package/dist/separator.cjs.js +7 -7
- package/dist/separator.esm.js +7 -7
- package/dist/sidebar.cjs.js +7 -7
- package/dist/sidebar.esm.js +7 -7
- package/dist/skeleton.cjs.js +7 -7
- package/dist/skeleton.esm.js +7 -7
- package/dist/slider.cjs.js +3 -3
- package/dist/slider.esm.js +3 -3
- package/dist/slot.cjs.js +3 -3
- package/dist/slot.esm.js +3 -3
- package/dist/sortable.cjs.js +41 -42
- package/dist/sortable.esm.js +98 -99
- package/dist/spinning-text.cjs.js +3 -3
- package/dist/spinning-text.esm.js +3 -3
- package/dist/split-button.cjs.js +1 -1
- package/dist/split-button.esm.js +1 -1
- package/dist/stepper.cjs.js +1 -1
- package/dist/stepper.esm.js +1 -1
- package/dist/switch.cjs.js +10 -12
- package/dist/switch.esm.js +10 -12
- package/dist/table.cjs.js +9 -6
- package/dist/table.esm.js +46 -43
- package/dist/tabs.cjs.js +20 -21
- package/dist/tabs.esm.js +70 -66
- package/dist/tags-input.cjs.js +9 -9
- package/dist/tags-input.esm.js +32 -25
- package/dist/textarea.cjs.js +10 -10
- package/dist/textarea.esm.js +30 -21
- package/dist/theme.d.ts +18 -0
- package/dist/theme.d.ts.map +1 -1
- package/dist/time-field.cjs.js +5 -5
- package/dist/time-field.esm.js +21 -18
- package/dist/time-picker.cjs.js +4 -4
- package/dist/time-picker.esm.js +5 -5
- package/dist/timeline.cjs.js +2 -2
- package/dist/timeline.esm.js +4 -4
- package/dist/toast.cjs.js +6 -6
- package/dist/toast.esm.js +13 -13
- package/dist/toggle-group.cjs.js +5 -6
- package/dist/toggle-group.esm.js +63 -60
- package/dist/toggle.cjs.js +18 -18
- package/dist/toggle.esm.js +32 -31
- package/dist/tooltip.cjs.js +4 -4
- package/dist/tooltip.esm.js +4 -4
- package/dist/transfer-list.cjs.js +3 -3
- package/dist/transfer-list.esm.js +3 -3
- package/dist/tree-7qbVnpGp.js +39 -0
- package/dist/{tree-B3kE8ESs.mjs → tree-Deoft-kO.mjs} +34 -33
- package/dist/tree.cjs.js +1 -1
- package/dist/tree.esm.js +1 -1
- package/dist/trigger-BjnxLCeQ.mjs +9 -0
- package/dist/trigger-DkPsKxsP.js +1 -0
- package/dist/{ui-button-rXQOS9QJ.js → ui-button-BInsgSbr.js} +27 -26
- package/dist/{ui-button-Q0GNNWKC.mjs → ui-button-rfiuUnUD.mjs} +65 -48
- package/dist/{ui-icon-YI6lyuqU.mjs → ui-icon-BSi_GtqO.mjs} +2 -2
- package/dist/{ui-icon-BzVNC_lr.js → ui-icon-Bvt9oIIR.js} +5 -5
- package/dist/wizard.cjs.js +12 -13
- package/dist/wizard.esm.js +17 -15
- package/package.json +1 -1
- package/dist/runtime-CTaOSmBj.js +0 -1
- package/dist/tree-Dx_kv_ih.js +0 -39
package/dist/chart.cjs.js
CHANGED
|
@@ -4,11 +4,11 @@
|
|
|
4
4
|
--ui-chart-surface: color-mix(in srgb, var(--ui-color-surface, #ffffff) 97%, #ffffff 3%);
|
|
5
5
|
--ui-chart-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 74%, transparent);
|
|
6
6
|
--ui-chart-text: var(--ui-color-text, #0f172a);
|
|
7
|
-
--ui-chart-muted: var(--ui-color-muted, #
|
|
7
|
+
--ui-chart-muted: var(--ui-color-muted, #526175);
|
|
8
8
|
--ui-chart-grid: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 45%, transparent);
|
|
9
9
|
--ui-chart-accent: var(--ui-color-primary, #2563eb);
|
|
10
|
-
--ui-chart-success: var(--ui-color-success, #
|
|
11
|
-
--ui-chart-warning: var(--ui-color-warning, #
|
|
10
|
+
--ui-chart-success: var(--ui-color-success, #15803d);
|
|
11
|
+
--ui-chart-warning: var(--ui-color-warning, #b45309);
|
|
12
12
|
--ui-chart-danger: var(--ui-color-danger, #dc2626);
|
|
13
13
|
--ui-chart-radius: 16px;
|
|
14
14
|
--ui-chart-shadow: none;
|
|
@@ -613,7 +613,7 @@
|
|
|
613
613
|
background-position: -220% 0;
|
|
614
614
|
}
|
|
615
615
|
}
|
|
616
|
-
`,q=["var(--ui-color-primary, #2563eb)","var(--ui-color-success, #16a34a)","var(--ui-color-warning, #d97706)","var(--ui-color-danger, #dc2626)","var(--ui-color-info, #0891b2)","var(--ui-color-accent, #7c3aed)"];function c(p){return p.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'")}function M(p,t,e){return Math.max(t,Math.min(e,p))}function G(p,t,e){if(p)try{const i=JSON.parse(p);if(Array.isArray(i))return i.map((o,s)=>{if(typeof o=="number")return Number.isFinite(o)?{label:String(s+1),value:o}:null;if(o&&typeof o=="object"){const n=Number(o.value);if(!Number.isFinite(n))return null;const d=o.label,u=o.tone;return{label:typeof d=="string"&&d.trim()?d.trim():String(s+1),value:n,tone:typeof u=="string"&&u.trim()?u.trim():void 0}}return null}).filter(o=>!!o)}catch{return[]}const a=(t||"").split(",").map(i=>Number(i.trim())).filter(i=>Number.isFinite(i)),r=(e||"").split(",").map(i=>i.trim()).filter(Boolean);return a.map((i,o)=>({label:r[o]||String(o+1),value:i}))}function Q(p){return Array.isArray(p)?p.map((t,e)=>{if(typeof t=="number")return Number.isFinite(t)?{label:String(e+1),value:t}:null;if(t&&typeof t=="object"){const a=Number(t.value);if(!Number.isFinite(a))return null;const r=t.label,i=t.tone;return{label:typeof r=="string"&&r.trim()?r.trim():String(e+1),value:a,tone:typeof i=="string"&&i.trim()?i.trim():void 0}}return null}).filter(t=>!!t):[]}function tt(p){if(!p)return[];try{const t=JSON.parse(p);return Array.isArray(t)?t.map((a,r)=>{if(!a||typeof a!="object")return null;const i=a.name,o=Q(a.data);if(!o.length)return null;const s=a.tone,n=a.dash,d=Number(a.strokeWidth),u=Number(a.opacity),T=a.fill;return{name:typeof i=="string"&&i.trim()?i.trim():`Series ${r+1}`,data:o,tone:typeof s=="string"&&s.trim()?s.trim():void 0,dash:typeof n=="string"&&n.trim()?n.trim():void 0,strokeWidth:Number.isFinite(d)&&d>0?d:void 0,opacity:Number.isFinite(u)&&u>0?u:void 0,fill:typeof T=="boolean"?T:void 0}}).filter(a=>!!a):[]}catch{return[]}}function et(p){const t=p.map((a,r)=>({label:a.label?.trim()||String(r+1),value:Number(a.value),tone:typeof a.tone=="string"&&a.tone.trim()?a.tone.trim():void 0})).filter(a=>Number.isFinite(a.value));if(t.length<=V)return{points:t,truncated:0};const e=t.length-V;return{points:t.slice(t.length-V),truncated:e}}function at(p,t){const a=(p.length?p:t.length?[{name:"Series 1",data:t}]:[]).map(n=>{const d=et(n.data);return{name:n.name,data:d.points,tone:n.tone,fill:n.fill,dash:n.dash,strokeWidth:n.strokeWidth,opacity:n.opacity,truncated:d.truncated}}).filter(n=>n.data.length>0),r=new Set;a.forEach(n=>{n.data.forEach(d=>r.add(d.label))});let i=Array.from(r),o=a.reduce((n,d)=>Math.max(n,d.truncated),0);i.length>V&&(o+=i.length-V,i=i.slice(i.length-V));const s=a.map(n=>{const d=new Set(i);return{name:n.name,data:n.data.filter(u=>d.has(u.label)),tone:n.tone,fill:n.fill,dash:n.dash,strokeWidth:n.strokeWidth,opacity:n.opacity}});return{labels:i,series:s,truncated:o}}function K(p){return p==="loading"?"Updating":p==="error"?"Issue":p==="success"?"Stable":"Live"}function it(p){return p==="loading"||p==="error"||p==="success"?p:"idle"}class Z extends J.ElementBase{constructor(){super(...arguments),this._activeIndex=null,this._activePinned=!1,this._onClickBound=t=>this._onClick(t),this._onKeyDownBound=t=>this._onKeyDown(t),this._onPointerOverBound=t=>this._onPointerOver(t),this._onPointerLeaveBound=()=>this._onPointerLeave(),this._onFocusInBound=t=>this._onFocusIn(t)}static get observedAttributes(){return["data","series","values","labels","type","variant","title","subtitle","headless","state","disabled","interactive","show-legend","show-summary","value-prefix","value-suffix","aria-label"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("click",this._onClickBound),this.root.addEventListener("keydown",this._onKeyDownBound),this.root.addEventListener("pointerover",this._onPointerOverBound),this.root.addEventListener("pointerleave",this._onPointerLeaveBound),this.root.addEventListener("focusin",this._onFocusInBound)}disconnectedCallback(){this.root.removeEventListener("click",this._onClickBound),this.root.removeEventListener("keydown",this._onKeyDownBound),this.root.removeEventListener("pointerover",this._onPointerOverBound),this.root.removeEventListener("pointerleave",this._onPointerLeaveBound),this.root.removeEventListener("focusin",this._onFocusInBound),super.disconnectedCallback()}attributeChangedCallback(t,e,a){e!==a&&((t==="disabled"||t==="state"||t==="interactive")&&(this._isInteractive()||(this._activeIndex=null,this._activePinned=!1)),super.attributeChangedCallback(t,e,a))}_data(){const t=G(this.getAttribute("data"),this.getAttribute("values"),this.getAttribute("labels")),e=tt(this.getAttribute("series"));return at(e,t)}_type(){const t=this.getAttribute("type");return t==="line"||t==="area"||t==="bar"||t==="donut"||t==="step"||t==="scatter"||t==="radial"?t:"line"}_state(){return it(this.getAttribute("state"))}_isDisabled(){return this.hasAttribute("disabled")||this._state()==="loading"}_isInteractive(){const t=(this.getAttribute("interactive")||"").trim().toLowerCase();return t==="false"||t==="0"||t==="off"?!1:!this._isDisabled()}_showLegend(){const t=(this.getAttribute("show-legend")||"").trim().toLowerCase();return t?t!=="false"&&t!=="0"&&t!=="off":!0}_showSummary(){const t=(this.getAttribute("show-summary")||"").trim().toLowerCase();return t?t!=="false"&&t!=="0"&&t!=="off":!0}_primarySeries(t){return t.series[0]||null}_valuePrefix(){return this.getAttribute("value-prefix")||""}_valueSuffix(){return this.getAttribute("value-suffix")||""}_resolveStats(t){const e=t.map(u=>u.value),a=e.reduce((u,T)=>u+T,0),r=e.length?a/e.length:0,i=e.length?Math.min(...e):0,o=e.length?Math.max(...e):0,s=e.length>1?e[e.length-1]-e[0]:0,n=e[0]||0,d=n!==0?s/Math.abs(n)*100:null;return{total:a,average:r,min:i,max:o,delta:s,deltaPct:d}}_valueDomain(t,e){const a=!!e?.includeZero,r=e?.fitPadding??.14,i=t.map(u=>u.value);let o=Math.min(...i),s=Math.max(...i);a&&(o=Math.min(0,o),s=Math.max(0,s));let n=s-o;if(n<=0){const u=Math.max(Math.abs(s)*.12,1);o-=u,s+=u,n=s-o}else{const u=n*r;a?(o-=u*.25,s+=u):(o-=u,s+=u),n=s-o}const d=o<=0&&s>=0;return{min:o,max:s,span:n,zeroInDomain:d}}_formatValue(t,e){const a=this._valuePrefix(),r=this._valueSuffix();try{const i=new Intl.NumberFormat(void 0,{maximumFractionDigits:Math.abs(t)>=100?0:1,...e}).format(t);return`${a}${i}${r}`}catch{return`${a}${t.toFixed(Math.abs(t)>=100?0:1)}${r}`}}_seriesTone(t,e){return t.tone||q[e%q.length]||"var(--ui-chart-accent)"}_pointTone(t,e,a){return t.tone||a||q[e%q.length]||"var(--ui-chart-accent)"}_seriesValueDetails(t,e,a){const r=t[a];return e.map((i,o)=>{const s=i.data.find(n=>n.label===r)||null;return{series:i.name,value:s?.value??null,tone:s?.tone||this._seriesTone(i,o)}})}_pointDetail(t,e,a,r){const i=this._primarySeries(e);if(!i)return null;const o=e.labels[t];if(!o)return null;const s=i.data.find(u=>u.label===o)||i.data[t];if(!s)return null;const n=this._resolveStats(i.data),d=this._seriesValueDetails(e.labels,e.series,t);return{index:t,label:o,value:s.value,tone:s.tone||this._seriesTone(i,0),series:i.name,seriesValues:d,type:a,total:n.total,min:n.min,max:n.max,source:r}}_emitPointSelect(t,e,a){const r=this._pointDetail(t,e,this._type(),a);r&&(this.dispatchEvent(new CustomEvent("point-select",{detail:r,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("ui-point-select",{detail:r,bubbles:!0,composed:!0})))}_indexFromTarget(t){const e=t instanceof Element?t.closest("[data-point-index]"):null;if(!e)return null;const a=Number(e.getAttribute("data-point-index"));return!Number.isInteger(a)||a<0?null:a}_setActiveIndex(t,e){this._activeIndex=t,this._activePinned=e,this.requestRender()}_focusIndex(t){const e=this.root.querySelector(`.legend-item[data-point-index="${t}"]`);if(e)try{e.focus({preventScroll:!0})}catch{e.focus()}}_onPointerOver(t){if(!this._isInteractive()||this._activePinned)return;const e=this._indexFromTarget(t.target);e==null||this._activeIndex===e||(this._activeIndex=e,this.requestRender())}_onPointerLeave(){!this._isInteractive()||this._activePinned||this._activeIndex==null||(this._activeIndex=null,this.requestRender())}_onFocusIn(t){if(!this._isInteractive())return;const e=this._indexFromTarget(t.target);e==null||this._activeIndex===e||(this._activeIndex=e,this.requestRender())}_onClick(t){if(!this._isInteractive())return;const e=this._data();if(!e.labels.length||!e.series.length)return;const a=this._indexFromTarget(t.target);if(a==null||a>=e.labels.length)return;const r=!(this._activePinned&&this._activeIndex===a);this._activeIndex=a,this._activePinned=r,this.requestRender(),this._emitPointSelect(a,e,"pointer")}_onKeyDown(t){if(!this._isInteractive())return;const e=this._data();if(!e.labels.length||!e.series.length)return;const r=this._indexFromTarget(t.target)??this._activeIndex??0;if(t.key==="ArrowRight"||t.key==="ArrowDown"){t.preventDefault();const o=M(r+1,0,e.labels.length-1);this._setActiveIndex(o,!0),this._focusIndex(o);return}if(t.key==="ArrowLeft"||t.key==="ArrowUp"){t.preventDefault();const o=M(r-1,0,e.labels.length-1);this._setActiveIndex(o,!0),this._focusIndex(o);return}if(t.key==="Home"){t.preventDefault(),this._setActiveIndex(0,!0),this._focusIndex(0);return}if(t.key==="End"){t.preventDefault();const o=e.labels.length-1;this._setActiveIndex(o,!0),this._focusIndex(o);return}if(t.key==="Escape"){if(!this._activePinned&&this._activeIndex==null)return;t.preventDefault(),this._setActiveIndex(null,!1);return}if(t.key!=="Enter"&&t.key!==" ")return;t.preventDefault();const i=M(r,0,e.labels.length-1);this._setActiveIndex(i,!0),this._emitPointSelect(i,e,"keyboard")}_axisXLabels(t){if(t.length<=8)return t.map(()=>"visible");const e=Math.max(1,Math.ceil(t.length/6));return t.map((a,r)=>r===0||r===t.length-1||r%e===0?"visible":"hidden")}_buildCartesianTicks(t,e){return[1,.75,.5,.25,0].map(a=>this._formatValue(t+(e-t)*a))}_plotCartesian(t,e,a){const $=t.labels,P=t.series,w=e==="bar",b=P.flatMap(g=>g.data.map(x=>x.value)),_=this._valueDomain(b.map((g,x)=>({label:String(x),value:g})),{includeZero:w}),F=_.min,l=_.max,v=_.span,f=$.length>1?208/($.length-1):0,S=_.zeroInDomain?0:F,h=6+(l-S)/v*48,k=[0,.25,.5,.75,1].map(g=>{const x=6+48*g,I=_.zeroInDomain&&Math.abs(x-h)<.5;return`<line x1="8" y1="${x.toFixed(2)}" x2="${216 .toFixed(2)}" y2="${x.toFixed(2)}" stroke="var(--ui-chart-grid)" stroke-width="${I?"0.75":"0.45"}" />`}).join(""),L=P.map(g=>new Map(g.data.map(x=>[x.label,x]))),j=$.map((g,x)=>{const I=8+f*x,D=L.map(z=>z.get(g)).filter(z=>!!z).map(z=>6+(l-z.value)/v*48),C=D.length?Math.min(...D):6+48/2;return{xPct:M(I/220*100,0,100),yPct:M(C/64*100,0,100)}}),E=$.map((g,x)=>{const I=j[x];return`<button type="button" class="plot-hit" data-role="plot-hit" data-point-index="${x}" data-active="${a===x?"true":"false"}" style="--x:${I.xPct.toFixed(3)};--y:${I.yPct.toFixed(3)};" aria-label="${c(g)}" ${this._isInteractive()?"":"disabled"}></button>`}).join("");if(e==="bar"){const g=208/Math.max(1,$.length),x=M(g*.82,6,22),I=x/Math.max(1,P.length),D=P.map((C,z)=>{const N=this._seriesTone(C,z);return $.map((O,H)=>{const W=L[z].get(O);if(!W)return"";const m=8+H*g+(g-x)/2+I*z,y=6+(l-W.value)/v*48,A=Math.min(y,h),R=Math.max(1,Math.abs(h-y)),B=a===H,Y=a==null||B?C.opacity??1:.72;return`<rect x="${m.toFixed(2)}" y="${A.toFixed(2)}" width="${Math.max(2,I-1).toFixed(2)}" height="${R.toFixed(2)}" rx="1.4" fill="${c(N)}" opacity="${Y}" />`}).join("")}).join("");return{svg:`
|
|
616
|
+
`,q=["var(--ui-color-primary, #2563eb)","var(--ui-color-success, #15803d)","var(--ui-color-warning, #b45309)","var(--ui-color-danger, #dc2626)","var(--ui-color-info, #0e7490)","var(--ui-color-accent, #7c3aed)"];function c(p){return p.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'")}function M(p,t,e){return Math.max(t,Math.min(e,p))}function G(p,t,e){if(p)try{const i=JSON.parse(p);if(Array.isArray(i))return i.map((o,s)=>{if(typeof o=="number")return Number.isFinite(o)?{label:String(s+1),value:o}:null;if(o&&typeof o=="object"){const n=Number(o.value);if(!Number.isFinite(n))return null;const d=o.label,u=o.tone;return{label:typeof d=="string"&&d.trim()?d.trim():String(s+1),value:n,tone:typeof u=="string"&&u.trim()?u.trim():void 0}}return null}).filter(o=>!!o)}catch{return[]}const a=(t||"").split(",").map(i=>Number(i.trim())).filter(i=>Number.isFinite(i)),r=(e||"").split(",").map(i=>i.trim()).filter(Boolean);return a.map((i,o)=>({label:r[o]||String(o+1),value:i}))}function Q(p){return Array.isArray(p)?p.map((t,e)=>{if(typeof t=="number")return Number.isFinite(t)?{label:String(e+1),value:t}:null;if(t&&typeof t=="object"){const a=Number(t.value);if(!Number.isFinite(a))return null;const r=t.label,i=t.tone;return{label:typeof r=="string"&&r.trim()?r.trim():String(e+1),value:a,tone:typeof i=="string"&&i.trim()?i.trim():void 0}}return null}).filter(t=>!!t):[]}function tt(p){if(!p)return[];try{const t=JSON.parse(p);return Array.isArray(t)?t.map((a,r)=>{if(!a||typeof a!="object")return null;const i=a.name,o=Q(a.data);if(!o.length)return null;const s=a.tone,n=a.dash,d=Number(a.strokeWidth),u=Number(a.opacity),T=a.fill;return{name:typeof i=="string"&&i.trim()?i.trim():`Series ${r+1}`,data:o,tone:typeof s=="string"&&s.trim()?s.trim():void 0,dash:typeof n=="string"&&n.trim()?n.trim():void 0,strokeWidth:Number.isFinite(d)&&d>0?d:void 0,opacity:Number.isFinite(u)&&u>0?u:void 0,fill:typeof T=="boolean"?T:void 0}}).filter(a=>!!a):[]}catch{return[]}}function et(p){const t=p.map((a,r)=>({label:a.label?.trim()||String(r+1),value:Number(a.value),tone:typeof a.tone=="string"&&a.tone.trim()?a.tone.trim():void 0})).filter(a=>Number.isFinite(a.value));if(t.length<=V)return{points:t,truncated:0};const e=t.length-V;return{points:t.slice(t.length-V),truncated:e}}function at(p,t){const a=(p.length?p:t.length?[{name:"Series 1",data:t}]:[]).map(n=>{const d=et(n.data);return{name:n.name,data:d.points,tone:n.tone,fill:n.fill,dash:n.dash,strokeWidth:n.strokeWidth,opacity:n.opacity,truncated:d.truncated}}).filter(n=>n.data.length>0),r=new Set;a.forEach(n=>{n.data.forEach(d=>r.add(d.label))});let i=Array.from(r),o=a.reduce((n,d)=>Math.max(n,d.truncated),0);i.length>V&&(o+=i.length-V,i=i.slice(i.length-V));const s=a.map(n=>{const d=new Set(i);return{name:n.name,data:n.data.filter(u=>d.has(u.label)),tone:n.tone,fill:n.fill,dash:n.dash,strokeWidth:n.strokeWidth,opacity:n.opacity}});return{labels:i,series:s,truncated:o}}function K(p){return p==="loading"?"Updating":p==="error"?"Issue":p==="success"?"Stable":"Live"}function it(p){return p==="loading"||p==="error"||p==="success"?p:"idle"}class Z extends J.ElementBase{constructor(){super(...arguments),this._activeIndex=null,this._activePinned=!1,this._onClickBound=t=>this._onClick(t),this._onKeyDownBound=t=>this._onKeyDown(t),this._onPointerOverBound=t=>this._onPointerOver(t),this._onPointerLeaveBound=()=>this._onPointerLeave(),this._onFocusInBound=t=>this._onFocusIn(t)}static get observedAttributes(){return["data","series","values","labels","type","variant","title","subtitle","headless","state","disabled","interactive","show-legend","show-summary","value-prefix","value-suffix","aria-label"]}connectedCallback(){super.connectedCallback(),this.root.addEventListener("click",this._onClickBound),this.root.addEventListener("keydown",this._onKeyDownBound),this.root.addEventListener("pointerover",this._onPointerOverBound),this.root.addEventListener("pointerleave",this._onPointerLeaveBound),this.root.addEventListener("focusin",this._onFocusInBound)}disconnectedCallback(){this.root.removeEventListener("click",this._onClickBound),this.root.removeEventListener("keydown",this._onKeyDownBound),this.root.removeEventListener("pointerover",this._onPointerOverBound),this.root.removeEventListener("pointerleave",this._onPointerLeaveBound),this.root.removeEventListener("focusin",this._onFocusInBound),super.disconnectedCallback()}attributeChangedCallback(t,e,a){e!==a&&((t==="disabled"||t==="state"||t==="interactive")&&(this._isInteractive()||(this._activeIndex=null,this._activePinned=!1)),super.attributeChangedCallback(t,e,a))}_data(){const t=G(this.getAttribute("data"),this.getAttribute("values"),this.getAttribute("labels")),e=tt(this.getAttribute("series"));return at(e,t)}_type(){const t=this.getAttribute("type");return t==="line"||t==="area"||t==="bar"||t==="donut"||t==="step"||t==="scatter"||t==="radial"?t:"line"}_state(){return it(this.getAttribute("state"))}_isDisabled(){return this.hasAttribute("disabled")||this._state()==="loading"}_isInteractive(){const t=(this.getAttribute("interactive")||"").trim().toLowerCase();return t==="false"||t==="0"||t==="off"?!1:!this._isDisabled()}_showLegend(){const t=(this.getAttribute("show-legend")||"").trim().toLowerCase();return t?t!=="false"&&t!=="0"&&t!=="off":!0}_showSummary(){const t=(this.getAttribute("show-summary")||"").trim().toLowerCase();return t?t!=="false"&&t!=="0"&&t!=="off":!0}_primarySeries(t){return t.series[0]||null}_valuePrefix(){return this.getAttribute("value-prefix")||""}_valueSuffix(){return this.getAttribute("value-suffix")||""}_resolveStats(t){const e=t.map(u=>u.value),a=e.reduce((u,T)=>u+T,0),r=e.length?a/e.length:0,i=e.length?Math.min(...e):0,o=e.length?Math.max(...e):0,s=e.length>1?e[e.length-1]-e[0]:0,n=e[0]||0,d=n!==0?s/Math.abs(n)*100:null;return{total:a,average:r,min:i,max:o,delta:s,deltaPct:d}}_valueDomain(t,e){const a=!!e?.includeZero,r=e?.fitPadding??.14,i=t.map(u=>u.value);let o=Math.min(...i),s=Math.max(...i);a&&(o=Math.min(0,o),s=Math.max(0,s));let n=s-o;if(n<=0){const u=Math.max(Math.abs(s)*.12,1);o-=u,s+=u,n=s-o}else{const u=n*r;a?(o-=u*.25,s+=u):(o-=u,s+=u),n=s-o}const d=o<=0&&s>=0;return{min:o,max:s,span:n,zeroInDomain:d}}_formatValue(t,e){const a=this._valuePrefix(),r=this._valueSuffix();try{const i=new Intl.NumberFormat(void 0,{maximumFractionDigits:Math.abs(t)>=100?0:1,...e}).format(t);return`${a}${i}${r}`}catch{return`${a}${t.toFixed(Math.abs(t)>=100?0:1)}${r}`}}_seriesTone(t,e){return t.tone||q[e%q.length]||"var(--ui-chart-accent)"}_pointTone(t,e,a){return t.tone||a||q[e%q.length]||"var(--ui-chart-accent)"}_seriesValueDetails(t,e,a){const r=t[a];return e.map((i,o)=>{const s=i.data.find(n=>n.label===r)||null;return{series:i.name,value:s?.value??null,tone:s?.tone||this._seriesTone(i,o)}})}_pointDetail(t,e,a,r){const i=this._primarySeries(e);if(!i)return null;const o=e.labels[t];if(!o)return null;const s=i.data.find(u=>u.label===o)||i.data[t];if(!s)return null;const n=this._resolveStats(i.data),d=this._seriesValueDetails(e.labels,e.series,t);return{index:t,label:o,value:s.value,tone:s.tone||this._seriesTone(i,0),series:i.name,seriesValues:d,type:a,total:n.total,min:n.min,max:n.max,source:r}}_emitPointSelect(t,e,a){const r=this._pointDetail(t,e,this._type(),a);r&&(this.dispatchEvent(new CustomEvent("point-select",{detail:r,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("ui-point-select",{detail:r,bubbles:!0,composed:!0})))}_indexFromTarget(t){const e=t instanceof Element?t.closest("[data-point-index]"):null;if(!e)return null;const a=Number(e.getAttribute("data-point-index"));return!Number.isInteger(a)||a<0?null:a}_setActiveIndex(t,e){this._activeIndex=t,this._activePinned=e,this.requestRender()}_focusIndex(t){const e=this.root.querySelector(`.legend-item[data-point-index="${t}"]`);if(e)try{e.focus({preventScroll:!0})}catch{e.focus()}}_onPointerOver(t){if(!this._isInteractive()||this._activePinned)return;const e=this._indexFromTarget(t.target);e==null||this._activeIndex===e||(this._activeIndex=e,this.requestRender())}_onPointerLeave(){!this._isInteractive()||this._activePinned||this._activeIndex==null||(this._activeIndex=null,this.requestRender())}_onFocusIn(t){if(!this._isInteractive())return;const e=this._indexFromTarget(t.target);e==null||this._activeIndex===e||(this._activeIndex=e,this.requestRender())}_onClick(t){if(!this._isInteractive())return;const e=this._data();if(!e.labels.length||!e.series.length)return;const a=this._indexFromTarget(t.target);if(a==null||a>=e.labels.length)return;const r=!(this._activePinned&&this._activeIndex===a);this._activeIndex=a,this._activePinned=r,this.requestRender(),this._emitPointSelect(a,e,"pointer")}_onKeyDown(t){if(!this._isInteractive())return;const e=this._data();if(!e.labels.length||!e.series.length)return;const r=this._indexFromTarget(t.target)??this._activeIndex??0;if(t.key==="ArrowRight"||t.key==="ArrowDown"){t.preventDefault();const o=M(r+1,0,e.labels.length-1);this._setActiveIndex(o,!0),this._focusIndex(o);return}if(t.key==="ArrowLeft"||t.key==="ArrowUp"){t.preventDefault();const o=M(r-1,0,e.labels.length-1);this._setActiveIndex(o,!0),this._focusIndex(o);return}if(t.key==="Home"){t.preventDefault(),this._setActiveIndex(0,!0),this._focusIndex(0);return}if(t.key==="End"){t.preventDefault();const o=e.labels.length-1;this._setActiveIndex(o,!0),this._focusIndex(o);return}if(t.key==="Escape"){if(!this._activePinned&&this._activeIndex==null)return;t.preventDefault(),this._setActiveIndex(null,!1);return}if(t.key!=="Enter"&&t.key!==" ")return;t.preventDefault();const i=M(r,0,e.labels.length-1);this._setActiveIndex(i,!0),this._emitPointSelect(i,e,"keyboard")}_axisXLabels(t){if(t.length<=8)return t.map(()=>"visible");const e=Math.max(1,Math.ceil(t.length/6));return t.map((a,r)=>r===0||r===t.length-1||r%e===0?"visible":"hidden")}_buildCartesianTicks(t,e){return[1,.75,.5,.25,0].map(a=>this._formatValue(t+(e-t)*a))}_plotCartesian(t,e,a){const $=t.labels,P=t.series,w=e==="bar",b=P.flatMap(g=>g.data.map(x=>x.value)),_=this._valueDomain(b.map((g,x)=>({label:String(x),value:g})),{includeZero:w}),F=_.min,l=_.max,v=_.span,f=$.length>1?208/($.length-1):0,S=_.zeroInDomain?0:F,h=6+(l-S)/v*48,k=[0,.25,.5,.75,1].map(g=>{const x=6+48*g,I=_.zeroInDomain&&Math.abs(x-h)<.5;return`<line x1="8" y1="${x.toFixed(2)}" x2="${216 .toFixed(2)}" y2="${x.toFixed(2)}" stroke="var(--ui-chart-grid)" stroke-width="${I?"0.75":"0.45"}" />`}).join(""),L=P.map(g=>new Map(g.data.map(x=>[x.label,x]))),j=$.map((g,x)=>{const I=8+f*x,D=L.map(z=>z.get(g)).filter(z=>!!z).map(z=>6+(l-z.value)/v*48),C=D.length?Math.min(...D):6+48/2;return{xPct:M(I/220*100,0,100),yPct:M(C/64*100,0,100)}}),E=$.map((g,x)=>{const I=j[x];return`<button type="button" class="plot-hit" data-role="plot-hit" data-point-index="${x}" data-active="${a===x?"true":"false"}" style="--x:${I.xPct.toFixed(3)};--y:${I.yPct.toFixed(3)};" aria-label="${c(g)}" ${this._isInteractive()?"":"disabled"}></button>`}).join("");if(e==="bar"){const g=208/Math.max(1,$.length),x=M(g*.82,6,22),I=x/Math.max(1,P.length),D=P.map((C,z)=>{const N=this._seriesTone(C,z);return $.map((O,H)=>{const W=L[z].get(O);if(!W)return"";const m=8+H*g+(g-x)/2+I*z,y=6+(l-W.value)/v*48,A=Math.min(y,h),R=Math.max(1,Math.abs(h-y)),B=a===H,Y=a==null||B?C.opacity??1:.72;return`<rect x="${m.toFixed(2)}" y="${A.toFixed(2)}" width="${Math.max(2,I-1).toFixed(2)}" height="${R.toFixed(2)}" rx="1.4" fill="${c(N)}" opacity="${Y}" />`}).join("")}).join("");return{svg:`
|
|
617
617
|
<svg class="plot" part="plot" viewBox="0 0 220 64" width="100%" height="100%" role="img" aria-label="${c(this._ariaLabel())}" preserveAspectRatio="none">
|
|
618
618
|
<g class="plot-grid">${k}</g>
|
|
619
619
|
${D}
|
package/dist/chart.esm.js
CHANGED
|
@@ -5,11 +5,11 @@ const V = 180, Z = `
|
|
|
5
5
|
--ui-chart-surface: color-mix(in srgb, var(--ui-color-surface, #ffffff) 97%, #ffffff 3%);
|
|
6
6
|
--ui-chart-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 74%, transparent);
|
|
7
7
|
--ui-chart-text: var(--ui-color-text, #0f172a);
|
|
8
|
-
--ui-chart-muted: var(--ui-color-muted, #
|
|
8
|
+
--ui-chart-muted: var(--ui-color-muted, #526175);
|
|
9
9
|
--ui-chart-grid: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 45%, transparent);
|
|
10
10
|
--ui-chart-accent: var(--ui-color-primary, #2563eb);
|
|
11
|
-
--ui-chart-success: var(--ui-color-success, #
|
|
12
|
-
--ui-chart-warning: var(--ui-color-warning, #
|
|
11
|
+
--ui-chart-success: var(--ui-color-success, #15803d);
|
|
12
|
+
--ui-chart-warning: var(--ui-color-warning, #b45309);
|
|
13
13
|
--ui-chart-danger: var(--ui-color-danger, #dc2626);
|
|
14
14
|
--ui-chart-radius: 16px;
|
|
15
15
|
--ui-chart-shadow: none;
|
|
@@ -616,10 +616,10 @@ const V = 180, Z = `
|
|
|
616
616
|
}
|
|
617
617
|
`, q = [
|
|
618
618
|
"var(--ui-color-primary, #2563eb)",
|
|
619
|
-
"var(--ui-color-success, #
|
|
620
|
-
"var(--ui-color-warning, #
|
|
619
|
+
"var(--ui-color-success, #15803d)",
|
|
620
|
+
"var(--ui-color-warning, #b45309)",
|
|
621
621
|
"var(--ui-color-danger, #dc2626)",
|
|
622
|
-
"var(--ui-color-info, #
|
|
622
|
+
"var(--ui-color-info, #0e7490)",
|
|
623
623
|
"var(--ui-color-accent, #7c3aed)"
|
|
624
624
|
];
|
|
625
625
|
function c(p) {
|
package/dist/checkbox.cjs.js
CHANGED
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
--ui-checkbox-disabled-bg: color-mix(in srgb, var(--ui-color-surface-alt, #f1f5f9) 88%, #ffffff 12%);
|
|
19
19
|
--ui-checkbox-disabled-border: 1.5px solid color-mix(in srgb, var(--ui-color-border, #cbd5e1) 78%, transparent);
|
|
20
20
|
--ui-checkbox-label-color: var(--ui-color-text, var(--ui-text, #0f172a));
|
|
21
|
-
--ui-checkbox-muted: var(--ui-color-muted, #
|
|
21
|
+
--ui-checkbox-muted: var(--ui-color-muted, #526175);
|
|
22
22
|
--ui-checkbox-duration: 170ms;
|
|
23
23
|
--ui-checkbox-easing: cubic-bezier(0.2, 0.8, 0.2, 1);
|
|
24
24
|
|
|
@@ -321,7 +321,7 @@
|
|
|
321
321
|
--ui-checkbox-label-color: CanvasText;
|
|
322
322
|
}
|
|
323
323
|
}
|
|
324
|
-
`;function r(t){return t!==null&&t.toLowerCase()!=="false"&&t!=="0"}function d(t){return t instanceof HTMLElement?!!t.closest('a, button, input, select, textarea, [contenteditable="true"], [data-ui-checkbox-no-toggle]'):!1}class c extends s.ElementBase{constructor(){super(),this._uid=`ui-checkbox-${Math.random().toString(36).slice(2,9)}`,this._onClick=this._onClick.bind(this),this._onKeyDown=this._onKeyDown.bind(this)}static get observedAttributes(){return["checked","disabled","indeterminate","headless","loading","invalid","tabindex"]}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this._onClick),this.addEventListener("keydown",this._onKeyDown),this._syncA11yState()}disconnectedCallback(){this.removeEventListener("click",this._onClick),this.removeEventListener("keydown",this._onKeyDown),super.disconnectedCallback()}attributeChangedCallback(e,i,o){if(i!==o){if(e==="tabindex"){this._syncA11yState();return}this.requestRender()}}get checked(){return r(this.getAttribute("checked"))}set checked(e){const i=!!e;i!==this.checked&&(i?this.setAttribute("checked",""):this.removeAttribute("checked"))}get indeterminate(){return r(this.getAttribute("indeterminate"))}set indeterminate(e){const i=!!e;i!==this.indeterminate&&(i?this.setAttribute("indeterminate",""):this.removeAttribute("indeterminate"))}get disabled(){return r(this.getAttribute("disabled"))}set disabled(e){const i=!!e;i!==this.disabled&&(i?this.setAttribute("disabled",""):this.removeAttribute("disabled"))}get loading(){return r(this.getAttribute("loading"))}set loading(e){const i=!!e;i!==this.loading&&(i?this.setAttribute("loading",""):this.removeAttribute("loading"))}get headless(){return this.hasAttribute("headless")}set headless(e){e!==this.headless&&(e?this.setAttribute("headless",""):this.removeAttribute("headless"))}get invalid(){return r(this.getAttribute("invalid"))}set invalid(e){const i=!!e;i!==this.invalid&&(i?this.setAttribute("invalid",""):this.removeAttribute("invalid"))}get density(){return this.getAttribute("density")||"default"}set density(e){const i=(e||"").trim().toLowerCase();if(!i||i==="default"){this.removeAttribute("density");return}this.setAttribute("density",i)}get preset(){return this.getAttribute("preset")||"default"}set preset(e){const i=(e||"").trim().toLowerCase();if(!i||i==="default"){this.removeAttribute("preset");return}this.setAttribute("preset",i)}_syncA11yState(){const e=this.indeterminate?"mixed":this.checked?"true":"false",i=this.disabled||this.loading,o=i?"-1":this.getAttribute("tabindex")||"0",a=`${this._uid}-label`;this.setAttribute("role","checkbox"),this.setAttribute("aria-checked",e),this.setAttribute("aria-disabled",i?"true":"false"),this.setAttribute("aria-busy",this.loading?"true":"false"),this.invalid?this.setAttribute("aria-invalid","true"):this.removeAttribute("aria-invalid"),this.
|
|
324
|
+
`;function r(t){return t!==null&&t.toLowerCase()!=="false"&&t!=="0"}function d(t){return t instanceof HTMLElement?!!t.closest('a, button, input, select, textarea, [contenteditable="true"], [data-ui-checkbox-no-toggle]'):!1}class c extends s.ElementBase{constructor(){super(),this._uid=`ui-checkbox-${Math.random().toString(36).slice(2,9)}`,this._onClick=this._onClick.bind(this),this._onKeyDown=this._onKeyDown.bind(this)}static get observedAttributes(){return["checked","disabled","indeterminate","headless","loading","invalid","tabindex"]}connectedCallback(){super.connectedCallback(),this.addEventListener("click",this._onClick),this.addEventListener("keydown",this._onKeyDown),this._syncA11yState()}disconnectedCallback(){this.removeEventListener("click",this._onClick),this.removeEventListener("keydown",this._onKeyDown),super.disconnectedCallback()}attributeChangedCallback(e,i,o){if(i!==o){if(e==="tabindex"){this._syncA11yState();return}this.requestRender()}}get checked(){return r(this.getAttribute("checked"))}set checked(e){const i=!!e;i!==this.checked&&(i?this.setAttribute("checked",""):this.removeAttribute("checked"))}get indeterminate(){return r(this.getAttribute("indeterminate"))}set indeterminate(e){const i=!!e;i!==this.indeterminate&&(i?this.setAttribute("indeterminate",""):this.removeAttribute("indeterminate"))}get disabled(){return r(this.getAttribute("disabled"))}set disabled(e){const i=!!e;i!==this.disabled&&(i?this.setAttribute("disabled",""):this.removeAttribute("disabled"))}get loading(){return r(this.getAttribute("loading"))}set loading(e){const i=!!e;i!==this.loading&&(i?this.setAttribute("loading",""):this.removeAttribute("loading"))}get headless(){return this.hasAttribute("headless")}set headless(e){e!==this.headless&&(e?this.setAttribute("headless",""):this.removeAttribute("headless"))}get invalid(){return r(this.getAttribute("invalid"))}set invalid(e){const i=!!e;i!==this.invalid&&(i?this.setAttribute("invalid",""):this.removeAttribute("invalid"))}get density(){return this.getAttribute("density")||"default"}set density(e){const i=(e||"").trim().toLowerCase();if(!i||i==="default"){this.removeAttribute("density");return}this.setAttribute("density",i)}get preset(){return this.getAttribute("preset")||"default"}set preset(e){const i=(e||"").trim().toLowerCase();if(!i||i==="default"){this.removeAttribute("preset");return}this.setAttribute("preset",i)}_syncA11yState(){const e=this.indeterminate?"mixed":this.checked?"true":"false",i=this.disabled||this.loading,o=i?"-1":this.getAttribute("tabindex")||"0",a=`${this._uid}-label`;this.setAttribute("role","checkbox"),this.setAttribute("aria-checked",e),this.setAttribute("aria-disabled",i?"true":"false"),this.setAttribute("aria-busy",this.loading?"true":"false"),this.invalid?this.setAttribute("aria-invalid","true"):this.removeAttribute("aria-invalid"),this.getAttribute("aria-labelledby")===a&&this.removeAttribute("aria-labelledby"),this.setAttribute("tabindex",o)}_toggleFromUser(){if(this.disabled||this.loading)return;this.indeterminate?(this.indeterminate=!1,this.checked=!0):this.checked=!this.checked;const e={checked:this.checked,indeterminate:this.indeterminate};this.dispatchEvent(new CustomEvent("input",{detail:e,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("change",{detail:e,bubbles:!0,composed:!0}))}_onClick(e){this.disabled||this.loading||e.composedPath().some(o=>d(o))||this._toggleFromUser()}_onKeyDown(e){this.disabled||this.loading||e.key!==" "&&e.key!=="Enter"||(e.preventDefault(),this._toggleFromUser())}render(){this._syncA11yState(),this.setContent(`
|
|
325
325
|
<style>${n}</style>
|
|
326
326
|
<span class="row" part="root">
|
|
327
327
|
<span class="control-wrap" part="hit-area" aria-hidden="true">
|
package/dist/checkbox.esm.js
CHANGED
|
@@ -19,7 +19,7 @@ const s = `
|
|
|
19
19
|
--ui-checkbox-disabled-bg: color-mix(in srgb, var(--ui-color-surface-alt, #f1f5f9) 88%, #ffffff 12%);
|
|
20
20
|
--ui-checkbox-disabled-border: 1.5px solid color-mix(in srgb, var(--ui-color-border, #cbd5e1) 78%, transparent);
|
|
21
21
|
--ui-checkbox-label-color: var(--ui-color-text, var(--ui-text, #0f172a));
|
|
22
|
-
--ui-checkbox-muted: var(--ui-color-muted, #
|
|
22
|
+
--ui-checkbox-muted: var(--ui-color-muted, #526175);
|
|
23
23
|
--ui-checkbox-duration: 170ms;
|
|
24
24
|
--ui-checkbox-easing: cubic-bezier(0.2, 0.8, 0.2, 1);
|
|
25
25
|
|
|
@@ -416,7 +416,7 @@ class d extends a {
|
|
|
416
416
|
}
|
|
417
417
|
_syncA11yState() {
|
|
418
418
|
const e = this.indeterminate ? "mixed" : this.checked ? "true" : "false", i = this.disabled || this.loading, o = i ? "-1" : this.getAttribute("tabindex") || "0", c = `${this._uid}-label`;
|
|
419
|
-
this.setAttribute("role", "checkbox"), this.setAttribute("aria-checked", e), this.setAttribute("aria-disabled", i ? "true" : "false"), this.setAttribute("aria-busy", this.loading ? "true" : "false"), this.invalid ? this.setAttribute("aria-invalid", "true") : this.removeAttribute("aria-invalid"), this.
|
|
419
|
+
this.setAttribute("role", "checkbox"), this.setAttribute("aria-checked", e), this.setAttribute("aria-disabled", i ? "true" : "false"), this.setAttribute("aria-busy", this.loading ? "true" : "false"), this.invalid ? this.setAttribute("aria-invalid", "true") : this.removeAttribute("aria-invalid"), this.getAttribute("aria-labelledby") === c && this.removeAttribute("aria-labelledby"), this.setAttribute("tabindex", o);
|
|
420
420
|
}
|
|
421
421
|
_toggleFromUser() {
|
|
422
422
|
if (this.disabled || this.loading) return;
|
package/dist/collapsible.cjs.js
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
--ui-collapsible-surface: color-mix(in srgb, var(--ui-color-surface, #ffffff) 98%, #ffffff 2%);
|
|
5
5
|
--ui-collapsible-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 76%, transparent);
|
|
6
6
|
--ui-collapsible-text: var(--ui-color-text, #0f172a);
|
|
7
|
-
--ui-collapsible-muted: var(--ui-color-muted, #
|
|
7
|
+
--ui-collapsible-muted: var(--ui-color-muted, #526175);
|
|
8
8
|
--ui-collapsible-accent: var(--ui-color-primary, #2563eb);
|
|
9
9
|
--ui-collapsible-radius: 14px;
|
|
10
10
|
--ui-collapsible-shadow: none;
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
:host([tone="neutral"]) {
|
|
38
|
-
--ui-collapsible-accent: color-mix(in srgb, var(--ui-color-muted, #
|
|
38
|
+
--ui-collapsible-accent: color-mix(in srgb, var(--ui-color-muted, #526175) 82%, var(--ui-color-text, #0f172a) 18%);
|
|
39
39
|
}
|
|
40
40
|
|
|
41
41
|
:host([tone="info"]) {
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
}
|
|
44
44
|
|
|
45
45
|
:host([tone="success"]) {
|
|
46
|
-
--ui-collapsible-accent: var(--ui-color-success, #
|
|
46
|
+
--ui-collapsible-accent: var(--ui-color-success, #15803d);
|
|
47
47
|
}
|
|
48
48
|
|
|
49
49
|
:host([tone="warning"]) {
|
|
50
|
-
--ui-collapsible-accent: var(--ui-color-warning, #
|
|
50
|
+
--ui-collapsible-accent: var(--ui-color-warning, #b45309);
|
|
51
51
|
}
|
|
52
52
|
|
|
53
53
|
:host([tone="danger"]) {
|
|
@@ -59,7 +59,7 @@
|
|
|
59
59
|
}
|
|
60
60
|
|
|
61
61
|
:host([state="success"]) {
|
|
62
|
-
--ui-collapsible-accent: var(--ui-color-success, #
|
|
62
|
+
--ui-collapsible-accent: var(--ui-color-success, #15803d);
|
|
63
63
|
}
|
|
64
64
|
|
|
65
65
|
.shell {
|
|
@@ -259,7 +259,7 @@
|
|
|
259
259
|
}
|
|
260
260
|
|
|
261
261
|
:host([state="loading"]) .state-note {
|
|
262
|
-
color: var(--ui-color-warning, #
|
|
262
|
+
color: var(--ui-color-warning, #b45309);
|
|
263
263
|
}
|
|
264
264
|
|
|
265
265
|
:host([state="error"]) .state-note {
|
|
@@ -267,7 +267,7 @@
|
|
|
267
267
|
}
|
|
268
268
|
|
|
269
269
|
:host([state="success"]) .state-note {
|
|
270
|
-
color: var(--ui-color-success, #
|
|
270
|
+
color: var(--ui-color-success, #15803d);
|
|
271
271
|
}
|
|
272
272
|
|
|
273
273
|
:host([headless]) .shell {
|
package/dist/collapsible.esm.js
CHANGED
|
@@ -5,7 +5,7 @@ const m = `
|
|
|
5
5
|
--ui-collapsible-surface: color-mix(in srgb, var(--ui-color-surface, #ffffff) 98%, #ffffff 2%);
|
|
6
6
|
--ui-collapsible-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 76%, transparent);
|
|
7
7
|
--ui-collapsible-text: var(--ui-color-text, #0f172a);
|
|
8
|
-
--ui-collapsible-muted: var(--ui-color-muted, #
|
|
8
|
+
--ui-collapsible-muted: var(--ui-color-muted, #526175);
|
|
9
9
|
--ui-collapsible-accent: var(--ui-color-primary, #2563eb);
|
|
10
10
|
--ui-collapsible-radius: 14px;
|
|
11
11
|
--ui-collapsible-shadow: none;
|
|
@@ -36,7 +36,7 @@ const m = `
|
|
|
36
36
|
}
|
|
37
37
|
|
|
38
38
|
:host([tone="neutral"]) {
|
|
39
|
-
--ui-collapsible-accent: color-mix(in srgb, var(--ui-color-muted, #
|
|
39
|
+
--ui-collapsible-accent: color-mix(in srgb, var(--ui-color-muted, #526175) 82%, var(--ui-color-text, #0f172a) 18%);
|
|
40
40
|
}
|
|
41
41
|
|
|
42
42
|
:host([tone="info"]) {
|
|
@@ -44,11 +44,11 @@ const m = `
|
|
|
44
44
|
}
|
|
45
45
|
|
|
46
46
|
:host([tone="success"]) {
|
|
47
|
-
--ui-collapsible-accent: var(--ui-color-success, #
|
|
47
|
+
--ui-collapsible-accent: var(--ui-color-success, #15803d);
|
|
48
48
|
}
|
|
49
49
|
|
|
50
50
|
:host([tone="warning"]) {
|
|
51
|
-
--ui-collapsible-accent: var(--ui-color-warning, #
|
|
51
|
+
--ui-collapsible-accent: var(--ui-color-warning, #b45309);
|
|
52
52
|
}
|
|
53
53
|
|
|
54
54
|
:host([tone="danger"]) {
|
|
@@ -60,7 +60,7 @@ const m = `
|
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
:host([state="success"]) {
|
|
63
|
-
--ui-collapsible-accent: var(--ui-color-success, #
|
|
63
|
+
--ui-collapsible-accent: var(--ui-color-success, #15803d);
|
|
64
64
|
}
|
|
65
65
|
|
|
66
66
|
.shell {
|
|
@@ -260,7 +260,7 @@ const m = `
|
|
|
260
260
|
}
|
|
261
261
|
|
|
262
262
|
:host([state="loading"]) .state-note {
|
|
263
|
-
color: var(--ui-color-warning, #
|
|
263
|
+
color: var(--ui-color-warning, #b45309);
|
|
264
264
|
}
|
|
265
265
|
|
|
266
266
|
:host([state="error"]) .state-note {
|
|
@@ -268,7 +268,7 @@ const m = `
|
|
|
268
268
|
}
|
|
269
269
|
|
|
270
270
|
:host([state="success"]) .state-note {
|
|
271
|
-
color: var(--ui-color-success, #
|
|
271
|
+
color: var(--ui-color-success, #15803d);
|
|
272
272
|
}
|
|
273
273
|
|
|
274
274
|
:host([headless]) .shell {
|
package/dist/color-picker.cjs.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const O=require("./ElementBase-EV6mVBUV.js"),_=require("./date-time-utils-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const O=require("./ElementBase-EV6mVBUV.js"),_=require("./date-time-utils-BzfTpeU-.js");function g(s,t,e){return Math.max(t,Math.min(e,s))}function m(s,t=3){const e=10**t;return Math.round(s*e)/e}function A(s){return g(Math.round(s),0,255)}function D(s){const t=s.trim();if(!t)return null;if(t.endsWith("%")){const r=Number(t.slice(0,-1));return Number.isFinite(r)?g(r/100,0,1):null}const e=Number(t);return Number.isFinite(e)?g(e,0,1):null}function C(s){const t=s.trim();if(!t)return null;if(t.endsWith("%")){const r=Number(t.slice(0,-1));return Number.isFinite(r)?A(g(r,0,100)/100*255):null}const e=Number(t);return Number.isFinite(e)?A(e):null}function B(s){const t=s.trim();if(!t.endsWith("%"))return null;const e=Number(t.slice(0,-1));return Number.isFinite(e)?g(e,0,100):null}function F(s){const t=s.trim().toLowerCase();if(!t)return null;if(t.endsWith("deg")){const r=Number(t.slice(0,-3));return Number.isFinite(r)?x(r):null}if(t.endsWith("turn")){const r=Number(t.slice(0,-4));return Number.isFinite(r)?x(r*360):null}if(t.endsWith("rad")){const r=Number(t.slice(0,-3));return Number.isFinite(r)?x(r*180/Math.PI):null}const e=Number(t);return Number.isFinite(e)?x(e):null}function x(s){const t=s%360;return t<0?t+360:t}function T(s){const t=s.trim();if(!t)return null;if(t.includes("/")){const[r,i]=t.split("/");if(i==null)return null;const a=r.includes(",")?r.split(","):r.trim().split(/\s+/);return a.length<3?null:{channels:a.map(n=>n.trim()).filter(Boolean),alpha:i.trim()}}if(t.includes(",")){const r=t.split(",").map(i=>i.trim()).filter(Boolean);return r.length<3?null:{channels:r.slice(0,3),alpha:r[3]??null}}const e=t.split(/\s+/).map(r=>r.trim()).filter(Boolean);return e.length<3?null:{channels:e.slice(0,3),alpha:e[3]??null}}function U(s){const t=s.trim().replace(/^#/,"");if(![3,4,6,8].includes(t.length)||!/^[0-9a-f]+$/i.test(t))return null;if(t.length===3||t.length===4){const n=parseInt(t[0]+t[0],16),o=parseInt(t[1]+t[1],16),l=parseInt(t[2]+t[2],16),c=t.length===4?parseInt(t[3]+t[3],16)/255:1;return b({r:n,g:o,b:l,a:c})}const e=parseInt(t.slice(0,2),16),r=parseInt(t.slice(2,4),16),i=parseInt(t.slice(4,6),16),a=t.length===8?parseInt(t.slice(6,8),16)/255:1;return b({r:e,g:r,b:i,a})}function N(s){const t=/^rgba?\((.+)\)$/i.exec(s.trim());if(!t)return null;const e=T(t[1]);if(!e||e.channels.length<3)return null;const r=C(e.channels[0]),i=C(e.channels[1]),a=C(e.channels[2]);if(r==null||i==null||a==null)return null;const n=e.alpha!=null?D(e.alpha):1;return n==null?null:b({r,g:i,b:a,a:n})}function V(s){const t=/^hsla?\((.+)\)$/i.exec(s.trim());if(!t)return null;const e=T(t[1]);if(!e||e.channels.length<3)return null;const r=F(e.channels[0]),i=B(e.channels[1]),a=B(e.channels[2]);if(r==null||i==null||a==null)return null;const n=e.alpha!=null?D(e.alpha):1;return n==null?null:$({h:r,s:i,l:a,a:n})}function b(s){return{r:A(s.r),g:A(s.g),b:A(s.b),a:m(g(s.a,0,1),4)}}function f(s){const t=(s||"").trim();return t?t.startsWith("#")?U(t):/^rgba?\(/i.test(t)?N(t):/^hsla?\(/i.test(t)?V(t):null:null}function W(s,t=!1){const e=b(s),r=a=>a.toString(16).padStart(2,"0"),i=`#${r(e.r)}${r(e.g)}${r(e.b)}`;return t?`${i}${r(Math.round(e.a*255))}`:i}function K(s,t=!0){const e=b(s);return!t||e.a>=1?`rgb(${e.r} ${e.g} ${e.b})`:`rgb(${e.r} ${e.g} ${e.b} / ${m(e.a,3)})`}function G(s,t=!0){const e=Math.round(x(s.h)),r=Math.round(g(s.s,0,100)),i=Math.round(g(s.l,0,100)),a=m(g(s.a,0,1),3);return!t||a>=1?`hsl(${e} ${r}% ${i}%)`:`hsl(${e} ${r}% ${i}% / ${a})`}function z(s){const t=b(s),e=t.r/255,r=t.g/255,i=t.b/255,a=Math.max(e,r,i),n=Math.min(e,r,i),o=a-n;let l=0;o!==0&&(a===e?l=(r-i)/o%6:a===r?l=(i-e)/o+2:l=(e-r)/o+4,l*=60,l<0&&(l+=360));const c=a===0?0:o/a*100,p=a*100;return{h:m(l,3),s:m(c,3),v:m(p,3),a:t.a}}function X(s){const t=x(s.h),e=g(s.s,0,100)/100,r=g(s.v,0,100)/100,i=r*e,a=i*(1-Math.abs(t/60%2-1)),n=r-i;let o=0,l=0,c=0;return t<60?(o=i,l=a):t<120?(o=a,l=i):t<180?(l=i,c=a):t<240?(l=a,c=i):t<300?(o=a,c=i):(o=i,c=a),b({r:(o+n)*255,g:(l+n)*255,b:(c+n)*255,a:s.a})}function M(s){const t=b(s),e=t.r/255,r=t.g/255,i=t.b/255,a=Math.max(e,r,i),n=Math.min(e,r,i),o=a-n,l=(a+n)/2;let c=0,p=0;return o!==0&&(p=o/(1-Math.abs(2*l-1)),a===e?c=(r-i)/o%6:a===r?c=(i-e)/o+2:c=(e-r)/o+4,c*=60,c<0&&(c+=360)),{h:m(c,3),s:m(p*100,3),l:m(l*100,3),a:t.a}}function $(s){const t=x(s.h),e=g(s.s,0,100)/100,r=g(s.l,0,100)/100,i=(1-Math.abs(2*r-1))*e,a=i*(1-Math.abs(t/60%2-1)),n=r-i/2;let o=0,l=0,c=0;return t<60?(o=i,l=a):t<120?(o=a,l=i):t<180?(l=i,c=a):t<240?(l=a,c=i):t<300?(o=a,c=i):(o=i,c=a),b({r:(o+n)*255,g:(l+n)*255,b:(c+n)*255,a:s.a})}function y(s,t){return W(s,t).toUpperCase()}function k(s,t){return K(s,t)}function Y(s,t){return G(M(s),t)}const I="#2563eb",L="editora:ui-color-picker:recent",j=`
|
|
2
2
|
<svg viewBox="0 0 20 20" aria-hidden="true" focusable="false">
|
|
3
3
|
<path d="m5.6 7.6 4.4 4.6 4.4-4.6" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>
|
|
4
4
|
</svg>
|
|
@@ -7,10 +7,10 @@
|
|
|
7
7
|
--ui-cp-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 96%, transparent);
|
|
8
8
|
--ui-cp-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 74%, transparent);
|
|
9
9
|
--ui-cp-text: var(--ui-color-text, #0f172a);
|
|
10
|
-
--ui-cp-muted: var(--ui-color-muted, #
|
|
10
|
+
--ui-cp-muted: var(--ui-color-muted, #526175);
|
|
11
11
|
--ui-cp-accent: var(--ui-color-primary, #2563eb);
|
|
12
|
-
--ui-cp-success: var(--ui-color-success, #
|
|
13
|
-
--ui-cp-warning: var(--ui-color-warning, #
|
|
12
|
+
--ui-cp-success: var(--ui-color-success, #15803d);
|
|
13
|
+
--ui-cp-warning: var(--ui-color-warning, #b45309);
|
|
14
14
|
--ui-cp-danger: var(--ui-color-danger, #dc2626);
|
|
15
15
|
--ui-cp-radius: 14px;
|
|
16
16
|
--ui-cp-shadow: none;
|
|
@@ -319,11 +319,15 @@
|
|
|
319
319
|
}
|
|
320
320
|
|
|
321
321
|
.sv:focus-visible,
|
|
322
|
-
.slider:focus-visible {
|
|
322
|
+
.slider:focus-visible::after {
|
|
323
323
|
outline: 2px solid color-mix(in srgb, var(--ui-cp-accent) 64%, transparent);
|
|
324
324
|
outline-offset: 1px;
|
|
325
325
|
}
|
|
326
326
|
|
|
327
|
+
.slider:focus-visible {
|
|
328
|
+
outline: none;
|
|
329
|
+
}
|
|
330
|
+
|
|
327
331
|
.thumb {
|
|
328
332
|
position: absolute;
|
|
329
333
|
inline-size: 12px;
|
|
@@ -338,19 +342,35 @@
|
|
|
338
342
|
transform: translate3d(0, 0, 0);
|
|
339
343
|
}
|
|
340
344
|
|
|
345
|
+
/* The track is 12px, but the element is 24px tall (WCAG 2.5.8): the padding is the extra hit area,
|
|
346
|
+
the track is painted in the content box and the ring is drawn by ::after over just the track. */
|
|
341
347
|
.slider {
|
|
342
348
|
position: relative;
|
|
349
|
+
box-sizing: content-box;
|
|
343
350
|
block-size: 12px;
|
|
351
|
+
padding-block: 6px;
|
|
344
352
|
border-radius: 999px;
|
|
345
|
-
|
|
353
|
+
background-clip: content-box;
|
|
354
|
+
background-origin: content-box;
|
|
346
355
|
cursor: pointer;
|
|
347
356
|
touch-action: none;
|
|
348
357
|
overflow: visible;
|
|
358
|
+
}
|
|
359
|
+
|
|
360
|
+
.slider::after {
|
|
361
|
+
content: "";
|
|
362
|
+
position: absolute;
|
|
363
|
+
inset-inline: 0;
|
|
364
|
+
inset-block: 6px;
|
|
365
|
+
box-sizing: border-box;
|
|
366
|
+
border-radius: 999px;
|
|
367
|
+
border: 1px solid color-mix(in srgb, var(--ui-cp-border) 82%, transparent);
|
|
349
368
|
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ui-cp-border) 40%, transparent);
|
|
369
|
+
pointer-events: none;
|
|
350
370
|
}
|
|
351
371
|
|
|
352
372
|
.slider.hue {
|
|
353
|
-
background: linear-gradient(to right, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000);
|
|
373
|
+
background-image: linear-gradient(to right, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000);
|
|
354
374
|
}
|
|
355
375
|
|
|
356
376
|
.slider.alpha {
|
|
@@ -686,7 +706,7 @@
|
|
|
686
706
|
max-block-size: min(84vh, 680px);
|
|
687
707
|
overflow: auto;
|
|
688
708
|
}
|
|
689
|
-
`;function
|
|
709
|
+
`;function u(s,t,e){return Math.max(t,Math.min(e,s))}function E(s,t){return Math.abs(s-t)<=5e-4}function S(s){return s.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'")}class q extends O.ElementBase{constructor(){super(),this._syncing=!1,this._initialized=!1,this._rgba=b(f(I)||{r:37,g:99,b:235,a:1}),this._hsva=z(this._rgba),this._format="hex",this._open=!1,this._error="",this._presets=[],this._recentColors=[],this._panelCache=new WeakMap,this._overlay=null,this._overlayRoot=null,this._releaseScrollLock=null,this._restoreFocusEl=null,this._isSheetOpen=!1,this._dragTarget=null,this._dragPointerId=-1,this._dragRect=null,this._dragX=0,this._dragY=0,this._dragRaf=0,this._dragChanged=!1,this._dragSource="drag",this._renderingSwatches=!1,this._scheduleOverlayPosition=_.rafThrottle(()=>this._positionOverlay()),this._onRootClickBound=t=>this._onPanelClick(t,"root"),this._onRootInputBound=t=>this._onPanelInput(t,"root"),this._onRootChangeBound=t=>this._onPanelChange(t,"root"),this._onRootKeyDownBound=t=>this._onPanelKeyDown(t,"root"),this._onRootPointerDownBound=t=>this._onPanelPointerDown(t,"root"),this._onRootPointerMoveBound=t=>this._onPanelPointerMove(t),this._onRootPointerUpBound=t=>this._onPanelPointerUp(t),this._onRootPointerCancelBound=t=>this._onPanelPointerCancel(t),this._onDocumentPointerDownBound=t=>this._onDocumentPointerDown(t),this._onDocumentKeyDownBound=t=>this._onDocumentKeyDown(t),this._onWindowResizeBound=()=>this._scheduleOverlayPosition.run(),this._onWindowScrollBound=t=>{_.eventOriginatesWithin(t,[this._overlay])||this._scheduleOverlayPosition.run()},this._applyValueAttribute(!1),this._applyFormatAttribute(),this._open=this.hasAttribute("open"),this._parsePresetsAttribute()}static get observedAttributes(){return["value","format","alpha","disabled","readonly","size","variant","state","tone","mode","open","close-on-escape","placeholder","presets","recent","max-recent","persist","aria-label","aria-labelledby","aria-describedby"]}connectedCallback(){super.connectedCallback(),this._bindRootEvents(),this._loadRecent(),!this._isPopoverMode()&&this._open&&(this._open=!1,this._syncOpenAttribute(!1))}disconnectedCallback(){this._cancelDragFrame(),this._stopDrag(!1),this._destroyOverlay(),this.root.removeEventListener("click",this._onRootClickBound),this.root.removeEventListener("input",this._onRootInputBound),this.root.removeEventListener("change",this._onRootChangeBound),this.root.removeEventListener("keydown",this._onRootKeyDownBound),this.root.removeEventListener("pointerdown",this._onRootPointerDownBound),this.root.removeEventListener("pointermove",this._onRootPointerMoveBound),this.root.removeEventListener("pointerup",this._onRootPointerUpBound),this.root.removeEventListener("pointercancel",this._onRootPointerCancelBound),super.disconnectedCallback()}attributeChangedCallback(t,e,r){if(e!==r){switch(t){case"value":this._syncing||this._applyValueAttribute(!0);break;case"format":this._applyFormatAttribute();break;case"presets":this._parsePresetsAttribute();break;case"open":this._syncing||(this._open=this.hasAttribute("open"));break;case"disabled":case"state":(this.hasAttribute("disabled")||this._isLoading())&&this._open&&this._setOpen(!1,"attribute");break;case"alpha":{this._alphaEnabled()||(this._rgba=b({...this._rgba,a:1}),this._hsva={...this._hsva,a:1},this._syncValueAttribute());break}}this.isConnected&&this.requestRender()}}get value(){return this.getAttribute("value")||this._serializeValue()}set value(t){this.setColor(t)}get format(){return this._format}set format(t){this.setAttribute("format",t)}get alpha(){return this._alphaEnabled()}set alpha(t){t?this.setAttribute("alpha",""):this.removeAttribute("alpha")}get open(){return this._open}set open(t){this._setOpen(t,"api")}setColor(t){const e=f(t||"");if(!e){this._setInvalid(t,"Invalid color format");return}this._error="",this._applyRgba(e,!1),this._syncValueAttribute(),this._updateUI(!1)}getColor(){const t=b(this._rgba);return{hex:y(t,this._alphaEnabled()),rgba:t,hsva:{...this._hsva}}}openPopover(){this._setOpen(!0,"api")}closePopover(){this._setOpen(!1,"api")}focus(){const t=this.root.querySelector(".trigger"),e=this.root.querySelector('[data-cp="sv"]');(t||e||this).focus()}render(){this._initialized||(this._initialized=!0,this.setContent(this._buildTemplate(),{force:!0})),!this._isPopoverMode()&&this._open&&(this._open=!1,this._syncOpenAttribute(!1)),this._isPopoverMode()&&this._open?(this._ensureOverlay(),this._renderOverlayTemplate(),this._scheduleOverlayPosition.run()):this._destroyOverlay(),this._updateUI(!1)}_bindRootEvents(){this.root.removeEventListener("click",this._onRootClickBound),this.root.removeEventListener("input",this._onRootInputBound),this.root.removeEventListener("change",this._onRootChangeBound),this.root.removeEventListener("keydown",this._onRootKeyDownBound),this.root.removeEventListener("pointerdown",this._onRootPointerDownBound),this.root.removeEventListener("pointermove",this._onRootPointerMoveBound),this.root.removeEventListener("pointerup",this._onRootPointerUpBound),this.root.removeEventListener("pointercancel",this._onRootPointerCancelBound),this.root.addEventListener("click",this._onRootClickBound),this.root.addEventListener("input",this._onRootInputBound),this.root.addEventListener("change",this._onRootChangeBound),this.root.addEventListener("keydown",this._onRootKeyDownBound),this.root.addEventListener("pointerdown",this._onRootPointerDownBound),this.root.addEventListener("pointermove",this._onRootPointerMoveBound),this.root.addEventListener("pointerup",this._onRootPointerUpBound),this.root.addEventListener("pointercancel",this._onRootPointerCancelBound)}_eventHTMLElement(t){const e=typeof t.composedPath=="function"?t.composedPath():[];for(const i of e)if(i instanceof HTMLElement)return i;const r=t.target;return r instanceof HTMLElement?r:null}_buildTemplate(){return`
|
|
690
710
|
<style>${H}</style>
|
|
691
711
|
<section class="root">
|
|
692
712
|
<div class="trigger-wrap" data-role="trigger-wrap">
|
|
@@ -794,10 +814,10 @@
|
|
|
794
814
|
${this._panelMarkup("overlay")}
|
|
795
815
|
</div>
|
|
796
816
|
</section>
|
|
797
|
-
`,t&&!this._isSheetOpen&&(this._isSheetOpen=!0,this._releaseScrollLock=_.lockBodyScroll()),!t&&this._isSheetOpen&&(this._isSheetOpen=!1,this._releaseScrollLock&&(this._releaseScrollLock(),this._releaseScrollLock=null)))}_isPopoverMode(){return(this.getAttribute("mode")||"inline")==="popover"}_state(){const t=(this.getAttribute("state")||"idle").trim().toLowerCase();return t==="loading"||t==="error"||t==="success"?t:"idle"}_tone(){const t=(this.getAttribute("tone")||"brand").trim().toLowerCase();return t==="neutral"||t==="success"||t==="warning"||t==="danger"?t:"brand"}_closeOnEscape(){return _.isTruthyAttr(this.getAttribute("close-on-escape"),!0)}_syncOverlayHostAttributes(){if(!this._overlay)return;const t=r=>{const i=this.getAttribute(r);i==null?this._overlay.removeAttribute(r):this._overlay.setAttribute(r,i)},e=r=>{this.hasAttribute(r)?this._overlay.setAttribute(r,""):this._overlay.removeAttribute(r)};t("size"),t("variant"),t("state"),t("tone"),t("close-on-escape"),t("aria-label"),t("aria-labelledby"),t("aria-describedby"),e("disabled"),e("readonly")}_isMobileSheet(){return _.shouldUseMobileSheet(this.getAttribute("mode")||"inline")}_alphaEnabled(){return _.isTruthyAttr(this.getAttribute("alpha"),!1)}_recentEnabled(){return _.isTruthyAttr(this.getAttribute("recent"),!0)}_persistRecent(){return _.isTruthyAttr(this.getAttribute("persist"),!1)}_isDisabled(){return this.hasAttribute("disabled")}_isReadonly(){return this.hasAttribute("readonly")}_isLoading(){return this._state()==="loading"}_maxRecent(){const t=Number(this.getAttribute("max-recent")||8);return!Number.isFinite(t)||t<1?8:Math.max(1,Math.min(24,Math.trunc(t)))}_labelText(){return this.getAttribute("aria-label")||"Color picker"}_placeholder(){return this.getAttribute("placeholder")||"Select color"}_applyFormatAttribute(){const t=(this.getAttribute("format")||"hex").trim().toLowerCase();if(t==="rgb"||t==="hsl"||t==="hex"){this._format=t;return}this._format="hex"}_applyValueAttribute(t){const e=this.getAttribute("value");if(!e){this._applyRgba(v(C)||this._rgba,!1);return}const r=v(e);if(!r){t&&this._setInvalid(e,"Unable to parse color value");return}this._error="",this._applyRgba(r,!1)}_parsePresetsAttribute(){const t=this.getAttribute("presets");if(!t){this._presets=["#2563eb","#16a34a","#f59e0b","#dc2626","#7c3aed","#0ea5e9"];return}try{const e=JSON.parse(t);if(!Array.isArray(e)){this._presets=[];return}const r=[];for(const i of e){if(typeof i!="string")continue;const a=v(i);if(!a)continue;const n=y(this._normalizeByAlpha(a),this._alphaEnabled());r.includes(n)||r.push(n)}this._presets=r}catch{this._presets=[]}}_loadRecent(){if(!this._recentEnabled()){this._recentColors=[];return}if(!(!this._persistRecent()||typeof localStorage>"u"))try{const t=localStorage.getItem(L);if(!t)return;const e=JSON.parse(t);if(!Array.isArray(e))return;this._recentColors=e.filter(r=>typeof r=="string").map(r=>v(r)).filter(r=>!!r).map(r=>y(this._normalizeByAlpha(r),this._alphaEnabled())).slice(0,this._maxRecent())}catch{this._recentColors=[]}}_persistRecentColors(){if(!(!this._persistRecent()||typeof localStorage>"u"))try{localStorage.setItem(L,JSON.stringify(this._recentColors))}catch{}}_normalizeByAlpha(t){return this._alphaEnabled()?b(t):b({...t,a:1})}_applyRgba(t,e){const r=this._normalizeByAlpha(t),i=z(r);e&&i.s===0&&(i.h=this._hsva.h),this._rgba=r,this._hsva={h:c(i.h,0,360),s:c(i.s,0,100),v:c(i.v,0,100),a:c(i.a,0,1)}}_serializeValue(t=this._format){return t==="rgb"?k(this._rgba,this._alphaEnabled()):t==="hsl"?Y(this._rgba,this._alphaEnabled()):y(this._rgba,this._alphaEnabled())}_currentHex(){return y(this._rgba,this._alphaEnabled())}_eventDetail(t){return{value:this._serializeValue(),hex:this._currentHex(),rgba:{...this._rgba},hsla:I(this._rgba),source:t}}_emitInput(t){this.dispatchEvent(new CustomEvent("input",{detail:this._eventDetail(t),bubbles:!0,composed:!0}))}_emitChange(t){this.dispatchEvent(new CustomEvent("change",{detail:this._eventDetail(t),bubbles:!0,composed:!0})),this._announce(this._serializeValue())}_setInvalid(t,e){this._error=e,this.dispatchEvent(new CustomEvent("invalid",{detail:{raw:t,reason:e},bubbles:!0,composed:!0})),this._updateUI(!1)}_announce(t){this._forEachPanel(e=>{e.live&&(e.live.textContent=`Color changed to ${t}`)})}_setOpen(t,e="api"){if(!this._isPopoverMode()||t&&(this._isDisabled()||this._isLoading())||this._open===t)return;const r=this._open;this._open=t,this._syncOpenAttribute(t);const i={open:t,previousOpen:r,source:e};if(t?(this._restoreFocusEl=typeof document<"u"?document.activeElement:null,this.dispatchEvent(new CustomEvent("open",{detail:i,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("ui-open",{detail:i,bubbles:!0,composed:!0}))):(this.dispatchEvent(new CustomEvent("close",{detail:i,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("ui-close",{detail:i,bubbles:!0,composed:!0}))),this.requestRender(),!t&&this._restoreFocusEl&&this._restoreFocusEl.isConnected){try{this._restoreFocusEl.focus()}catch{}this._restoreFocusEl=null}t&&queueMicrotask(()=>this._focusFirstOpenControl())}_focusFirstOpenControl(){if(!this._open)return;const e=this._getCurrentPanel()?.querySelector('[data-cp="sv"]');if(e)try{e.focus()}catch{}}_syncValueAttribute(){const t=this._serializeValue();this._syncing=!0;try{this.getAttribute("value")!==t&&this.setAttribute("value",t)}finally{this._syncing=!1}}_syncOpenAttribute(t){this._syncing=!0;try{t?this.hasAttribute("open")||this.setAttribute("open",""):this.hasAttribute("open")&&this.removeAttribute("open")}finally{this._syncing=!1}}_ensureOverlay(){if(this._overlay||typeof document>"u")return;const t=document.createElement("div");t.style.position="fixed",t.style.inset="0",t.style.zIndex="var(--ui-cp-z, 1600)",t.style.pointerEvents="auto";const e=t.attachShadow({mode:"open"});t.addEventListener("click",r=>this._onPanelClick(r,"overlay")),t.addEventListener("input",r=>this._onPanelInput(r,"overlay")),t.addEventListener("change",r=>this._onPanelChange(r,"overlay")),t.addEventListener("keydown",r=>this._onPanelKeyDown(r,"overlay")),t.addEventListener("pointerdown",r=>this._onPanelPointerDown(r,"overlay")),t.addEventListener("pointermove",r=>this._onPanelPointerMove(r)),t.addEventListener("pointerup",r=>this._onPanelPointerUp(r)),t.addEventListener("pointercancel",r=>this._onPanelPointerCancel(r)),document.body.appendChild(t),this._overlay=t,this._overlayRoot=e,this._syncOverlayHostAttributes(),document.addEventListener("pointerdown",this._onDocumentPointerDownBound,!0),document.addEventListener("keydown",this._onDocumentKeyDownBound),window.addEventListener("resize",this._onWindowResizeBound),window.addEventListener("scroll",this._onWindowScrollBound,{passive:!0,capture:!0})}_destroyOverlay(){this._scheduleOverlayPosition.cancel(),typeof document<"u"&&(document.removeEventListener("pointerdown",this._onDocumentPointerDownBound,!0),document.removeEventListener("keydown",this._onDocumentKeyDownBound)),typeof window<"u"&&(window.removeEventListener("resize",this._onWindowResizeBound),window.removeEventListener("scroll",this._onWindowScrollBound,!0)),this._overlay&&this._overlay.parentElement&&this._overlay.parentElement.removeChild(this._overlay),this._overlay=null,this._overlayRoot=null,this._panelCache=new WeakMap,this._isSheetOpen&&(this._isSheetOpen=!1,this._releaseScrollLock&&(this._releaseScrollLock(),this._releaseScrollLock=null))}_positionOverlay(){if(!this._overlayRoot||!this._open||this._isMobileSheet())return;const t=this.root.querySelector(".trigger"),e=this._overlayRoot.querySelector(".popover-shell");if(!t||!e)return;const r=e.querySelector(".panel");if(!r)return;const i=e.getAttribute("data-placement"),a=_.computePopoverPosition(t.getBoundingClientRect(),r.getBoundingClientRect(),8,8,i==="top"?"top":i==="bottom"?"bottom":null);e.style.top=`${Math.round(a.top)}px`,e.style.left=`${Math.round(a.left)}px`,e.setAttribute("data-placement",a.placement)}_onDocumentPointerDown(t){if(!this._overlay||!this._open)return;const e=typeof t.composedPath=="function"?t.composedPath():[];if(e.includes(this))return;const r=this._overlayRoot?.querySelector('[data-cp-panel="overlay"]');r&&e.includes(r)||this._setOpen(!1,"outside")}_onDocumentKeyDown(t){if(!(!this._open||!this._isPopoverMode())){if(t.key==="Tab"){this._trapOverlayFocus(t);return}t.key!=="Escape"||!this._closeOnEscape()||(t.preventDefault(),this._setOpen(!1,"escape"))}}_focusableInPanel(t){const e=t.querySelectorAll('button,[href],input,select,textarea,[tabindex]:not([tabindex="-1"]),[contenteditable="true"]');return Array.from(e).filter(r=>r.hasAttribute("disabled")||r.getAttribute("aria-hidden")==="true"||r.tabIndex<0?!1:r.getClientRects().length>0)}_trapOverlayFocus(t){const e=this._overlayRoot?.querySelector('[data-cp-panel="overlay"]');if(!e)return;const r=this._focusableInPanel(e);if(!r.length){t.preventDefault(),e.focus();return}const i=e.getRootNode(),a=i instanceof ShadowRoot?i.activeElement:e.ownerDocument.activeElement,n=a?r.indexOf(a):-1;if(t.shiftKey){n<=0&&(t.preventDefault(),r[r.length-1].focus());return}(n===-1||n===r.length-1)&&(t.preventDefault(),r[0].focus())}_forEachPanel(t){const e=this.root.querySelector('[data-cp-panel="inline"]');e&&t(this._panelRefs(e));const r=this._overlayRoot?.querySelector('[data-cp-panel="overlay"]');r&&t(this._panelRefs(r))}_panelRefs(t){const e=this._panelCache.get(t);if(e)return e;const r={panel:t,label:t.querySelector('[data-role="label"]'),valueText:t.querySelector('[data-role="value"]'),preview:t.querySelector('[data-role="preview"]'),status:t.querySelector('[data-role="status"]'),sv:t.querySelector('[data-cp="sv"]'),svThumb:t.querySelector('[data-role="sv-thumb"]'),hue:t.querySelector('[data-cp="hue"]'),hueThumb:t.querySelector('[data-role="hue-thumb"]'),alphaRow:t.querySelector('[data-role="alpha-row"]'),alpha:t.querySelector('[data-cp="alpha"]'),alphaThumb:t.querySelector('[data-role="alpha-thumb"]'),tabHex:t.querySelector('[data-format="hex"]'),tabRgb:t.querySelector('[data-format="rgb"]'),tabHsl:t.querySelector('[data-format="hsl"]'),groupHex:t.querySelector('[data-format-group="hex"]'),groupRgb:t.querySelector('[data-format-group="rgb"]'),groupHsl:t.querySelector('[data-format-group="hsl"]'),inputHex:t.querySelector('[data-input="hex"]'),inputR:t.querySelector('[data-input="r"]'),inputG:t.querySelector('[data-input="g"]'),inputB:t.querySelector('[data-input="b"]'),inputA1:t.querySelector('[data-input="a1"]'),inputH:t.querySelector('[data-input="h"]'),inputS:t.querySelector('[data-input="s"]'),inputL:t.querySelector('[data-input="l"]'),inputA2:t.querySelector('[data-input="a2"]'),copyHex:t.querySelector('[data-action="copy-hex"]'),copyRgb:t.querySelector('[data-action="copy-rgb"]'),eyedropper:t.querySelector('[data-action="eyedropper"]'),clear:t.querySelector('[data-action="clear"]'),apply:t.querySelector('[data-action="apply"]'),presets:t.querySelector('[data-role="presets"]'),recent:t.querySelector('[data-role="recent"]'),recentTitle:t.querySelector('[data-role="recent-title"]'),error:t.querySelector('[data-role="error"]'),live:t.querySelector('[data-role="live"]')};return this._panelCache.set(t,r),r}_getCurrentPanel(){return this._isPopoverMode()&&this._open&&this._overlayRoot?this._overlayRoot.querySelector('[data-cp-panel="overlay"]'):this.root.querySelector('[data-cp-panel="inline"]')}_updateUI(t,e=!1){const r=this.root.querySelector('[data-role="trigger-wrap"]'),i=this.root.querySelector(".trigger"),a=this.root.querySelector('[data-role="trigger-value"]'),n=this.root.querySelector('[data-role="trigger-preview"]'),o=this.root.querySelector('[data-role="inline-panel"]'),l=this._isPopoverMode(),u=this._state(),d=this._tone(),f=u==="loading",h=this._isDisabled(),w=this._isReadonly(),M=this._serializeValue()||this._placeholder();r&&(r.hidden=!l),i&&(i.disabled=h||f,i.dataset.state=u,i.dataset.tone=d,i.setAttribute("aria-expanded",l&&this._open?"true":"false"),this._applyAria(i)),a&&(a.textContent=M),n&&(n.style.background=k(this._rgba,!0)),o&&(o.hidden=l),this._forEachPanel(p=>this._updatePanel(p,{skipSwatches:t,disabled:h,readonly:w,loading:f,state:u,tone:d,modePopover:l,liveOnly:e}))}_updatePanel(t,e){const r=this._rgba,i=I(r),a=this._hsva,n=`hsl(${Math.round(a.h)} 100% 50%)`,o=t.panel.getAttribute("data-cp-panel")==="overlay",l=!!this._error||e.state==="error",u=e.disabled||e.readonly||e.loading;if(this._applyAria(t.panel),t.panel.dataset.state=l?"error":e.state,t.panel.dataset.tone=e.tone,t.panel.setAttribute("aria-busy",e.loading?"true":"false"),o&&e.modePopover?(t.panel.setAttribute("role","dialog"),t.panel.setAttribute("aria-modal","true"),t.panel.tabIndex=-1):(t.panel.removeAttribute("role"),t.panel.removeAttribute("aria-modal"),t.panel.removeAttribute("tabindex")),t.label&&(t.label.textContent=this._labelText()),t.valueText&&(t.valueText.textContent=this._serializeValue()),t.preview&&(t.preview.style.background=k(r,!0)),t.status){let p="";l?p="Error":e.state==="loading"?p="Syncing":e.state==="success"&&(p="Saved"),t.status.hidden=!p,t.status.textContent=p,t.status.dataset.tone=e.tone}if(t.sv&&(t.sv.style.background=`linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, ${n})`,t.sv.setAttribute("aria-valuetext",`Saturation ${Math.round(a.s)}%, Value ${Math.round(a.v)}%`),t.sv.setAttribute("aria-disabled",u?"true":"false"),t.sv.tabIndex=u?-1:0),t.svThumb){const p=c(a.s,1,99),R=c(100-a.v,1,99);t.svThumb.style.left=`${p}%`,t.svThumb.style.top=`${R}%`}t.hue&&(t.hue.setAttribute("aria-valuemin","0"),t.hue.setAttribute("aria-valuemax","360"),t.hue.setAttribute("aria-valuenow",String(Math.round(a.h))),t.hue.setAttribute("aria-disabled",u?"true":"false"),t.hue.tabIndex=u?-1:0),t.hueThumb&&(t.hueThumb.style.left=`${c(a.h/360*100,1,99)}%`),t.alphaRow&&(t.alphaRow.hidden=!this._alphaEnabled()),t.alpha&&(t.alpha.setAttribute("aria-valuemin","0"),t.alpha.setAttribute("aria-valuemax","100"),t.alpha.setAttribute("aria-valuenow",String(Math.round(a.a*100))),t.alpha.setAttribute("aria-disabled",u||!this._alphaEnabled()?"true":"false"),t.alpha.tabIndex=u?-1:0,t.alpha.style.backgroundImage=`
|
|
817
|
+
`,t&&!this._isSheetOpen&&(this._isSheetOpen=!0,this._releaseScrollLock=_.lockBodyScroll()),!t&&this._isSheetOpen&&(this._isSheetOpen=!1,this._releaseScrollLock&&(this._releaseScrollLock(),this._releaseScrollLock=null)))}_isPopoverMode(){return(this.getAttribute("mode")||"inline")==="popover"}_state(){const t=(this.getAttribute("state")||"idle").trim().toLowerCase();return t==="loading"||t==="error"||t==="success"?t:"idle"}_tone(){const t=(this.getAttribute("tone")||"brand").trim().toLowerCase();return t==="neutral"||t==="success"||t==="warning"||t==="danger"?t:"brand"}_closeOnEscape(){return _.isTruthyAttr(this.getAttribute("close-on-escape"),!0)}_syncOverlayHostAttributes(){if(!this._overlay)return;const t=r=>{const i=this.getAttribute(r);i==null?this._overlay.removeAttribute(r):this._overlay.setAttribute(r,i)},e=r=>{this.hasAttribute(r)?this._overlay.setAttribute(r,""):this._overlay.removeAttribute(r)};t("size"),t("variant"),t("state"),t("tone"),t("close-on-escape"),t("aria-label"),t("aria-labelledby"),t("aria-describedby"),e("disabled"),e("readonly")}_isMobileSheet(){return _.shouldUseMobileSheet(this.getAttribute("mode")||"inline")}_alphaEnabled(){return _.isTruthyAttr(this.getAttribute("alpha"),!1)}_recentEnabled(){return _.isTruthyAttr(this.getAttribute("recent"),!0)}_persistRecent(){return _.isTruthyAttr(this.getAttribute("persist"),!1)}_isDisabled(){return this.hasAttribute("disabled")}_isReadonly(){return this.hasAttribute("readonly")}_isLoading(){return this._state()==="loading"}_maxRecent(){const t=Number(this.getAttribute("max-recent")||8);return!Number.isFinite(t)||t<1?8:Math.max(1,Math.min(24,Math.trunc(t)))}_labelText(){return this.getAttribute("aria-label")||"Color picker"}_placeholder(){return this.getAttribute("placeholder")||"Select color"}_applyFormatAttribute(){const t=(this.getAttribute("format")||"hex").trim().toLowerCase();if(t==="rgb"||t==="hsl"||t==="hex"){this._format=t;return}this._format="hex"}_applyValueAttribute(t){const e=this.getAttribute("value");if(!e){this._applyRgba(f(I)||this._rgba,!1);return}const r=f(e);if(!r){t&&this._setInvalid(e,"Unable to parse color value");return}this._error="",this._applyRgba(r,!1)}_parsePresetsAttribute(){const t=this.getAttribute("presets");if(!t){this._presets=["#2563eb","#16a34a","#f59e0b","#dc2626","#7c3aed","#0ea5e9"];return}try{const e=JSON.parse(t);if(!Array.isArray(e)){this._presets=[];return}const r=[];for(const i of e){if(typeof i!="string")continue;const a=f(i);if(!a)continue;const n=y(this._normalizeByAlpha(a),this._alphaEnabled());r.includes(n)||r.push(n)}this._presets=r}catch{this._presets=[]}}_loadRecent(){if(!this._recentEnabled()){this._recentColors=[];return}if(!(!this._persistRecent()||typeof localStorage>"u"))try{const t=localStorage.getItem(L);if(!t)return;const e=JSON.parse(t);if(!Array.isArray(e))return;this._recentColors=e.filter(r=>typeof r=="string").map(r=>f(r)).filter(r=>!!r).map(r=>y(this._normalizeByAlpha(r),this._alphaEnabled())).slice(0,this._maxRecent())}catch{this._recentColors=[]}}_persistRecentColors(){if(!(!this._persistRecent()||typeof localStorage>"u"))try{localStorage.setItem(L,JSON.stringify(this._recentColors))}catch{}}_normalizeByAlpha(t){return this._alphaEnabled()?b(t):b({...t,a:1})}_applyRgba(t,e){const r=this._normalizeByAlpha(t),i=z(r);e&&i.s===0&&(i.h=this._hsva.h),this._rgba=r,this._hsva={h:u(i.h,0,360),s:u(i.s,0,100),v:u(i.v,0,100),a:u(i.a,0,1)}}_serializeValue(t=this._format){return t==="rgb"?k(this._rgba,this._alphaEnabled()):t==="hsl"?Y(this._rgba,this._alphaEnabled()):y(this._rgba,this._alphaEnabled())}_currentHex(){return y(this._rgba,this._alphaEnabled())}_eventDetail(t){return{value:this._serializeValue(),hex:this._currentHex(),rgba:{...this._rgba},hsla:M(this._rgba),source:t}}_emitInput(t){this.dispatchEvent(new CustomEvent("input",{detail:this._eventDetail(t),bubbles:!0,composed:!0}))}_emitChange(t){this.dispatchEvent(new CustomEvent("change",{detail:this._eventDetail(t),bubbles:!0,composed:!0})),this._announce(this._serializeValue())}_setInvalid(t,e){this._error=e,this.dispatchEvent(new CustomEvent("invalid",{detail:{raw:t,reason:e},bubbles:!0,composed:!0})),this._updateUI(!1)}_announce(t){this._forEachPanel(e=>{e.live&&(e.live.textContent=`Color changed to ${t}`)})}_setOpen(t,e="api"){if(!this._isPopoverMode()||t&&(this._isDisabled()||this._isLoading())||this._open===t)return;const r=this._open;this._open=t,this._syncOpenAttribute(t);const i={open:t,previousOpen:r,source:e};if(t?(this._restoreFocusEl=typeof document<"u"?document.activeElement:null,this.dispatchEvent(new CustomEvent("open",{detail:i,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("ui-open",{detail:i,bubbles:!0,composed:!0}))):(this.dispatchEvent(new CustomEvent("close",{detail:i,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("ui-close",{detail:i,bubbles:!0,composed:!0}))),this.requestRender(),!t&&this._restoreFocusEl&&this._restoreFocusEl.isConnected){try{this._restoreFocusEl.focus()}catch{}this._restoreFocusEl=null}t&&queueMicrotask(()=>this._focusFirstOpenControl())}_focusFirstOpenControl(){if(!this._open)return;const e=this._getCurrentPanel()?.querySelector('[data-cp="sv"]');if(e)try{e.focus()}catch{}}_syncValueAttribute(){const t=this._serializeValue();this._syncing=!0;try{this.getAttribute("value")!==t&&this.setAttribute("value",t)}finally{this._syncing=!1}}_syncOpenAttribute(t){this._syncing=!0;try{t?this.hasAttribute("open")||this.setAttribute("open",""):this.hasAttribute("open")&&this.removeAttribute("open")}finally{this._syncing=!1}}_ensureOverlay(){if(this._overlay||typeof document>"u")return;const t=document.createElement("div");t.style.position="fixed",t.style.inset="0",t.style.zIndex="var(--ui-cp-z, 1600)",t.style.pointerEvents="auto";const e=t.attachShadow({mode:"open"});t.addEventListener("click",r=>this._onPanelClick(r,"overlay")),t.addEventListener("input",r=>this._onPanelInput(r,"overlay")),t.addEventListener("change",r=>this._onPanelChange(r,"overlay")),t.addEventListener("keydown",r=>this._onPanelKeyDown(r,"overlay")),t.addEventListener("pointerdown",r=>this._onPanelPointerDown(r,"overlay")),t.addEventListener("pointermove",r=>this._onPanelPointerMove(r)),t.addEventListener("pointerup",r=>this._onPanelPointerUp(r)),t.addEventListener("pointercancel",r=>this._onPanelPointerCancel(r)),document.body.appendChild(t),this._overlay=t,this._overlayRoot=e,this._syncOverlayHostAttributes(),document.addEventListener("pointerdown",this._onDocumentPointerDownBound,!0),document.addEventListener("keydown",this._onDocumentKeyDownBound),window.addEventListener("resize",this._onWindowResizeBound),window.addEventListener("scroll",this._onWindowScrollBound,{passive:!0,capture:!0})}_destroyOverlay(){this._scheduleOverlayPosition.cancel(),typeof document<"u"&&(document.removeEventListener("pointerdown",this._onDocumentPointerDownBound,!0),document.removeEventListener("keydown",this._onDocumentKeyDownBound)),typeof window<"u"&&(window.removeEventListener("resize",this._onWindowResizeBound),window.removeEventListener("scroll",this._onWindowScrollBound,!0)),this._overlay&&this._overlay.parentElement&&this._overlay.parentElement.removeChild(this._overlay),this._overlay=null,this._overlayRoot=null,this._panelCache=new WeakMap,this._isSheetOpen&&(this._isSheetOpen=!1,this._releaseScrollLock&&(this._releaseScrollLock(),this._releaseScrollLock=null))}_positionOverlay(){if(!this._overlayRoot||!this._open||this._isMobileSheet())return;const t=this.root.querySelector(".trigger"),e=this._overlayRoot.querySelector(".popover-shell");if(!t||!e)return;const r=e.querySelector(".panel");if(!r)return;const i=e.getAttribute("data-placement"),a=_.computePopoverPosition(t.getBoundingClientRect(),r.getBoundingClientRect(),8,8,i==="top"?"top":i==="bottom"?"bottom":null);e.style.top=`${Math.round(a.top)}px`,e.style.left=`${Math.round(a.left)}px`,e.setAttribute("data-placement",a.placement)}_onDocumentPointerDown(t){if(!this._overlay||!this._open)return;const e=typeof t.composedPath=="function"?t.composedPath():[];if(e.includes(this))return;const r=this._overlayRoot?.querySelector('[data-cp-panel="overlay"]');r&&e.includes(r)||this._setOpen(!1,"outside")}_onDocumentKeyDown(t){if(!(!this._open||!this._isPopoverMode())){if(t.key==="Tab"){this._trapOverlayFocus(t);return}t.key!=="Escape"||!this._closeOnEscape()||(t.preventDefault(),this._setOpen(!1,"escape"))}}_focusableInPanel(t){const e=t.querySelectorAll('button,[href],input,select,textarea,[tabindex]:not([tabindex="-1"]),[contenteditable="true"]');return Array.from(e).filter(r=>r.hasAttribute("disabled")||r.getAttribute("aria-hidden")==="true"||r.tabIndex<0?!1:r.getClientRects().length>0)}_trapOverlayFocus(t){const e=this._overlayRoot?.querySelector('[data-cp-panel="overlay"]');if(!e)return;const r=this._focusableInPanel(e);if(!r.length){t.preventDefault(),e.focus();return}const i=e.getRootNode(),a=i instanceof ShadowRoot?i.activeElement:e.ownerDocument.activeElement,n=a?r.indexOf(a):-1;if(t.shiftKey){n<=0&&(t.preventDefault(),r[r.length-1].focus());return}(n===-1||n===r.length-1)&&(t.preventDefault(),r[0].focus())}_forEachPanel(t){const e=this.root.querySelector('[data-cp-panel="inline"]');e&&t(this._panelRefs(e));const r=this._overlayRoot?.querySelector('[data-cp-panel="overlay"]');r&&t(this._panelRefs(r))}_panelRefs(t){const e=this._panelCache.get(t);if(e)return e;const r={panel:t,label:t.querySelector('[data-role="label"]'),valueText:t.querySelector('[data-role="value"]'),preview:t.querySelector('[data-role="preview"]'),status:t.querySelector('[data-role="status"]'),sv:t.querySelector('[data-cp="sv"]'),svThumb:t.querySelector('[data-role="sv-thumb"]'),hue:t.querySelector('[data-cp="hue"]'),hueThumb:t.querySelector('[data-role="hue-thumb"]'),alphaRow:t.querySelector('[data-role="alpha-row"]'),alpha:t.querySelector('[data-cp="alpha"]'),alphaThumb:t.querySelector('[data-role="alpha-thumb"]'),tabHex:t.querySelector('[data-format="hex"]'),tabRgb:t.querySelector('[data-format="rgb"]'),tabHsl:t.querySelector('[data-format="hsl"]'),groupHex:t.querySelector('[data-format-group="hex"]'),groupRgb:t.querySelector('[data-format-group="rgb"]'),groupHsl:t.querySelector('[data-format-group="hsl"]'),inputHex:t.querySelector('[data-input="hex"]'),inputR:t.querySelector('[data-input="r"]'),inputG:t.querySelector('[data-input="g"]'),inputB:t.querySelector('[data-input="b"]'),inputA1:t.querySelector('[data-input="a1"]'),inputH:t.querySelector('[data-input="h"]'),inputS:t.querySelector('[data-input="s"]'),inputL:t.querySelector('[data-input="l"]'),inputA2:t.querySelector('[data-input="a2"]'),copyHex:t.querySelector('[data-action="copy-hex"]'),copyRgb:t.querySelector('[data-action="copy-rgb"]'),eyedropper:t.querySelector('[data-action="eyedropper"]'),clear:t.querySelector('[data-action="clear"]'),apply:t.querySelector('[data-action="apply"]'),presets:t.querySelector('[data-role="presets"]'),recent:t.querySelector('[data-role="recent"]'),recentTitle:t.querySelector('[data-role="recent-title"]'),error:t.querySelector('[data-role="error"]'),live:t.querySelector('[data-role="live"]')};return this._panelCache.set(t,r),r}_getCurrentPanel(){return this._isPopoverMode()&&this._open&&this._overlayRoot?this._overlayRoot.querySelector('[data-cp-panel="overlay"]'):this.root.querySelector('[data-cp-panel="inline"]')}_updateUI(t,e=!1){const r=this.root.querySelector('[data-role="trigger-wrap"]'),i=this.root.querySelector(".trigger"),a=this.root.querySelector('[data-role="trigger-value"]'),n=this.root.querySelector('[data-role="trigger-preview"]'),o=this.root.querySelector('[data-role="inline-panel"]'),l=this._isPopoverMode(),c=this._state(),p=this._tone(),v=c==="loading",h=this._isDisabled(),w=this._isReadonly(),R=this._serializeValue()||this._placeholder();r&&(r.hidden=!l),i&&(i.disabled=h||v,i.dataset.state=c,i.dataset.tone=p,i.setAttribute("aria-expanded",l&&this._open?"true":"false"),this._applyAria(i,R)),a&&(a.textContent=R),n&&(n.style.background=k(this._rgba,!0)),o&&(o.hidden=l),this._forEachPanel(d=>this._updatePanel(d,{skipSwatches:t,disabled:h,readonly:w,loading:v,state:c,tone:p,modePopover:l,liveOnly:e}))}_updatePanel(t,e){const r=this._rgba,i=M(r),a=this._hsva,n=`hsl(${Math.round(a.h)} 100% 50%)`,o=t.panel.getAttribute("data-cp-panel")==="overlay",l=!!this._error||e.state==="error",c=e.disabled||e.readonly||e.loading;if(this._applyAria(t.panel),t.panel.dataset.state=l?"error":e.state,t.panel.dataset.tone=e.tone,t.panel.setAttribute("aria-busy",e.loading?"true":"false"),o&&e.modePopover?(t.panel.setAttribute("role","dialog"),t.panel.setAttribute("aria-modal","true"),t.panel.tabIndex=-1):(t.panel.removeAttribute("role"),t.panel.removeAttribute("aria-modal"),t.panel.removeAttribute("tabindex")),t.label&&(t.label.textContent=this._labelText()),t.valueText&&(t.valueText.textContent=this._serializeValue()),t.preview&&(t.preview.style.background=k(r,!0)),t.status){let d="";l?d="Error":e.state==="loading"?d="Syncing":e.state==="success"&&(d="Saved"),t.status.hidden=!d,t.status.textContent=d,t.status.dataset.tone=e.tone}if(t.sv&&(t.sv.style.background=`linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, ${n})`,t.sv.setAttribute("aria-valuetext",`Saturation ${Math.round(a.s)}%, Value ${Math.round(a.v)}%`),t.sv.setAttribute("aria-disabled",c?"true":"false"),t.sv.tabIndex=c?-1:0),t.svThumb){const d=u(a.s,1,99),P=u(100-a.v,1,99);t.svThumb.style.left=`${d}%`,t.svThumb.style.top=`${P}%`}t.hue&&(t.hue.setAttribute("aria-valuemin","0"),t.hue.setAttribute("aria-valuemax","360"),t.hue.setAttribute("aria-valuenow",String(Math.round(a.h))),t.hue.setAttribute("aria-disabled",c?"true":"false"),t.hue.tabIndex=c?-1:0),t.hueThumb&&(t.hueThumb.style.left=`${u(a.h/360*100,1,99)}%`),t.alphaRow&&(t.alphaRow.hidden=!this._alphaEnabled()),t.alpha&&(t.alpha.setAttribute("aria-valuemin","0"),t.alpha.setAttribute("aria-valuemax","100"),t.alpha.setAttribute("aria-valuenow",String(Math.round(a.a*100))),t.alpha.setAttribute("aria-disabled",c||!this._alphaEnabled()?"true":"false"),t.alpha.tabIndex=c?-1:0,t.alpha.style.backgroundImage=`
|
|
798
818
|
linear-gradient(45deg, var(--ui-cp-checker-a) 25%, transparent 25%),
|
|
799
819
|
linear-gradient(-45deg, var(--ui-cp-checker-a) 25%, transparent 25%),
|
|
800
820
|
linear-gradient(45deg, transparent 75%, var(--ui-cp-checker-a) 75%),
|
|
801
821
|
linear-gradient(-45deg, transparent 75%, var(--ui-cp-checker-a) 75%),
|
|
802
822
|
linear-gradient(to right, rgba(${r.r}, ${r.g}, ${r.b}, 0), rgba(${r.r}, ${r.g}, ${r.b}, 1))
|
|
803
|
-
`),t.alphaThumb&&(t.alphaThumb.style.left=`${c(a.a*100,1,99)}%`);const d=t.panel.getRootNode(),f=d instanceof ShadowRoot?d.activeElement:t.panel.ownerDocument.activeElement,h=f&&t.panel.contains(f)?f.getAttribute("data-input"):null;if(t.inputHex&&h!=="hex"&&(t.inputHex.value=y(r,this._alphaEnabled())),t.inputR&&h!=="r"&&(t.inputR.value=String(r.r)),t.inputG&&h!=="g"&&(t.inputG.value=String(r.g)),t.inputB&&h!=="b"&&(t.inputB.value=String(r.b)),t.inputA1&&h!=="a1"&&(t.inputA1.value=this._alphaEnabled()?String(Number(r.a.toFixed(3))):"1"),t.inputH&&h!=="h"&&(t.inputH.value=String(Math.round(i.h))),t.inputS&&h!=="s"&&(t.inputS.value=String(Math.round(i.s))),t.inputL&&h!=="l"&&(t.inputL.value=String(Math.round(i.l))),t.inputA2&&h!=="a2"&&(t.inputA2.value=this._alphaEnabled()?String(Number(r.a.toFixed(3))):"1"),e.liveOnly)return;if(t.tabHex&&(t.tabHex.dataset.active=String(this._format==="hex")),t.tabRgb&&(t.tabRgb.dataset.active=String(this._format==="rgb")),t.tabHsl&&(t.tabHsl.dataset.active=String(this._format==="hsl")),t.groupHex&&(t.groupHex.hidden=this._format!=="hex"),t.groupRgb&&(t.groupRgb.hidden=this._format!=="rgb"),t.groupHsl&&(t.groupHsl.hidden=this._format!=="hsl"),t.inputA1&&(t.inputA1.disabled=!this._alphaEnabled()||u),t.inputA2&&(t.inputA2.disabled=!this._alphaEnabled()||u),t.error){const p=this._error||(e.state==="error"?"Unable to validate current color value.":"");t.error.hidden=!p,t.error.textContent=p}const w=u;if(t.copyHex&&(t.copyHex.disabled=e.disabled||e.loading),t.copyRgb&&(t.copyRgb.disabled=e.disabled||e.loading),t.eyedropper){const p=typeof window<"u"&&typeof window.EyeDropper=="function";t.eyedropper.hidden=!p,t.eyedropper.disabled=w||!p}if(t.clear&&(t.clear.disabled=w),t.apply&&(t.apply.hidden=!e.modePopover,t.apply.disabled=w),t.panel.querySelectorAll(".input").forEach(p=>{const R=p;R.disabled=w}),!e.skipSwatches&&!this._renderingSwatches){this._renderingSwatches=!0;try{this._renderSwatches(t)}finally{this._renderingSwatches=!1}}}_renderSwatches(t){const e=this._currentHex().toLowerCase();t.presets&&(t.presets.innerHTML=this._presets.map(r=>{const i=v(r);if(!i)return"";const a=y(this._normalizeByAlpha(i),this._alphaEnabled()),n=a.toLowerCase()===e?' data-selected="true"':"";return`<button type="button" class="swatch" part="swatch" data-action="preset" data-color="${S(a)}"${n} title="${S(a)}" style="background:${S(k(i,!0))}"></button>`}).join("")),t.recentTitle&&(t.recentTitle.hidden=!this._recentEnabled()||this._recentColors.length===0),t.recent&&(t.recent.hidden=!this._recentEnabled()||this._recentColors.length===0,t.recent.innerHTML=this._recentColors.map(r=>{const i=v(r);if(!i)return"";const a=y(this._normalizeByAlpha(i),this._alphaEnabled()),n=a.toLowerCase()===e?' data-selected="true"':"";return`<button type="button" class="swatch" part="swatch recent" data-action="recent" data-color="${S(a)}"${n} title="${S(a)}" style="background:${S(k(i,!0))}"></button>`}).join(""))}_onPanelClick(t,e){const r=this._eventHTMLElement(t);if(!r)return;const i=r.closest("[data-action]");if(!i||this._isDisabled())return;const a=i.getAttribute("data-action");if(a==="close-popover"){this._setOpen(!1,"outside");return}if(a==="toggle-popover"){if(!this._isPopoverMode())return;this._setOpen(!this._open,"toggle");return}if(!this._isLoading()){if(a==="format"){const n=i.getAttribute("data-format");if(!n)return;this.setAttribute("format",n),this._error="",this._updateUI(!1);return}if(a==="copy-hex"){this._copyToClipboard(this._currentHex());return}if(a==="copy-rgb"){this._copyToClipboard(k(this._rgba,this._alphaEnabled()));return}if(a==="eyedropper"){this._openEyeDropper();return}if(a==="clear"){if(this._isReadonly())return;const n=v(C);n&&(this._applyRgba(n,!1),this._error="",this._syncValueAttribute(),this._emitInput("text"),this._emitChange("text"),this._pushRecent(this._currentHex()),this._updateUI(!1));return}if(a==="apply"){this._setOpen(!1,"apply");return}if(a==="preset"||a==="recent"){if(this._isReadonly())return;const n=i.getAttribute("data-color")||"",o=v(n);if(!o)return;const l=a==="preset"?"preset":"recent";this._applyRgba(o,!0),this._error="",this._syncValueAttribute(),this._emitInput(l),this._emitChange(l),this._pushRecent(this._currentHex()),this._updateUI(!1);return}}}_onPanelInput(t,e){const r=this._eventHTMLElement(t);if(!(r instanceof HTMLInputElement)||!r.hasAttribute("data-input")||(t.stopPropagation(),this._isDisabled()||this._isReadonly()||this._isLoading()))return;const i=this._parseInputsFromPanel(r.closest("[data-cp-panel]"));if(!i){this._error="";return}this._error="",this._applyRgba(i,!0),this._emitInput("text"),this._updateUI(!0,!0)}_onPanelChange(t,e){const r=this._eventHTMLElement(t);if(!(r instanceof HTMLInputElement)||!r.hasAttribute("data-input")||(t.stopPropagation(),this._isDisabled()||this._isReadonly()||this._isLoading()))return;const i=r.closest("[data-cp-panel]"),a=this._parseInputsFromPanel(i);if(!a){const n=r.value||"";this._setInvalid(n,"Invalid input values");return}this._error="",this._applyRgba(a,!0),this._syncValueAttribute(),this._emitInput("text"),this._emitChange("text"),this._pushRecent(this._currentHex()),this._updateUI(!1)}_onPanelKeyDown(t,e){const r=this._eventHTMLElement(t);if(!r||this._isDisabled()||this._isLoading())return;if(r instanceof HTMLInputElement&&r.hasAttribute("data-input")&&t.key==="Enter"){t.preventDefault();const l=this._parseInputsFromPanel(r.closest("[data-cp-panel]"));if(!l){this._setInvalid(r.value||"","Invalid input values");return}this._error="",this._applyRgba(l,!0),this._syncValueAttribute(),this._emitInput("text"),this._emitChange("text"),this._pushRecent(this._currentHex()),this._updateUI(!1);return}const i=r.getAttribute("data-cp");if(!i||this._isReadonly()||this._isLoading())return;const a=t.shiftKey?5:1;let n=!1;const o={...this._hsva};if(i==="sv"){t.key==="ArrowLeft"?(o.s=c(o.s-a,0,100),n=!0):t.key==="ArrowRight"?(o.s=c(o.s+a,0,100),n=!0):t.key==="ArrowUp"?(o.v=c(o.v+a,0,100),n=!0):t.key==="ArrowDown"?(o.v=c(o.v-a,0,100),n=!0):t.key==="Home"?(o.s=0,o.v=100,n=!0):t.key==="End"&&(o.s=100,o.v=0,n=!0),n&&(t.preventDefault(),this._commitHsva(o,"drag"));return}if(i==="hue"){t.key==="ArrowLeft"||t.key==="ArrowDown"?(o.h=c(o.h-a,0,360),n=!0):t.key==="ArrowRight"||t.key==="ArrowUp"?(o.h=c(o.h+a,0,360),n=!0):t.key==="Home"?(o.h=0,n=!0):t.key==="End"&&(o.h=360,n=!0),n&&(t.preventDefault(),this._commitHsva(o,"slider"));return}if(i==="alpha"&&this._alphaEnabled()){const l=t.shiftKey?.1:.01;t.key==="ArrowLeft"||t.key==="ArrowDown"?(o.a=c(o.a-l,0,1),n=!0):t.key==="ArrowRight"||t.key==="ArrowUp"?(o.a=c(o.a+l,0,1),n=!0):t.key==="Home"?(o.a=0,n=!0):t.key==="End"&&(o.a=1,n=!0),n&&(t.preventDefault(),this._commitHsva(o,"slider"))}}_commitHsva(t,e){this._setHsva(t),this._syncValueAttribute(),this._emitInput(e),this._emitChange(e),this._pushRecent(this._currentHex()),this._updateUI(!1)}_parseInputsFromPanel(t){if(!t)return null;const e=this._panelRefs(t);if(this._format==="hex"){const l=e.inputHex?.value||"",u=l.trim().startsWith("#")?l.trim():`#${l.trim()}`,d=v(u);return d?this._normalizeByAlpha(d):null}if(this._format==="rgb"){const l=Number(e.inputR?.value??""),u=Number(e.inputG?.value??""),d=Number(e.inputB?.value??""),f=this._alphaEnabled()?Number(e.inputA1?.value??""):1;return[l,u,d,f].every(h=>Number.isFinite(h))?this._normalizeByAlpha({r:l,g:u,b:d,a:f}):null}const r=Number(e.inputH?.value??""),i=Number(e.inputS?.value??""),a=Number(e.inputL?.value??""),n=this._alphaEnabled()?Number(e.inputA2?.value??""):1;if(![r,i,a,n].every(l=>Number.isFinite(l)))return null;const o={h:c(r,0,360),s:c(i,0,100),l:c(a,0,100),a:c(n,0,1)};return this._normalizeByAlpha(q(o))}_onPanelPointerDown(t,e){if(this._isDisabled()||this._isReadonly()||this._isLoading())return;const r=this._eventHTMLElement(t);if(!r)return;const i=r.closest("[data-cp]")?.getAttribute("data-cp");if(!i||i==="alpha"&&!this._alphaEnabled())return;const a=r.closest(`[data-cp="${i}"]`);if(a){t.preventDefault(),this._dragTarget=i,this._dragPointerId=t.pointerId,this._dragRect=a.getBoundingClientRect(),this._dragX=t.clientX,this._dragY=t.clientY,this._dragChanged=!1,this._dragSource=i==="sv"?"drag":"slider";try{a.setPointerCapture(t.pointerId)}catch{}this._applyDragPointer(!0)}}_onPanelPointerMove(t){!this._dragTarget||t.pointerId!==this._dragPointerId||(this._dragX=t.clientX,this._dragY=t.clientY,!this._dragRaf&&(this._dragRaf=requestAnimationFrame(()=>{this._dragRaf=0,this._applyDragPointer(!0)})))}_onPanelPointerUp(t){!this._dragTarget||t.pointerId!==this._dragPointerId||(this._dragX=t.clientX,this._dragY=t.clientY,this._applyDragPointer(!0),this._stopDrag(!0))}_onPanelPointerCancel(t){!this._dragTarget||t.pointerId!==this._dragPointerId||this._stopDrag(!1)}_cancelDragFrame(){this._dragRaf&&(cancelAnimationFrame(this._dragRaf),this._dragRaf=0)}_applyDragPointer(t){if(!this._dragTarget||!this._dragRect)return;const e=this._dragRect,r=c(this._dragX-e.left,0,e.width||1),i=c(this._dragY-e.top,0,e.height||1),a={...this._hsva};this._dragTarget==="sv"?(a.s=c(r/Math.max(e.width,1)*100,0,100),a.v=c(100-i/Math.max(e.height,1)*100,0,100)):this._dragTarget==="hue"?a.h=c(r/Math.max(e.width,1)*360,0,360):this._dragTarget==="alpha"&&(a.a=c(r/Math.max(e.width,1),0,1)),this._setHsva(a)&&(this._dragChanged=!0,t&&this._emitInput(this._dragSource),this._updateUI(!0,!0))}_setHsva(t){const e={h:c(t.h,0,360),s:c(t.s,0,100),v:c(t.v,0,100),a:this._alphaEnabled()?c(t.a,0,1):1},r=this._hsva;return E(r.h,e.h)&&E(r.s,e.s)&&E(r.v,e.v)&&E(r.a,e.a)?!1:(this._hsva=e,this._rgba=this._normalizeByAlpha(X(this._hsva)),this._error="",!0)}_stopDrag(t){this._cancelDragFrame();const e=t&&this._dragChanged;this._dragTarget=null,this._dragPointerId=-1,this._dragRect=null,this._dragChanged=!1,e&&(this._syncValueAttribute(),this._emitChange(this._dragSource),this._pushRecent(this._currentHex()),this._updateUI(!1))}_pushRecent(t){if(!this._recentEnabled())return;const e=(t||"").trim().toUpperCase();e&&(this._recentColors=[e,...this._recentColors.filter(r=>r.toUpperCase()!==e)].slice(0,this._maxRecent()),this._persistRecentColors())}async _openEyeDropper(){if(this._isDisabled()||this._isReadonly()||this._isLoading()||typeof window>"u")return;const t=window.EyeDropper;if(typeof t=="function")try{const r=await new t().open(),i=v(r?.sRGBHex||"");if(!i)return;this._applyRgba(i,!0),this._error="",this._syncValueAttribute(),this._emitInput("eyedropper"),this._emitChange("eyedropper"),this._pushRecent(this._currentHex()),this._updateUI(!1)}catch{}}async _copyToClipboard(t){if(!t||this._isDisabled())return;let e=!1;if(typeof navigator<"u"&&navigator.clipboard?.writeText)try{await navigator.clipboard.writeText(t),e=!0}catch{e=!1}if(!e&&typeof document<"u"){const a=document.createElement("textarea");a.value=t,a.setAttribute("readonly",""),a.style.position="fixed",a.style.opacity="0",document.body.appendChild(a),a.select();try{e=document.execCommand("copy")}catch{e=!1}finally{a.parentElement&&a.parentElement.removeChild(a)}}const r=e?`Copied ${t}`:`Unable to copy ${t}`,i=typeof window<"u"?window.showToast:null;if(typeof i=="function")try{i(r)}catch{this.dispatchEvent(new CustomEvent("toast",{detail:{message:r},bubbles:!0,composed:!0}))}else this.dispatchEvent(new CustomEvent("toast",{detail:{message:r},bubbles:!0,composed:!0}))}_applyAria(t){const e=this.getAttribute("aria-labelledby"),r=this.getAttribute("aria-describedby"),i=this.getAttribute("aria-label");e?t.setAttribute("aria-labelledby",e):t.removeAttribute("aria-labelledby"),r?t.setAttribute("aria-describedby",r):t.removeAttribute("aria-describedby"),i?t.setAttribute("aria-label",i):e||t.setAttribute("aria-label","Color picker")}}customElements.get("ui-color-picker")||customElements.define("ui-color-picker",$);exports.UIColorPicker=$;
|
|
823
|
+
`),t.alphaThumb&&(t.alphaThumb.style.left=`${u(a.a*100,1,99)}%`);const p=t.panel.getRootNode(),v=p instanceof ShadowRoot?p.activeElement:t.panel.ownerDocument.activeElement,h=v&&t.panel.contains(v)?v.getAttribute("data-input"):null;if(t.inputHex&&h!=="hex"&&(t.inputHex.value=y(r,this._alphaEnabled())),t.inputR&&h!=="r"&&(t.inputR.value=String(r.r)),t.inputG&&h!=="g"&&(t.inputG.value=String(r.g)),t.inputB&&h!=="b"&&(t.inputB.value=String(r.b)),t.inputA1&&h!=="a1"&&(t.inputA1.value=this._alphaEnabled()?String(Number(r.a.toFixed(3))):"1"),t.inputH&&h!=="h"&&(t.inputH.value=String(Math.round(i.h))),t.inputS&&h!=="s"&&(t.inputS.value=String(Math.round(i.s))),t.inputL&&h!=="l"&&(t.inputL.value=String(Math.round(i.l))),t.inputA2&&h!=="a2"&&(t.inputA2.value=this._alphaEnabled()?String(Number(r.a.toFixed(3))):"1"),e.liveOnly)return;if(t.tabHex&&(t.tabHex.dataset.active=String(this._format==="hex")),t.tabRgb&&(t.tabRgb.dataset.active=String(this._format==="rgb")),t.tabHsl&&(t.tabHsl.dataset.active=String(this._format==="hsl")),t.groupHex&&(t.groupHex.hidden=this._format!=="hex"),t.groupRgb&&(t.groupRgb.hidden=this._format!=="rgb"),t.groupHsl&&(t.groupHsl.hidden=this._format!=="hsl"),t.inputA1&&(t.inputA1.disabled=!this._alphaEnabled()||c),t.inputA2&&(t.inputA2.disabled=!this._alphaEnabled()||c),t.error){const d=this._error||(e.state==="error"?"Unable to validate current color value.":"");t.error.hidden=!d,t.error.textContent=d}const w=c;if(t.copyHex&&(t.copyHex.disabled=e.disabled||e.loading),t.copyRgb&&(t.copyRgb.disabled=e.disabled||e.loading),t.eyedropper){const d=typeof window<"u"&&typeof window.EyeDropper=="function";t.eyedropper.hidden=!d,t.eyedropper.disabled=w||!d}if(t.clear&&(t.clear.disabled=w),t.apply&&(t.apply.hidden=!e.modePopover,t.apply.disabled=w),t.panel.querySelectorAll(".input").forEach(d=>{const P=d;P.disabled=w}),!e.skipSwatches&&!this._renderingSwatches){this._renderingSwatches=!0;try{this._renderSwatches(t)}finally{this._renderingSwatches=!1}}}_renderSwatches(t){const e=this._currentHex().toLowerCase();t.presets&&(t.presets.innerHTML=this._presets.map(r=>{const i=f(r);if(!i)return"";const a=y(this._normalizeByAlpha(i),this._alphaEnabled()),n=a.toLowerCase()===e?' data-selected="true"':"";return`<button type="button" class="swatch" part="swatch" data-action="preset" data-color="${S(a)}"${n} title="${S(a)}" style="background:${S(k(i,!0))}"></button>`}).join("")),t.recentTitle&&(t.recentTitle.hidden=!this._recentEnabled()||this._recentColors.length===0),t.recent&&(t.recent.hidden=!this._recentEnabled()||this._recentColors.length===0,t.recent.innerHTML=this._recentColors.map(r=>{const i=f(r);if(!i)return"";const a=y(this._normalizeByAlpha(i),this._alphaEnabled()),n=a.toLowerCase()===e?' data-selected="true"':"";return`<button type="button" class="swatch" part="swatch recent" data-action="recent" data-color="${S(a)}"${n} title="${S(a)}" style="background:${S(k(i,!0))}"></button>`}).join(""))}_onPanelClick(t,e){const r=this._eventHTMLElement(t);if(!r)return;const i=r.closest("[data-action]");if(!i||this._isDisabled())return;const a=i.getAttribute("data-action");if(a==="close-popover"){this._setOpen(!1,"outside");return}if(a==="toggle-popover"){if(!this._isPopoverMode())return;this._setOpen(!this._open,"toggle");return}if(!this._isLoading()){if(a==="format"){const n=i.getAttribute("data-format");if(!n)return;this.setAttribute("format",n),this._error="",this._updateUI(!1);return}if(a==="copy-hex"){this._copyToClipboard(this._currentHex());return}if(a==="copy-rgb"){this._copyToClipboard(k(this._rgba,this._alphaEnabled()));return}if(a==="eyedropper"){this._openEyeDropper();return}if(a==="clear"){if(this._isReadonly())return;const n=f(I);n&&(this._applyRgba(n,!1),this._error="",this._syncValueAttribute(),this._emitInput("text"),this._emitChange("text"),this._pushRecent(this._currentHex()),this._updateUI(!1));return}if(a==="apply"){this._setOpen(!1,"apply");return}if(a==="preset"||a==="recent"){if(this._isReadonly())return;const n=i.getAttribute("data-color")||"",o=f(n);if(!o)return;const l=a==="preset"?"preset":"recent";this._applyRgba(o,!0),this._error="",this._syncValueAttribute(),this._emitInput(l),this._emitChange(l),this._pushRecent(this._currentHex()),this._updateUI(!1);return}}}_onPanelInput(t,e){const r=this._eventHTMLElement(t);if(!(r instanceof HTMLInputElement)||!r.hasAttribute("data-input")||(t.stopPropagation(),this._isDisabled()||this._isReadonly()||this._isLoading()))return;const i=this._parseInputsFromPanel(r.closest("[data-cp-panel]"));if(!i){this._error="";return}this._error="",this._applyRgba(i,!0),this._emitInput("text"),this._updateUI(!0,!0)}_onPanelChange(t,e){const r=this._eventHTMLElement(t);if(!(r instanceof HTMLInputElement)||!r.hasAttribute("data-input")||(t.stopPropagation(),this._isDisabled()||this._isReadonly()||this._isLoading()))return;const i=r.closest("[data-cp-panel]"),a=this._parseInputsFromPanel(i);if(!a){const n=r.value||"";this._setInvalid(n,"Invalid input values");return}this._error="",this._applyRgba(a,!0),this._syncValueAttribute(),this._emitInput("text"),this._emitChange("text"),this._pushRecent(this._currentHex()),this._updateUI(!1)}_onPanelKeyDown(t,e){const r=this._eventHTMLElement(t);if(!r||this._isDisabled()||this._isLoading())return;if(r instanceof HTMLInputElement&&r.hasAttribute("data-input")&&t.key==="Enter"){t.preventDefault();const l=this._parseInputsFromPanel(r.closest("[data-cp-panel]"));if(!l){this._setInvalid(r.value||"","Invalid input values");return}this._error="",this._applyRgba(l,!0),this._syncValueAttribute(),this._emitInput("text"),this._emitChange("text"),this._pushRecent(this._currentHex()),this._updateUI(!1);return}const i=r.getAttribute("data-cp");if(!i||this._isReadonly()||this._isLoading())return;const a=t.shiftKey?5:1;let n=!1;const o={...this._hsva};if(i==="sv"){t.key==="ArrowLeft"?(o.s=u(o.s-a,0,100),n=!0):t.key==="ArrowRight"?(o.s=u(o.s+a,0,100),n=!0):t.key==="ArrowUp"?(o.v=u(o.v+a,0,100),n=!0):t.key==="ArrowDown"?(o.v=u(o.v-a,0,100),n=!0):t.key==="Home"?(o.s=0,o.v=100,n=!0):t.key==="End"&&(o.s=100,o.v=0,n=!0),n&&(t.preventDefault(),this._commitHsva(o,"drag"));return}if(i==="hue"){t.key==="ArrowLeft"||t.key==="ArrowDown"?(o.h=u(o.h-a,0,360),n=!0):t.key==="ArrowRight"||t.key==="ArrowUp"?(o.h=u(o.h+a,0,360),n=!0):t.key==="Home"?(o.h=0,n=!0):t.key==="End"&&(o.h=360,n=!0),n&&(t.preventDefault(),this._commitHsva(o,"slider"));return}if(i==="alpha"&&this._alphaEnabled()){const l=t.shiftKey?.1:.01;t.key==="ArrowLeft"||t.key==="ArrowDown"?(o.a=u(o.a-l,0,1),n=!0):t.key==="ArrowRight"||t.key==="ArrowUp"?(o.a=u(o.a+l,0,1),n=!0):t.key==="Home"?(o.a=0,n=!0):t.key==="End"&&(o.a=1,n=!0),n&&(t.preventDefault(),this._commitHsva(o,"slider"))}}_commitHsva(t,e){this._setHsva(t),this._syncValueAttribute(),this._emitInput(e),this._emitChange(e),this._pushRecent(this._currentHex()),this._updateUI(!1)}_parseInputsFromPanel(t){if(!t)return null;const e=this._panelRefs(t);if(this._format==="hex"){const l=e.inputHex?.value||"",c=l.trim().startsWith("#")?l.trim():`#${l.trim()}`,p=f(c);return p?this._normalizeByAlpha(p):null}if(this._format==="rgb"){const l=Number(e.inputR?.value??""),c=Number(e.inputG?.value??""),p=Number(e.inputB?.value??""),v=this._alphaEnabled()?Number(e.inputA1?.value??""):1;return[l,c,p,v].every(h=>Number.isFinite(h))?this._normalizeByAlpha({r:l,g:c,b:p,a:v}):null}const r=Number(e.inputH?.value??""),i=Number(e.inputS?.value??""),a=Number(e.inputL?.value??""),n=this._alphaEnabled()?Number(e.inputA2?.value??""):1;if(![r,i,a,n].every(l=>Number.isFinite(l)))return null;const o={h:u(r,0,360),s:u(i,0,100),l:u(a,0,100),a:u(n,0,1)};return this._normalizeByAlpha($(o))}_onPanelPointerDown(t,e){if(this._isDisabled()||this._isReadonly()||this._isLoading())return;const r=this._eventHTMLElement(t);if(!r)return;const i=r.closest("[data-cp]")?.getAttribute("data-cp");if(!i||i==="alpha"&&!this._alphaEnabled())return;const a=r.closest(`[data-cp="${i}"]`);if(a){t.preventDefault(),this._dragTarget=i,this._dragPointerId=t.pointerId,this._dragRect=a.getBoundingClientRect(),this._dragX=t.clientX,this._dragY=t.clientY,this._dragChanged=!1,this._dragSource=i==="sv"?"drag":"slider";try{a.setPointerCapture(t.pointerId)}catch{}this._applyDragPointer(!0)}}_onPanelPointerMove(t){!this._dragTarget||t.pointerId!==this._dragPointerId||(this._dragX=t.clientX,this._dragY=t.clientY,!this._dragRaf&&(this._dragRaf=requestAnimationFrame(()=>{this._dragRaf=0,this._applyDragPointer(!0)})))}_onPanelPointerUp(t){!this._dragTarget||t.pointerId!==this._dragPointerId||(this._dragX=t.clientX,this._dragY=t.clientY,this._applyDragPointer(!0),this._stopDrag(!0))}_onPanelPointerCancel(t){!this._dragTarget||t.pointerId!==this._dragPointerId||this._stopDrag(!1)}_cancelDragFrame(){this._dragRaf&&(cancelAnimationFrame(this._dragRaf),this._dragRaf=0)}_applyDragPointer(t){if(!this._dragTarget||!this._dragRect)return;const e=this._dragRect,r=u(this._dragX-e.left,0,e.width||1),i=u(this._dragY-e.top,0,e.height||1),a={...this._hsva};this._dragTarget==="sv"?(a.s=u(r/Math.max(e.width,1)*100,0,100),a.v=u(100-i/Math.max(e.height,1)*100,0,100)):this._dragTarget==="hue"?a.h=u(r/Math.max(e.width,1)*360,0,360):this._dragTarget==="alpha"&&(a.a=u(r/Math.max(e.width,1),0,1)),this._setHsva(a)&&(this._dragChanged=!0,t&&this._emitInput(this._dragSource),this._updateUI(!0,!0))}_setHsva(t){const e={h:u(t.h,0,360),s:u(t.s,0,100),v:u(t.v,0,100),a:this._alphaEnabled()?u(t.a,0,1):1},r=this._hsva;return E(r.h,e.h)&&E(r.s,e.s)&&E(r.v,e.v)&&E(r.a,e.a)?!1:(this._hsva=e,this._rgba=this._normalizeByAlpha(X(this._hsva)),this._error="",!0)}_stopDrag(t){this._cancelDragFrame();const e=t&&this._dragChanged;this._dragTarget=null,this._dragPointerId=-1,this._dragRect=null,this._dragChanged=!1,e&&(this._syncValueAttribute(),this._emitChange(this._dragSource),this._pushRecent(this._currentHex()),this._updateUI(!1))}_pushRecent(t){if(!this._recentEnabled())return;const e=(t||"").trim().toUpperCase();e&&(this._recentColors=[e,...this._recentColors.filter(r=>r.toUpperCase()!==e)].slice(0,this._maxRecent()),this._persistRecentColors())}async _openEyeDropper(){if(this._isDisabled()||this._isReadonly()||this._isLoading()||typeof window>"u")return;const t=window.EyeDropper;if(typeof t=="function")try{const r=await new t().open(),i=f(r?.sRGBHex||"");if(!i)return;this._applyRgba(i,!0),this._error="",this._syncValueAttribute(),this._emitInput("eyedropper"),this._emitChange("eyedropper"),this._pushRecent(this._currentHex()),this._updateUI(!1)}catch{}}async _copyToClipboard(t){if(!t||this._isDisabled())return;let e=!1;if(typeof navigator<"u"&&navigator.clipboard?.writeText)try{await navigator.clipboard.writeText(t),e=!0}catch{e=!1}if(!e&&typeof document<"u"){const a=document.createElement("textarea");a.value=t,a.setAttribute("readonly",""),a.style.position="fixed",a.style.opacity="0",document.body.appendChild(a),a.select();try{e=document.execCommand("copy")}catch{e=!1}finally{a.parentElement&&a.parentElement.removeChild(a)}}const r=e?`Copied ${t}`:`Unable to copy ${t}`,i=typeof window<"u"?window.showToast:null;if(typeof i=="function")try{i(r)}catch{this.dispatchEvent(new CustomEvent("toast",{detail:{message:r},bubbles:!0,composed:!0}))}else this.dispatchEvent(new CustomEvent("toast",{detail:{message:r},bubbles:!0,composed:!0}))}_applyAria(t,e=""){const r=this.getAttribute("aria-labelledby"),i=this.getAttribute("aria-describedby"),a=this.getAttribute("aria-label"),n=this.getRootNode(),o=r?r.split(/\s+/).map(p=>n.getElementById?.(p)?.textContent?.trim()||"").filter(Boolean).join(" "):"";t.removeAttribute("aria-labelledby"),i?t.setAttribute("aria-describedby",i):t.removeAttribute("aria-describedby");const l=o||a||"Color picker",c=e&&!l.includes(e)?`${l}, ${e}`:l;t.setAttribute("aria-label",c)}}customElements.get("ui-color-picker")||customElements.define("ui-color-picker",q);exports.UIColorPicker=q;
|