@data-slot/toggle-group 0.2.10 → 0.2.12

package/README.md

@@ -95,7 +95,7 @@ group.destroy();
 
 ## Events
 
-### Outbound
+### Outbound Events
 
 ```javascript
 // Listen for changes
@@ -104,7 +104,11 @@ root.addEventListener("toggle-group:change", (e) => {
 });
 ```
 
-### Inbound
+### Inbound Events
+
+| Event | Detail | Description |
+|-------|--------|-------------|
+| `toggle-group:set` | `{ value: string \| string[] }` | Set selection programmatically |
 
 ```javascript
 // Set selection from outside
@@ -112,12 +116,32 @@ root.dispatchEvent(new CustomEvent("toggle-group:set", {
   detail: { value: "bold" }
 }));
 
-// Or with array
+// Set multiple values
+root.dispatchEvent(new CustomEvent("toggle-group:set", {
+  detail: { value: ["bold", "italic"] }
+}));
+```
+
+**Note:** Blocked when group is disabled.
+
+### Deprecated Shapes
+
+The following shapes are deprecated and will be removed in v1.0:
+
+```javascript
+// Deprecated: bare string
+root.dispatchEvent(new CustomEvent("toggle-group:set", {
+  detail: "bold"
+}));
+
+// Deprecated: bare array
 root.dispatchEvent(new CustomEvent("toggle-group:set", {
   detail: ["bold", "italic"]
 }));
 ```
 
+Use `{ value: ... }` instead.
+
 ## Keyboard Navigation
 
 | Key | Action |

package/dist/index.cjs

@@ -1 +1 @@
-const e=(e,t)=>[...e.querySelectorAll(`[data-slot="${t}"]`)],t=(e,t)=>[...e.querySelectorAll(`[data-slot="${t}"]`)],n=new WeakMap;function r(e,t,r){if(typeof process<`u`&&process.env?.NODE_ENV===`production`)return;let i=n.get(e);i||(i=new Set,n.set(e,i)),!i.has(t)&&(i.add(t),console.warn(`[@data-slot] ${r}`))}function i(e){let t=`data-${e.replace(/([A-Z])/g,`-$1`).toLowerCase()}`,n=`data-${e}`;return t===n?[t]:[t,n]}function a(e,t){for(let n of i(t))if(e.hasAttribute(n))return e.getAttribute(n);return null}function o(e,t){return i(t).some(t=>e.hasAttribute(t))}const s=new Set([``,`true`,`1`,`yes`]),c=new Set([`false`,`0`,`no`]);function l(e,t){if(!o(e,t))return;let n=a(e,t);if(n===null)return;let i=n.toLowerCase();if(s.has(i))return!0;if(c.has(i))return!1;r(e,t,`Invalid boolean value "${n}" for data-${t}. Expected: true/false/1/0/yes/no or empty.`)}function u(e,t){if(o(e,t))return a(e,t)??void 0}function d(e,t,n){let i=a(e,t);if(i!==null){if(n.includes(i))return i;r(e,t,`Invalid value "${i}" for data-${t}. Expected one of: ${n.join(`, `)}.`)}}let f=0;const p=(e,t)=>e.id||=`${t}-${++f}`,m=(e,t,n)=>{n===null?e.removeAttribute(`aria-${t}`):e.setAttribute(`aria-${t}`,String(n))};function h(e,t,n,r){return e.addEventListener(t,n,r),()=>e.removeEventListener(t,n,r)}const g=(e,t,n)=>e.dispatchEvent(new CustomEvent(t,{bubbles:!0,detail:n})),_=[`horizontal`,`vertical`];function v(t,n={}){let r=e(t,`toggle-group-item`);if(r.length===0)throw Error(`ToggleGroup requires at least one toggle-group-item`);let i=n.multiple??l(t,`multiple`)??!1,a=n.orientation??d(t,`orientation`,_)??`horizontal`,o=n.loop??l(t,`loop`)??!0,s=n.disabled??l(t,`disabled`)??!1,c=n.onValueChange,f=()=>{if(n.defaultValue!==void 0)return Array.isArray(n.defaultValue)?n.defaultValue:n.defaultValue.split(/\s+/).filter(Boolean);let e=u(t,`defaultValue`);return e?e.split(/\s+/).filter(Boolean):[]},v=f(),b=[],x=new Map,S=new Map,C=[];for(let e of r){let t=(e.dataset.value||``).trim();if(!t){C.push(e);continue}let n=e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,r={el:e,value:t,disabled:n};b.push(r),x.set(t,r),S.set(e,r)}for(let e of C)e.tabIndex=-1,e.setAttribute(`aria-disabled`,`true`);if(b.length===0)throw Error(`ToggleGroup requires at least one toggle-group-item with a data-value attribute`);let w=new Set;for(let e of v)if(x.has(e)&&(w.add(e),!i))break;let T=[],E=()=>t.hasAttribute(`disabled`)||t.hasAttribute(`data-disabled`)||t.getAttribute(`aria-disabled`)===`true`,D=e=>e.el.hasAttribute(`disabled`)||e.el.hasAttribute(`data-disabled`)||e.el.getAttribute(`aria-disabled`)===`true`,O=()=>b.filter(e=>!D(e));t.setAttribute(`role`,`group`),s&&t.setAttribute(`aria-disabled`,`true`),a===`vertical`&&m(t,`orientation`,`vertical`),i&&(t.dataset.multiple=``);for(let e of b){let{el:t,disabled:n}=e;p(t,`toggle-group-item`),t.tagName===`BUTTON`&&!t.hasAttribute(`type`)&&(t.type=`button`),n&&(t.setAttribute(`aria-disabled`,`true`),t.tagName===`BUTTON`&&(t.disabled=!0))}let k=(e,n=!1)=>{let r=!n&&(e.size!==w.size||[...e].some(e=>!w.has(e)));w=e;for(let e of b){let t=w.has(e.value);m(e.el,`pressed`,t),e.el.dataset.state=t?`on`:`off`}A();let i=[...w];t.setAttribute(`data-value`,i.join(` `)),r&&(g(t,`toggle-group:change`,{value:i}),c?.(i))},A=()=>{let e=O(),t;for(let n of e)if(w.has(n.value)){t=n;break}!t&&e.length>0&&(t=e[0]);for(let e of b)e.el.tabIndex=e===t?0:-1};k(w,!0);let j=e=>{let t=new Set(w);i?t.has(e)?t.delete(e):t.add(e):t.has(e)?t.clear():(t.clear(),t.add(e)),k(t)},M=e=>{let t=Array.isArray(e)?e:e.split(/\s+/).filter(Boolean),n=new Set;for(let e of t)if(x.has(e)&&(n.add(e),!i))break;k(n)};T.push(h(t,`click`,e=>{if(E())return;let t=e.target.closest?.(`[data-slot="toggle-group-item"]`);if(!t)return;let n=S.get(t);!n||D(n)||j(n.value)}));let N=a===`horizontal`,P=N?`ArrowLeft`:`ArrowUp`,F=N?`ArrowRight`:`ArrowDown`;return T.push(h(t,`keydown`,e=>{if(E())return;let t=e.target.closest?.(`[data-slot="toggle-group-item"]`);if(!t)return;let n=S.get(t);if(!n)return;if(e.key===`Enter`||e.key===` `){D(n)&&e.preventDefault();return}let r=O();if(r.length===0)return;let i=r.findIndex(e=>e.el===t);i===-1&&(i=0);let a=i;switch(e.key){case P:a=i-1,a<0&&(a=o?r.length-1:0);break;case F:a=i+1,a>=r.length&&(a=o?0:r.length-1);break;case`Home`:a=0;break;case`End`:a=r.length-1;break;default:return}e.preventDefault();let s=r[a];if(s){for(let e of b)e.el.tabIndex=e===s?0:-1;s.el.focus()}})),T.push(h(t,`toggle-group:set`,e=>{if(E())return;let t=e,n=t.detail,r;if(typeof n==`string`)r=n;else if(Array.isArray(n))r=n;else if(n&&typeof n==`object`&&`value`in n)r=n.value;else return;M(r)})),{setValue:e=>M(e),toggle:e=>j(e),get value(){return[...w]},destroy:()=>{T.forEach(e=>e()),T.length=0,y.delete(t)}}}const y=new WeakSet;function b(e=document){let n=[];for(let r of t(e,`toggle-group`)){if(y.has(r))continue;y.add(r),n.push(v(r))}return n}exports.create=b,exports.createToggleGroup=v;
+const e=(e,t)=>[...e.querySelectorAll(`[data-slot="${t}"]`)],t=(e,t)=>[...e.querySelectorAll(`[data-slot="${t}"]`)],n=new WeakMap;function r(e,t,r){if(typeof process<`u`&&process.env?.NODE_ENV===`production`)return;let i=n.get(e);i||(i=new Set,n.set(e,i)),!i.has(t)&&(i.add(t),console.warn(`[@data-slot] ${r}`))}function i(e){let t=`data-${e.replace(/([A-Z])/g,`-$1`).toLowerCase()}`,n=`data-${e}`;return t===n?[t]:[t,n]}function a(e,t){for(let n of i(t))if(e.hasAttribute(n))return e.getAttribute(n);return null}function o(e,t){return i(t).some(t=>e.hasAttribute(t))}const s=new Set([``,`true`,`1`,`yes`]),c=new Set([`false`,`0`,`no`]);function l(e,t){if(!o(e,t))return;let n=a(e,t);if(n===null)return;let i=n.toLowerCase();if(s.has(i))return!0;if(c.has(i))return!1;r(e,t,`Invalid boolean value "${n}" for data-${t}. Expected: true/false/1/0/yes/no or empty.`)}function u(e,t){if(o(e,t))return a(e,t)??void 0}function d(e,t,n){let i=a(e,t);if(i!==null){if(n.includes(i))return i;r(e,t,`Invalid value "${i}" for data-${t}. Expected one of: ${n.join(`, `)}.`)}}let f=0;const p=(e,t)=>e.id||=`${t}-${++f}`,m=(e,t,n)=>{n===null?e.removeAttribute(`aria-${t}`):e.setAttribute(`aria-${t}`,String(n))};function h(e,t,n,r){return e.addEventListener(t,n,r),()=>e.removeEventListener(t,n,r)}const g=(e,t,n)=>e.dispatchEvent(new CustomEvent(t,{bubbles:!0,detail:n})),_=[`horizontal`,`vertical`];function v(t,n={}){let r=e(t,`toggle-group-item`);if(r.length===0)throw Error(`ToggleGroup requires at least one toggle-group-item`);let i=n.multiple??l(t,`multiple`)??!1,a=n.orientation??d(t,`orientation`,_)??`horizontal`,o=n.loop??l(t,`loop`)??!0,s=n.disabled??l(t,`disabled`)??!1,c=n.onValueChange,f=()=>{if(n.defaultValue!==void 0)return Array.isArray(n.defaultValue)?n.defaultValue:n.defaultValue.split(/\s+/).filter(Boolean);let e=u(t,`defaultValue`);return e?e.split(/\s+/).filter(Boolean):[]},v=f(),b=[],x=new Map,S=new Map,C=[];for(let e of r){let t=(e.dataset.value||``).trim();if(!t){C.push(e);continue}let n=e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,r={el:e,value:t,disabled:n};b.push(r),x.set(t,r),S.set(e,r)}for(let e of C)e.tabIndex=-1,e.setAttribute(`aria-disabled`,`true`);if(b.length===0)throw Error(`ToggleGroup requires at least one toggle-group-item with a data-value attribute`);let w=new Set;for(let e of v)if(x.has(e)&&(w.add(e),!i))break;let T=[],E=()=>t.hasAttribute(`disabled`)||t.hasAttribute(`data-disabled`)||t.getAttribute(`aria-disabled`)===`true`,D=e=>e.el.hasAttribute(`disabled`)||e.el.hasAttribute(`data-disabled`)||e.el.getAttribute(`aria-disabled`)===`true`,O=()=>b.filter(e=>!D(e));t.setAttribute(`role`,`group`),s&&t.setAttribute(`aria-disabled`,`true`),a===`vertical`&&m(t,`orientation`,`vertical`),i&&(t.dataset.multiple=``);for(let e of b){let{el:t,disabled:n}=e;p(t,`toggle-group-item`),t.tagName===`BUTTON`&&!t.hasAttribute(`type`)&&(t.type=`button`),n&&(t.setAttribute(`aria-disabled`,`true`),t.tagName===`BUTTON`&&(t.disabled=!0))}let k=(e,n=!1)=>{let r=!n&&(e.size!==w.size||[...e].some(e=>!w.has(e)));w=e;for(let e of b){let t=w.has(e.value);m(e.el,`pressed`,t),e.el.dataset.state=t?`on`:`off`}A();let i=[...w];t.setAttribute(`data-value`,i.join(` `)),r&&(g(t,`toggle-group:change`,{value:i}),c?.(i))},A=()=>{let e=O(),t;for(let n of e)if(w.has(n.value)){t=n;break}!t&&e.length>0&&(t=e[0]);for(let e of b)e.el.tabIndex=e===t?0:-1};k(w,!0);let j=e=>{let t=new Set(w);i?t.has(e)?t.delete(e):t.add(e):t.has(e)?t.clear():(t.clear(),t.add(e)),k(t)},M=e=>{let t=Array.isArray(e)?e:e.split(/\s+/).filter(Boolean),n=new Set;for(let e of t)if(x.has(e)&&(n.add(e),!i))break;k(n)};T.push(h(t,`click`,e=>{if(E())return;let t=e.target.closest?.(`[data-slot="toggle-group-item"]`);if(!t)return;let n=S.get(t);!n||D(n)||j(n.value)}));let N=a===`horizontal`,P=N?`ArrowLeft`:`ArrowUp`,F=N?`ArrowRight`:`ArrowDown`;return T.push(h(t,`keydown`,e=>{if(E())return;let t=e.target.closest?.(`[data-slot="toggle-group-item"]`);if(!t)return;let n=S.get(t);if(!n)return;if(e.key===`Enter`||e.key===` `){D(n)&&e.preventDefault();return}let r=O();if(r.length===0)return;let i=r.findIndex(e=>e.el===t);i===-1&&(i=0);let a=i;switch(e.key){case P:a=i-1,a<0&&(a=o?r.length-1:0);break;case F:a=i+1,a>=r.length&&(a=o?0:r.length-1);break;case`Home`:a=0;break;case`End`:a=r.length-1;break;default:return}e.preventDefault();let s=r[a];if(s){for(let e of b)e.el.tabIndex=e===s?0:-1;s.el.focus()}})),T.push(h(t,`toggle-group:set`,e=>{if(E())return;let t=e,n=t.detail,r;typeof n==`string`||Array.isArray(n)?r=n:n&&typeof n==`object`&&`value`in n&&(r=n.value),r!==void 0&&M(r)})),{setValue:e=>M(e),toggle:e=>j(e),get value(){return[...w]},destroy:()=>{T.forEach(e=>e()),T.length=0,y.delete(t)}}}const y=new WeakSet;function b(e=document){let n=[];for(let r of t(e,`toggle-group`)){if(y.has(r))continue;y.add(r),n.push(v(r))}return n}exports.create=b,exports.createToggleGroup=v;

package/dist/index.js

@@ -1 +1 @@
-const e=(e,t)=>[...e.querySelectorAll(`[data-slot="${t}"]`)],t=(e,t)=>[...e.querySelectorAll(`[data-slot="${t}"]`)],n=new WeakMap;function r(e,t,r){if(typeof process<`u`&&process.env?.NODE_ENV===`production`)return;let i=n.get(e);i||(i=new Set,n.set(e,i)),!i.has(t)&&(i.add(t),console.warn(`[@data-slot] ${r}`))}function i(e){let t=`data-${e.replace(/([A-Z])/g,`-$1`).toLowerCase()}`,n=`data-${e}`;return t===n?[t]:[t,n]}function a(e,t){for(let n of i(t))if(e.hasAttribute(n))return e.getAttribute(n);return null}function o(e,t){return i(t).some(t=>e.hasAttribute(t))}const s=new Set([``,`true`,`1`,`yes`]),c=new Set([`false`,`0`,`no`]);function l(e,t){if(!o(e,t))return;let n=a(e,t);if(n===null)return;let i=n.toLowerCase();if(s.has(i))return!0;if(c.has(i))return!1;r(e,t,`Invalid boolean value "${n}" for data-${t}. Expected: true/false/1/0/yes/no or empty.`)}function u(e,t){if(o(e,t))return a(e,t)??void 0}function d(e,t,n){let i=a(e,t);if(i!==null){if(n.includes(i))return i;r(e,t,`Invalid value "${i}" for data-${t}. Expected one of: ${n.join(`, `)}.`)}}let f=0;const p=(e,t)=>e.id||=`${t}-${++f}`,m=(e,t,n)=>{n===null?e.removeAttribute(`aria-${t}`):e.setAttribute(`aria-${t}`,String(n))};function h(e,t,n,r){return e.addEventListener(t,n,r),()=>e.removeEventListener(t,n,r)}const g=(e,t,n)=>e.dispatchEvent(new CustomEvent(t,{bubbles:!0,detail:n})),_=[`horizontal`,`vertical`];function v(t,n={}){let r=e(t,`toggle-group-item`);if(r.length===0)throw Error(`ToggleGroup requires at least one toggle-group-item`);let i=n.multiple??l(t,`multiple`)??!1,a=n.orientation??d(t,`orientation`,_)??`horizontal`,o=n.loop??l(t,`loop`)??!0,s=n.disabled??l(t,`disabled`)??!1,c=n.onValueChange,f=()=>{if(n.defaultValue!==void 0)return Array.isArray(n.defaultValue)?n.defaultValue:n.defaultValue.split(/\s+/).filter(Boolean);let e=u(t,`defaultValue`);return e?e.split(/\s+/).filter(Boolean):[]},v=f(),b=[],x=new Map,S=new Map,C=[];for(let e of r){let t=(e.dataset.value||``).trim();if(!t){C.push(e);continue}let n=e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,r={el:e,value:t,disabled:n};b.push(r),x.set(t,r),S.set(e,r)}for(let e of C)e.tabIndex=-1,e.setAttribute(`aria-disabled`,`true`);if(b.length===0)throw Error(`ToggleGroup requires at least one toggle-group-item with a data-value attribute`);let w=new Set;for(let e of v)if(x.has(e)&&(w.add(e),!i))break;let T=[],E=()=>t.hasAttribute(`disabled`)||t.hasAttribute(`data-disabled`)||t.getAttribute(`aria-disabled`)===`true`,D=e=>e.el.hasAttribute(`disabled`)||e.el.hasAttribute(`data-disabled`)||e.el.getAttribute(`aria-disabled`)===`true`,O=()=>b.filter(e=>!D(e));t.setAttribute(`role`,`group`),s&&t.setAttribute(`aria-disabled`,`true`),a===`vertical`&&m(t,`orientation`,`vertical`),i&&(t.dataset.multiple=``);for(let e of b){let{el:t,disabled:n}=e;p(t,`toggle-group-item`),t.tagName===`BUTTON`&&!t.hasAttribute(`type`)&&(t.type=`button`),n&&(t.setAttribute(`aria-disabled`,`true`),t.tagName===`BUTTON`&&(t.disabled=!0))}let k=(e,n=!1)=>{let r=!n&&(e.size!==w.size||[...e].some(e=>!w.has(e)));w=e;for(let e of b){let t=w.has(e.value);m(e.el,`pressed`,t),e.el.dataset.state=t?`on`:`off`}A();let i=[...w];t.setAttribute(`data-value`,i.join(` `)),r&&(g(t,`toggle-group:change`,{value:i}),c?.(i))},A=()=>{let e=O(),t;for(let n of e)if(w.has(n.value)){t=n;break}!t&&e.length>0&&(t=e[0]);for(let e of b)e.el.tabIndex=e===t?0:-1};k(w,!0);let j=e=>{let t=new Set(w);i?t.has(e)?t.delete(e):t.add(e):t.has(e)?t.clear():(t.clear(),t.add(e)),k(t)},M=e=>{let t=Array.isArray(e)?e:e.split(/\s+/).filter(Boolean),n=new Set;for(let e of t)if(x.has(e)&&(n.add(e),!i))break;k(n)};T.push(h(t,`click`,e=>{if(E())return;let t=e.target.closest?.(`[data-slot="toggle-group-item"]`);if(!t)return;let n=S.get(t);!n||D(n)||j(n.value)}));let N=a===`horizontal`,P=N?`ArrowLeft`:`ArrowUp`,F=N?`ArrowRight`:`ArrowDown`;return T.push(h(t,`keydown`,e=>{if(E())return;let t=e.target.closest?.(`[data-slot="toggle-group-item"]`);if(!t)return;let n=S.get(t);if(!n)return;if(e.key===`Enter`||e.key===` `){D(n)&&e.preventDefault();return}let r=O();if(r.length===0)return;let i=r.findIndex(e=>e.el===t);i===-1&&(i=0);let a=i;switch(e.key){case P:a=i-1,a<0&&(a=o?r.length-1:0);break;case F:a=i+1,a>=r.length&&(a=o?0:r.length-1);break;case`Home`:a=0;break;case`End`:a=r.length-1;break;default:return}e.preventDefault();let s=r[a];if(s){for(let e of b)e.el.tabIndex=e===s?0:-1;s.el.focus()}})),T.push(h(t,`toggle-group:set`,e=>{if(E())return;let t=e,n=t.detail,r;if(typeof n==`string`)r=n;else if(Array.isArray(n))r=n;else if(n&&typeof n==`object`&&`value`in n)r=n.value;else return;M(r)})),{setValue:e=>M(e),toggle:e=>j(e),get value(){return[...w]},destroy:()=>{T.forEach(e=>e()),T.length=0,y.delete(t)}}}const y=new WeakSet;function b(e=document){let n=[];for(let r of t(e,`toggle-group`)){if(y.has(r))continue;y.add(r),n.push(v(r))}return n}export{b as create,v as createToggleGroup};
+const e=(e,t)=>[...e.querySelectorAll(`[data-slot="${t}"]`)],t=(e,t)=>[...e.querySelectorAll(`[data-slot="${t}"]`)],n=new WeakMap;function r(e,t,r){if(typeof process<`u`&&process.env?.NODE_ENV===`production`)return;let i=n.get(e);i||(i=new Set,n.set(e,i)),!i.has(t)&&(i.add(t),console.warn(`[@data-slot] ${r}`))}function i(e){let t=`data-${e.replace(/([A-Z])/g,`-$1`).toLowerCase()}`,n=`data-${e}`;return t===n?[t]:[t,n]}function a(e,t){for(let n of i(t))if(e.hasAttribute(n))return e.getAttribute(n);return null}function o(e,t){return i(t).some(t=>e.hasAttribute(t))}const s=new Set([``,`true`,`1`,`yes`]),c=new Set([`false`,`0`,`no`]);function l(e,t){if(!o(e,t))return;let n=a(e,t);if(n===null)return;let i=n.toLowerCase();if(s.has(i))return!0;if(c.has(i))return!1;r(e,t,`Invalid boolean value "${n}" for data-${t}. Expected: true/false/1/0/yes/no or empty.`)}function u(e,t){if(o(e,t))return a(e,t)??void 0}function d(e,t,n){let i=a(e,t);if(i!==null){if(n.includes(i))return i;r(e,t,`Invalid value "${i}" for data-${t}. Expected one of: ${n.join(`, `)}.`)}}let f=0;const p=(e,t)=>e.id||=`${t}-${++f}`,m=(e,t,n)=>{n===null?e.removeAttribute(`aria-${t}`):e.setAttribute(`aria-${t}`,String(n))};function h(e,t,n,r){return e.addEventListener(t,n,r),()=>e.removeEventListener(t,n,r)}const g=(e,t,n)=>e.dispatchEvent(new CustomEvent(t,{bubbles:!0,detail:n})),_=[`horizontal`,`vertical`];function v(t,n={}){let r=e(t,`toggle-group-item`);if(r.length===0)throw Error(`ToggleGroup requires at least one toggle-group-item`);let i=n.multiple??l(t,`multiple`)??!1,a=n.orientation??d(t,`orientation`,_)??`horizontal`,o=n.loop??l(t,`loop`)??!0,s=n.disabled??l(t,`disabled`)??!1,c=n.onValueChange,f=()=>{if(n.defaultValue!==void 0)return Array.isArray(n.defaultValue)?n.defaultValue:n.defaultValue.split(/\s+/).filter(Boolean);let e=u(t,`defaultValue`);return e?e.split(/\s+/).filter(Boolean):[]},v=f(),b=[],x=new Map,S=new Map,C=[];for(let e of r){let t=(e.dataset.value||``).trim();if(!t){C.push(e);continue}let n=e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,r={el:e,value:t,disabled:n};b.push(r),x.set(t,r),S.set(e,r)}for(let e of C)e.tabIndex=-1,e.setAttribute(`aria-disabled`,`true`);if(b.length===0)throw Error(`ToggleGroup requires at least one toggle-group-item with a data-value attribute`);let w=new Set;for(let e of v)if(x.has(e)&&(w.add(e),!i))break;let T=[],E=()=>t.hasAttribute(`disabled`)||t.hasAttribute(`data-disabled`)||t.getAttribute(`aria-disabled`)===`true`,D=e=>e.el.hasAttribute(`disabled`)||e.el.hasAttribute(`data-disabled`)||e.el.getAttribute(`aria-disabled`)===`true`,O=()=>b.filter(e=>!D(e));t.setAttribute(`role`,`group`),s&&t.setAttribute(`aria-disabled`,`true`),a===`vertical`&&m(t,`orientation`,`vertical`),i&&(t.dataset.multiple=``);for(let e of b){let{el:t,disabled:n}=e;p(t,`toggle-group-item`),t.tagName===`BUTTON`&&!t.hasAttribute(`type`)&&(t.type=`button`),n&&(t.setAttribute(`aria-disabled`,`true`),t.tagName===`BUTTON`&&(t.disabled=!0))}let k=(e,n=!1)=>{let r=!n&&(e.size!==w.size||[...e].some(e=>!w.has(e)));w=e;for(let e of b){let t=w.has(e.value);m(e.el,`pressed`,t),e.el.dataset.state=t?`on`:`off`}A();let i=[...w];t.setAttribute(`data-value`,i.join(` `)),r&&(g(t,`toggle-group:change`,{value:i}),c?.(i))},A=()=>{let e=O(),t;for(let n of e)if(w.has(n.value)){t=n;break}!t&&e.length>0&&(t=e[0]);for(let e of b)e.el.tabIndex=e===t?0:-1};k(w,!0);let j=e=>{let t=new Set(w);i?t.has(e)?t.delete(e):t.add(e):t.has(e)?t.clear():(t.clear(),t.add(e)),k(t)},M=e=>{let t=Array.isArray(e)?e:e.split(/\s+/).filter(Boolean),n=new Set;for(let e of t)if(x.has(e)&&(n.add(e),!i))break;k(n)};T.push(h(t,`click`,e=>{if(E())return;let t=e.target.closest?.(`[data-slot="toggle-group-item"]`);if(!t)return;let n=S.get(t);!n||D(n)||j(n.value)}));let N=a===`horizontal`,P=N?`ArrowLeft`:`ArrowUp`,F=N?`ArrowRight`:`ArrowDown`;return T.push(h(t,`keydown`,e=>{if(E())return;let t=e.target.closest?.(`[data-slot="toggle-group-item"]`);if(!t)return;let n=S.get(t);if(!n)return;if(e.key===`Enter`||e.key===` `){D(n)&&e.preventDefault();return}let r=O();if(r.length===0)return;let i=r.findIndex(e=>e.el===t);i===-1&&(i=0);let a=i;switch(e.key){case P:a=i-1,a<0&&(a=o?r.length-1:0);break;case F:a=i+1,a>=r.length&&(a=o?0:r.length-1);break;case`Home`:a=0;break;case`End`:a=r.length-1;break;default:return}e.preventDefault();let s=r[a];if(s){for(let e of b)e.el.tabIndex=e===s?0:-1;s.el.focus()}})),T.push(h(t,`toggle-group:set`,e=>{if(E())return;let t=e,n=t.detail,r;typeof n==`string`||Array.isArray(n)?r=n:n&&typeof n==`object`&&`value`in n&&(r=n.value),r!==void 0&&M(r)})),{setValue:e=>M(e),toggle:e=>j(e),get value(){return[...w]},destroy:()=>{T.forEach(e=>e()),T.length=0,y.delete(t)}}}const y=new WeakSet;function b(e=document){let n=[];for(let r of t(e,`toggle-group`)){if(y.has(r))continue;y.add(r),n.push(v(r))}return n}export{b as create,v as createToggleGroup};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@data-slot/toggle-group",
-  "version": "0.2.10",
+  "version": "0.2.12",
   "type": "module",
   "sideEffects": false,
   "main": "./dist/index.cjs",