@compa11y/react 0.1.0 → 0.1.3

package/README.md

@@ -75,11 +75,7 @@ function SettingsTabs() {
 ### Toast
 
 ```tsx
-import {
-  ToastProvider,
-  ToastViewport,
-  useToastHelpers,
-} from '@compa11y/react';
+import { ToastProvider, ToastViewport, useToastHelpers } from '@compa11y/react';
 
 function App() {
   return (
@@ -125,6 +121,430 @@ function CountrySelect() {
 }
 ```
 
+### Select
+
+```tsx
+import { Select } from '@compa11y/react';
+
+const fruits = [
+  { value: 'apple', label: 'Apple' },
+  { value: 'banana', label: 'Banana' },
+  { value: 'cherry', label: 'Cherry' },
+  { value: 'dragonfruit', label: 'Dragon Fruit', disabled: true },
+  { value: 'elderberry', label: 'Elderberry' },
+];
+
+function FruitPicker() {
+  const [value, setValue] = useState(null);
+
+  return (
+    <Select
+      options={fruits}
+      value={value}
+      onValueChange={setValue}
+      aria-label="Choose a fruit"
+    >
+      <Select.Trigger placeholder="Pick a fruit..." />
+      <Select.Listbox />
+    </Select>
+  );
+}
+```
+
+**Keyboard Navigation:**
+
+| Key               | Action                                    |
+| ----------------- | ----------------------------------------- |
+| `Enter` / `Space` | Open listbox or select highlighted option |
+| `ArrowDown`       | Open listbox / move highlight down        |
+| `ArrowUp`         | Open listbox / move highlight up          |
+| `Home` / `End`    | Jump to first / last option               |
+| `Escape`          | Close listbox                             |
+| `Tab`             | Close listbox and move focus              |
+| Type characters   | Jump to matching option (type-ahead)      |
+
+**Props:**
+
+| Prop              | Type                              | Default                 | Description                  |
+| ----------------- | --------------------------------- | ----------------------- | ---------------------------- |
+| `options`         | `SelectOption[]`                  | —                       | List of options              |
+| `value`           | `string \| null`                  | —                       | Controlled selected value    |
+| `defaultValue`    | `string`                          | —                       | Default value (uncontrolled) |
+| `onValueChange`   | `(value: string \| null) => void` | —                       | Change handler               |
+| `placeholder`     | `string`                          | `'Select an option...'` | Trigger placeholder text     |
+| `disabled`        | `boolean`                         | `false`                 | Disable the select           |
+| `aria-label`      | `string`                          | —                       | Accessible label             |
+| `aria-labelledby` | `string`                          | —                       | ID of labelling element      |
+
+### Switch
+
+```tsx
+import { Switch } from '@compa11y/react';
+
+function NotificationSettings() {
+  const [enabled, setEnabled] = useState(false);
+
+  return (
+    <Switch checked={enabled} onCheckedChange={setEnabled}>
+      Enable notifications
+    </Switch>
+  );
+}
+```
+
+**Customization:**
+
+```css
+.my-switch {
+  --compa11y-switch-bg: #d1d5db;
+  --compa11y-switch-checked-bg: #10b981;
+  --compa11y-switch-thumb-bg: white;
+  --compa11y-switch-width: 3rem;
+  --compa11y-switch-height: 1.75rem;
+  --compa11y-focus-color: #10b981;
+}
+```
+
+### Listbox
+
+```tsx
+import { Listbox } from '@compa11y/react';
+
+// Single select (selection follows focus)
+function FruitPicker() {
+  const [fruit, setFruit] = useState('apple');
+
+  return (
+    <Listbox value={fruit} onValueChange={setFruit} aria-label="Favorite fruit">
+      <Listbox.Group label="Citrus">
+        <Listbox.Option value="orange">Orange</Listbox.Option>
+        <Listbox.Option value="lemon">Lemon</Listbox.Option>
+        <Listbox.Option value="grapefruit">Grapefruit</Listbox.Option>
+      </Listbox.Group>
+      <Listbox.Option value="apple">Apple</Listbox.Option>
+      <Listbox.Option value="banana" disabled>
+        Banana (sold out)
+      </Listbox.Option>
+    </Listbox>
+  );
+}
+
+// Multi select (focus independent of selection)
+function ToppingsPicker() {
+  const [toppings, setToppings] = useState(['cheese']);
+
+  return (
+    <Listbox
+      multiple
+      value={toppings}
+      onValueChange={setToppings}
+      aria-label="Pizza toppings"
+    >
+      <Listbox.Option value="cheese">Cheese</Listbox.Option>
+      <Listbox.Option value="pepperoni">Pepperoni</Listbox.Option>
+      <Listbox.Option value="mushrooms">Mushrooms</Listbox.Option>
+      <Listbox.Option value="olives">Olives</Listbox.Option>
+    </Listbox>
+  );
+}
+```
+
+**Props (Listbox):**
+
+| Prop              | Type                                  | Default      | Description                                           |
+| ----------------- | ------------------------------------- | ------------ | ----------------------------------------------------- |
+| `value`           | `string \| string[]`                  | —            | Controlled value (string for single, array for multi) |
+| `defaultValue`    | `string \| string[]`                  | —            | Default value (uncontrolled)                          |
+| `onValueChange`   | `(value: string \| string[]) => void` | —            | Change handler                                        |
+| `multiple`        | `boolean`                             | `false`      | Enable multi-select mode                              |
+| `disabled`        | `boolean`                             | `false`      | Disable all options                                   |
+| `discoverable`    | `boolean`                             | `true`       | Keep disabled listbox in tab order                    |
+| `orientation`     | `'horizontal' \| 'vertical'`          | `'vertical'` | Layout orientation                                    |
+| `unstyled`        | `boolean`                             | `false`      | Remove default styles                                 |
+| `aria-label`      | `string`                              | —            | Accessible label                                      |
+| `aria-labelledby` | `string`                              | —            | ID of labelling element                               |
+
+**Props (Listbox.Option):**
+
+| Prop           | Type      | Default | Description                                |
+| -------------- | --------- | ------- | ------------------------------------------ |
+| `value`        | `string`  | —       | Value for this option (required)           |
+| `disabled`     | `boolean` | `false` | Disable this option                        |
+| `discoverable` | `boolean` | `true`  | Keep disabled option discoverable          |
+| `unstyled`     | `boolean` | —       | Remove default styles (inherits from root) |
+| `aria-label`   | `string`  | —       | Accessible label override                  |
+
+**Props (Listbox.Group):**
+
+| Prop       | Type      | Default | Description                                |
+| ---------- | --------- | ------- | ------------------------------------------ |
+| `label`    | `string`  | —       | Group label (required, visible)            |
+| `disabled` | `boolean` | `false` | Disable all options in group               |
+| `unstyled` | `boolean` | —       | Remove default styles (inherits from root) |
+
+**Keyboard Navigation:**
+
+| Key                     | Single Select                | Multi Select               |
+| ----------------------- | ---------------------------- | -------------------------- |
+| `ArrowDown` / `ArrowUp` | Move focus and select        | Move focus only            |
+| `Home` / `End`          | First/last option and select | Move focus only            |
+| `Space`                 | —                            | Toggle focused option      |
+| `Shift+Arrow`           | —                            | Move focus and toggle      |
+| `Ctrl+Shift+Home/End`   | —                            | Select range to first/last |
+| `Ctrl+A`                | —                            | Toggle select all          |
+| Type characters         | Jump to match and select     | Jump to match              |
+
+**Customization:**
+
+```css
+[data-compa11y-listbox] {
+  --compa11y-listbox-bg: white;
+  --compa11y-listbox-border: 1px solid #ccc;
+  --compa11y-listbox-radius: 6px;
+  --compa11y-listbox-max-height: 300px;
+}
+
+[data-compa11y-listbox-option] {
+  --compa11y-option-hover-bg: #f5f5f5;
+  --compa11y-option-focused-bg: #e6f0ff;
+  --compa11y-option-selected-bg: #e6f0ff;
+  --compa11y-option-selected-color: #10b981;
+  --compa11y-option-check-color: #10b981;
+  --compa11y-option-disabled-color: #999;
+  --compa11y-focus-color: #10b981;
+}
+```
+
+### Input
+
+```tsx
+import { Input } from '@compa11y/react';
+
+function ContactForm() {
+  const [name, setName] = useState('');
+  const [nameError, setNameError] = useState('');
+
+  const validate = () => {
+    if (!name.trim()) setNameError('Name is required');
+    else setNameError('');
+  };
+
+  return (
+    <Input
+      label="Full Name"
+      hint="Enter your first and last name"
+      error={nameError || undefined}
+      required
+      placeholder="John Doe"
+      value={name}
+      onValueChange={setName}
+      onBlur={validate}
+    />
+  );
+}
+
+// Compound mode for custom layouts
+function CustomInput() {
+  const [value, setValue] = useState('');
+
+  return (
+    <Input value={value} onValueChange={setValue}>
+      <Input.Label>Email</Input.Label>
+      <Input.Field type="email" placeholder="you@example.com" />
+      <Input.Hint>We'll never share your email</Input.Hint>
+      <Input.Error>{/* error message here */}</Input.Error>
+    </Input>
+  );
+}
+```
+
+**Props:**
+
+| Prop              | Type                      | Default  | Description                                                  |
+| ----------------- | ------------------------- | -------- | ------------------------------------------------------------ |
+| `label`           | `ReactNode`               | —        | Visible label text                                           |
+| `hint`            | `ReactNode`               | —        | Hint/description text                                        |
+| `error`           | `ReactNode`               | —        | Error message (enables `aria-invalid`)                       |
+| `value`           | `string`                  | —        | Controlled value                                             |
+| `defaultValue`    | `string`                  | `''`     | Default value (uncontrolled)                                 |
+| `onValueChange`   | `(value: string) => void` | —        | Change handler                                               |
+| `type`            | `string`                  | `'text'` | Input type (text, email, password, number, tel, url, search) |
+| `placeholder`     | `string`                  | —        | Placeholder text                                             |
+| `required`        | `boolean`                 | `false`  | Required field                                               |
+| `disabled`        | `boolean`                 | `false`  | Disable the input                                            |
+| `readOnly`        | `boolean`                 | `false`  | Read-only input                                              |
+| `unstyled`        | `boolean`                 | `false`  | Remove default styles                                        |
+| `aria-label`      | `string`                  | —        | Accessible label (when no visible label)                     |
+| `aria-labelledby` | `string`                  | —        | ID of labelling element                                      |
+
+**Customization:**
+
+```css
+.my-input {
+  --compa11y-input-border: 1px solid #ccc;
+  --compa11y-input-border-focus: #10b981;
+  --compa11y-input-border-error: #ef4444;
+  --compa11y-input-radius: 8px;
+  --compa11y-input-label-weight: 600;
+  --compa11y-input-error-color: #ef4444;
+  --compa11y-input-hint-color: #666;
+  --compa11y-focus-color: #10b981;
+}
+```
+
+### Button
+
+```tsx
+import { Button } from '@compa11y/react';
+
+function Actions() {
+  return (
+    <div style={{ display: 'flex', gap: '0.5rem' }}>
+      <Button variant="primary" onClick={handleSave}>
+        Save
+      </Button>
+      <Button variant="outline" onClick={handleCancel}>
+        Cancel
+      </Button>
+      <Button variant="danger" onClick={handleDelete}>
+        Delete
+      </Button>
+    </div>
+  );
+}
+
+// Loading state
+function SaveButton() {
+  const [loading, setLoading] = useState(false);
+
+  const handleSave = async () => {
+    setLoading(true);
+    await saveData();
+    setLoading(false);
+  };
+
+  return (
+    <Button variant="primary" loading={loading} onClick={handleSave}>
+      {loading ? 'Saving...' : 'Save Changes'}
+    </Button>
+  );
+}
+
+// Disabled but discoverable (stays in tab order)
+<Button variant="primary" disabled discoverable>
+  Unavailable
+</Button>;
+```
+
+**Props:**
+
+| Prop           | Type                                                           | Default       | Description                                            |
+| -------------- | -------------------------------------------------------------- | ------------- | ------------------------------------------------------ |
+| `variant`      | `'primary' \| 'secondary' \| 'danger' \| 'outline' \| 'ghost'` | `'secondary'` | Visual variant                                         |
+| `size`         | `'sm' \| 'md' \| 'lg'`                                         | `'md'`        | Button size                                            |
+| `type`         | `'button' \| 'submit' \| 'reset'`                              | `'button'`    | HTML button type                                       |
+| `disabled`     | `boolean`                                                      | `false`       | Disable the button                                     |
+| `discoverable` | `boolean`                                                      | `false`       | Keep disabled button in tab order with `aria-disabled` |
+| `loading`      | `boolean`                                                      | `false`       | Loading state (shows spinner, sets `aria-busy`)        |
+| `unstyled`     | `boolean`                                                      | `false`       | Remove default styles                                  |
+| `aria-label`   | `string`                                                       | —             | Accessible label                                       |
+
+**Customization:**
+
+```css
+[data-compa11y-button] {
+  --compa11y-button-radius: 8px;
+  --compa11y-button-font-weight: 600;
+  --compa11y-button-primary-bg: #10b981;
+  --compa11y-button-primary-color: white;
+  --compa11y-button-danger-bg: #ef4444;
+  --compa11y-button-danger-color: white;
+  --compa11y-button-disabled-opacity: 0.5;
+  --compa11y-focus-color: #10b981;
+}
+```
+
+### Textarea
+
+```tsx
+import { Textarea } from '@compa11y/react';
+
+function FeedbackForm() {
+  const [desc, setDesc] = useState('');
+  const [descError, setDescError] = useState('');
+
+  const validate = () => {
+    if (!desc.trim()) setDescError('Description is required');
+    else if (desc.trim().length < 10)
+      setDescError('Must be at least 10 characters');
+    else setDescError('');
+  };
+
+  return (
+    <Textarea
+      label="Description"
+      hint="Provide at least 10 characters"
+      error={descError || undefined}
+      required
+      rows={4}
+      placeholder="Enter a description..."
+      value={desc}
+      onValueChange={setDesc}
+      onBlur={validate}
+    />
+  );
+}
+
+// Compound mode for custom layouts
+function CustomTextarea() {
+  const [value, setValue] = useState('');
+
+  return (
+    <Textarea value={value} onValueChange={setValue}>
+      <Textarea.Label>Bio</Textarea.Label>
+      <Textarea.Field rows={5} placeholder="Tell us about yourself..." />
+      <Textarea.Hint>Markdown is supported</Textarea.Hint>
+      <Textarea.Error>{/* error message here */}</Textarea.Error>
+    </Textarea>
+  );
+}
+```
+
+**Props:**
+
+| Prop              | Type                      | Default      | Description                                        |
+| ----------------- | ------------------------- | ------------ | -------------------------------------------------- |
+| `label`           | `ReactNode`               | —            | Visible label text                                 |
+| `hint`            | `ReactNode`               | —            | Hint/description text                              |
+| `error`           | `ReactNode`               | —            | Error message (enables `aria-invalid`)             |
+| `value`           | `string`                  | —            | Controlled value                                   |
+| `defaultValue`    | `string`                  | `''`         | Default value (uncontrolled)                       |
+| `onValueChange`   | `(value: string) => void` | —            | Change handler                                     |
+| `rows`            | `number`                  | `3`          | Number of visible text rows                        |
+| `resize`          | `string`                  | `'vertical'` | Resize behavior (none, both, horizontal, vertical) |
+| `placeholder`     | `string`                  | —            | Placeholder text                                   |
+| `required`        | `boolean`                 | `false`      | Required field                                     |
+| `disabled`        | `boolean`                 | `false`      | Disable the textarea                               |
+| `readOnly`        | `boolean`                 | `false`      | Read-only textarea                                 |
+| `unstyled`        | `boolean`                 | `false`      | Remove default styles                              |
+| `aria-label`      | `string`                  | —            | Accessible label (when no visible label)           |
+| `aria-labelledby` | `string`                  | —            | ID of labelling element                            |
+
+**Customization:**
+
+```css
+.my-textarea {
+  --compa11y-textarea-border: 1px solid #ccc;
+  --compa11y-textarea-border-focus: #10b981;
+  --compa11y-textarea-border-error: #ef4444;
+  --compa11y-textarea-radius: 8px;
+  --compa11y-textarea-label-weight: 600;
+  --compa11y-textarea-error-color: #ef4444;
+  --compa11y-textarea-hint-color: #666;
+  --compa11y-focus-color: #10b981;
+}
+```
+
 ## Hooks
 
 ### useFocusTrap
@@ -245,6 +665,68 @@ All components are unstyled. Use `data-*` attributes for state-based styling:
 [data-compa11y-combobox-option][data-highlighted='true'] {
   background: #f0f0f0;
 }
+
+/* Listbox */
+[data-compa11y-listbox] {
+  border: 1px solid #e0e0e0;
+  border-radius: 6px;
+  max-height: 300px;
+  overflow-y: auto;
+}
+
+[data-compa11y-listbox-option][data-focused='true'] {
+  background: #e6f0ff;
+}
+
+[data-compa11y-listbox-option][data-selected='true'] {
+  background: #e6f0ff;
+  font-weight: 600;
+}
+
+/* Select */
+[data-compa11y-select] {
+  position: relative;
+  width: 300px;
+}
+
+[data-compa11y-select-trigger] {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0.5rem 2rem 0.5rem 0.75rem;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+  background: white;
+  cursor: pointer;
+  text-align: left;
+}
+
+[data-compa11y-select-listbox] {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  right: 0;
+  margin-top: 4px;
+  background: white;
+  border: 1px solid #e0e0e0;
+  border-radius: 4px;
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+  max-height: 200px;
+  overflow-y: auto;
+  z-index: 1000;
+  list-style: none;
+  padding: 0;
+}
+
+[data-compa11y-select-option][data-highlighted='true'] {
+  background: #f0f0f0;
+}
+
+[data-compa11y-select-option][data-selected='true'] {
+  background: #e6f0ff;
+  font-weight: 600;
+}
 ```
 
 ## License

package/dist/chunk-36S2JYVF.cjs

@@ -0,0 +1 @@
+'use strict';var chunkAJ7JSWUT_cjs=require('./chunk-AJ7JSWUT.cjs'),chunkMAR6RBHF_cjs=require('./chunk-MAR6RBHF.cjs'),react=require('react'),jsxRuntime=require('react/jsx-runtime');var V=react.createContext(null);function S(){let M=react.useContext(V);if(!M)throw new Error("ActionMenu compound components must be used within an ActionMenu component");return M}var D=V.Provider;function O({defaultOpen:M=false,open:u,onOpenChange:e,children:f,unstyled:h=false}){let[d,i]=react.useState(M),c=u??d,[x,a]=react.useState(-1),r=react.useRef([]),p=react.useRef(null),m=chunkMAR6RBHF_cjs.a("action-menu"),y=chunkMAR6RBHF_cjs.a("action-menu-trigger"),n=react.useCallback(o=>{u===void 0&&i(o),e?.(o),o||a(-1);},[u,e]),l=react.useCallback(()=>n(true),[n]),g=react.useCallback(()=>n(false),[n]),s=react.useCallback(()=>n(!c),[n,c]),E=react.useCallback(o=>{let v=r.current.length;return r.current.push(o),v},[]),R=react.useCallback(o=>{let v=r.current.indexOf(o);v>-1&&r.current.splice(v,1);},[]),P=react.useCallback(()=>r.current.length,[]),t=react.useCallback(o=>{p.current?.(o),g();},[g]);return jsxRuntime.jsx(D,{value:{isOpen:c,open:l,close:g,toggle:s,highlightedIndex:x,setHighlightedIndex:a,menuId:m,triggerId:y,registerItem:E,unregisterItem:R,getItemCount:P,selectItem:t,unstyled:h},children:jsxRuntime.jsx("div",{style:{position:"relative",display:"inline-block"},"data-compa11y-action-menu":true,children:f})})}var B=react.forwardRef(function({children:u,onClick:e,onKeyDown:f,...h},d){let{isOpen:i,toggle:c,open:x,close:a,triggerId:r,menuId:p,setHighlightedIndex:m,getItemCount:y}=S(),n=s=>{e?.(s),s.defaultPrevented||c();},l=chunkAJ7JSWUT_cjs.a({ArrowDown:()=>{i||x(),m(0);},ArrowUp:()=>{i||x(),m(y()-1);},Enter:()=>c(),Space:()=>c(),Escape:()=>a()},{preventDefault:true});return jsxRuntime.jsx("button",{ref:d,id:r,type:"button",tabIndex:0,"aria-haspopup":"menu","aria-expanded":i,"aria-controls":i?p:void 0,onClick:n,onKeyDown:s=>{f?.(s),s.defaultPrevented||l.onKeyDown(s);},"data-compa11y-action-menu-trigger":true,...h,children:u})}),N=react.forwardRef(function({children:u,onKeyDown:e,style:f,...h},d){let{isOpen:i,close:c,menuId:x,triggerId:a,highlightedIndex:r,setHighlightedIndex:p,getItemCount:m,unstyled:y}=S(),n=react.useRef(null),l=()=>{if(r>=0&&n.current){let A=n.current.querySelectorAll('[role="menuitem"]')[r];A&&A.getAttribute("aria-disabled")!=="true"&&A.click();}},g=chunkAJ7JSWUT_cjs.a({ArrowDown:()=>{let t=m();p((r+1)%t);},ArrowUp:()=>{let t=m();p((r-1+t)%t);},Home:()=>p(0),End:()=>p(m()-1),Enter:()=>l(),Space:()=>l(),Escape:()=>c(),Tab:()=>(c(),false)},{preventDefault:true}),s=t=>{e?.(t),t.defaultPrevented||g.onKeyDown(t);};if(react.useEffect(()=>{i&&n.current&&n.current.focus();},[i]),react.useEffect(()=>{if(!i)return;let t=A=>{let o=A.target,v=n.current,k=document.getElementById(a);v&&!v.contains(o)&&k&&!k.contains(o)&&c();};return document.addEventListener("mousedown",t),()=>document.removeEventListener("mousedown",t)},[i,c,a]),!i)return null;let P={...{position:"absolute",top:"100%",left:0,marginTop:"4px",zIndex:1e3},...y?{}:{minWidth:"160px",backgroundColor:"white",border:"1px solid #e0e0e0",borderRadius:"4px",boxShadow:"0 4px 6px rgba(0, 0, 0, 0.1)",padding:"4px 0"}};return jsxRuntime.jsx("div",{ref:t=>{n.current=t,typeof d=="function"?d(t):d&&(d.current=t);},id:x,role:"menu","aria-labelledby":a,tabIndex:-1,onKeyDown:s,style:{...P,...f},"data-compa11y-action-menu-content":true,...h,children:u})}),U=react.forwardRef(function({children:u,disabled:e=false,onSelect:f,onClick:h,onMouseEnter:d,style:i,...c},x){let{registerItem:a,unregisterItem:r,highlightedIndex:p,setHighlightedIndex:m,close:y,unstyled:n}=S(),l=chunkMAR6RBHF_cjs.a("action-menu-item"),g=react.useRef(-1);react.useEffect(()=>(e||(g.current=a(l)),()=>{e||r(l);}),[l,e,a,r]);let s=g.current===p,E=o=>{h?.(o),!o.defaultPrevented&&!e&&(f?.(),y());},R=o=>{d?.(o),e||m(g.current);},A={...{cursor:e?"not-allowed":"pointer",opacity:e?.5:1},...n?{}:{padding:"8px 16px",backgroundColor:s?"#f0f0f0":"transparent"}};return jsxRuntime.jsx("div",{ref:x,id:l,role:"menuitem",tabIndex:-1,"aria-disabled":e,"data-highlighted":s,"data-disabled":e,onClick:E,onMouseEnter:R,style:{...A,...i},"data-compa11y-action-menu-item":true,...c,children:u})}),j=react.forwardRef(function(u,e){return jsxRuntime.jsx("div",{ref:e,role:"separator","data-compa11y-action-menu-separator":true,...u})}),q=react.forwardRef(function({children:u,...e},f){return jsxRuntime.jsx("div",{ref:f,role:"presentation","data-compa11y-action-menu-label":true,...e,children:u})}),F=Object.assign(O,{Trigger:B,Content:N,Item:U,Separator:j,Label:q});exports.a=S;exports.b=D;exports.c=O;exports.d=B;exports.e=N;exports.f=U;exports.g=j;exports.h=q;exports.i=F;

package/dist/chunk-AJ7JSWUT.cjs

@@ -0,0 +1 @@
+'use strict';var react=require('react'),core=require('@compa11y/core');function f(e,n={}){let{preventDefault:o=true,stopPropagation:r=true,disabled:d=false}=n,t=react.useRef(e);return t.current=e,{onKeyDown:react.useCallback(i=>{if(d)return;let a=core.getKeyCombo(i.nativeEvent),s=t.current[a];if(!s){let b=core.normalizeKey(i.nativeEvent);s=t.current[b];}s&&s(i.nativeEvent)!==false&&(o&&i.preventDefault(),r&&i.stopPropagation());},[d,o,r])}}function w(e){let{disabled:n,...o}=e;return f(core.KeyboardPatterns.menu(o),{disabled:n})}function k(e){let{disabled:n,...o}=e;return f(core.KeyboardPatterns.tabs(o),{disabled:n})}function R(e){let{disabled:n,...o}=e;return f(core.KeyboardPatterns.grid(o),{disabled:n})}function x(e,n,o={}){let{timeout:r=500,disabled:d=false}=o,t=react.useMemo(()=>core.createTypeAhead(e,{timeout:r}),[e,r]),u=react.useRef(n);return u.current=n,{onKeyDown:react.useCallback(a=>{if(d||a.key.length!==1||a.ctrlKey||a.altKey||a.metaKey)return;let s=t.type(a.key);s&&u.current(s);},[d,t]),reset:t.reset,getSearch:t.getSearch}}function H(e){let[n,o]=react.useState(false);return react.useEffect(()=>{let r=t=>{core.normalizeKey(t)===e&&o(true);},d=t=>{core.normalizeKey(t)===e&&o(false);};return document.addEventListener("keydown",r),document.addEventListener("keyup",d),()=>{document.removeEventListener("keydown",r),document.removeEventListener("keyup",d);}},[e]),n}exports.a=f;exports.b=w;exports.c=k;exports.d=R;exports.e=x;exports.f=H;

package/dist/chunk-DDFEION3.cjs

@@ -0,0 +1 @@
+'use strict';var react=require('react'),reactDom=require('react-dom'),core=require('@compa11y/core'),jsxRuntime=require('react/jsx-runtime');var g=react.createContext(null);function y(){let t=react.useContext(g);if(!t)throw new Error("useToast must be used within a ToastProvider");return t}function D({children:t,duration:e=5e3,maxToasts:r=5}){let[T,s]=react.useState([]),n=react.useRef(0),d=react.useCallback(o=>{let i=`toast-${++n.current}`,p={...o,id:i,duration:o.duration??e};s(b=>[...b,p].slice(-r));let c=o.title?`${o.title}. ${o.description||""}`:o.description||"";return o.type==="error"?core.announceAssertive(c):core.announce(c,{politeness:"polite"}),i},[e,r]),u=react.useCallback(o=>{s(i=>i.filter(p=>p.id!==o));},[]),a=react.useCallback((o,i)=>{s(p=>p.map(c=>c.id===o?{...c,...i}:c));},[]);return jsxRuntime.jsx(g.Provider,{value:{toasts:T,addToast:d,removeToast:u,updateToast:a},children:t})}var V={"top-left":{top:0,left:0},"top-center":{top:0,left:"50%",transform:"translateX(-50%)"},"top-right":{top:0,right:0},"bottom-left":{bottom:0,left:0},"bottom-center":{bottom:0,left:"50%",transform:"translateX(-50%)"},"bottom-right":{bottom:0,right:0}},M=react.forwardRef(function({position:e="bottom-right",label:r="Notifications",style:T,children:s,...n},d){let{toasts:u,removeToast:a}=y(),o=jsxRuntime.jsxs("div",{ref:d,role:"region","aria-label":r,"aria-live":"polite","aria-relevant":"additions removals",tabIndex:-1,style:{position:"fixed",zIndex:9999,padding:"1rem",display:"flex",flexDirection:"column",gap:"0.5rem",...V[e],...T},"data-compa11y-toast-viewport":true,"data-position":e,...n,children:[u.map(i=>jsxRuntime.jsx(k,{toast:i,onClose:()=>a(i.id)},i.id)),s]});return reactDom.createPortal(o,document.body)});function k({toast:t,onClose:e}){let[r,T]=react.useState(true),[,s]=react.useState(false),n=react.useRef(null),d=react.useRef(t.duration||5e3),u=react.useRef(Date.now()),a=react.useCallback(()=>{t.duration!==0&&(u.current=Date.now(),n.current=setTimeout(()=>{T(false),setTimeout(e,200);},d.current));},[t.duration,e]),o=react.useCallback(()=>{n.current&&(clearTimeout(n.current),d.current-=Date.now()-u.current);},[]);return react.useEffect(()=>(a(),()=>{n.current&&clearTimeout(n.current);}),[a]),jsxRuntime.jsxs("div",{role:"alert","aria-atomic":"true",tabIndex:0,onMouseEnter:()=>{s(true),o();},onMouseLeave:()=>{s(false),a();},onKeyDown:b=>{b.key==="Escape"&&e();},"data-type":t.type,"data-visible":r,"data-compa11y-toast":true,children:[t.title&&jsxRuntime.jsx("div",{"data-compa11y-toast-title":true,children:t.title}),t.description&&jsxRuntime.jsx("div",{"data-compa11y-toast-description":true,children:t.description}),t.action&&jsxRuntime.jsx("button",{type:"button",tabIndex:0,onClick:()=>{t.action?.onClick(),e();},"data-compa11y-toast-action":true,children:t.action.label}),jsxRuntime.jsx("button",{type:"button",tabIndex:0,"aria-label":"Dismiss",onClick:e,"data-compa11y-toast-close":true,children:"\xD7"})]})}function L(){let{addToast:t}=y();return {toast:t,success:(e,r)=>t({type:"success",title:e,description:r}),error:(e,r)=>t({type:"error",title:e,description:r}),warning:(e,r)=>t({type:"warning",title:e,description:r}),info:(e,r)=>t({type:"info",title:e,description:r})}}exports.a=y;exports.b=D;exports.c=M;exports.d=L;

package/dist/chunk-DWU3PTJO.cjs

@@ -0,0 +1 @@
+'use strict';var chunkJS3UD7KS_cjs=require('./chunk-JS3UD7KS.cjs'),chunkAJ7JSWUT_cjs=require('./chunk-AJ7JSWUT.cjs'),chunkMAR6RBHF_cjs=require('./chunk-MAR6RBHF.cjs'),S=require('react'),jsxRuntime=require('react/jsx-runtime');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var S__default=/*#__PURE__*/_interopDefault(S);var E=S.createContext(null);function g(){let m=S.useContext(E);if(!m)throw new Error("Tabs compound components must be used within a Tabs component");return m}var w=E.Provider;var H=S.forwardRef(function({defaultValue:e="",value:t,onValueChange:d,orientation:T="horizontal",activationMode:f="automatic",children:a,...i},r){let[l,c]=S.useState(e),n=t??l,b=S.useRef([]),x=chunkMAR6RBHF_cjs.a("tabs"),u=S.useCallback(p=>{t===void 0&&c(p),d?.(p);},[t,d]),o=S.useCallback(p=>{b.current.includes(p)||b.current.push(p);},[]),v=S.useCallback(p=>{let y=b.current.indexOf(p);y>-1&&b.current.splice(y,1);},[]),s=S.useCallback(()=>[...b.current],[]);return jsxRuntime.jsx(w,{value:{selectedValue:n,setSelectedValue:u,baseId:x,orientation:T,activationMode:f,registerTab:o,unregisterTab:v,getTabValues:s},children:jsxRuntime.jsx("div",{ref:r,"data-orientation":T,"data-compa11y-tabs":true,...i,children:a})})}),D=S.forwardRef(function({children:e,"aria-label":t,onKeyDown:d,...T},f){let{orientation:a,selectedValue:i,setSelectedValue:r,getTabValues:l,activationMode:c}=g(),n=S.useCallback(u=>{let o=l();if(o.length===0)return;let v=o.indexOf(i),s;switch(u){case "next":s=(v+1)%o.length;break;case "previous":s=(v-1+o.length)%o.length;break;case "first":s=0;break;case "last":s=o.length-1;break}let L=o[s];L&&(document.querySelector(`[data-compa11y-tab][data-value="${L}"]`)?.focus(),c==="automatic"&&r(L));},[l,i,r,c]),b=chunkAJ7JSWUT_cjs.a({ArrowRight:()=>{a==="horizontal"&&n("next");},ArrowLeft:()=>{a==="horizontal"&&n("previous");},ArrowDown:()=>{a==="vertical"&&n("next");},ArrowUp:()=>{a==="vertical"&&n("previous");},Home:()=>n("first"),End:()=>n("last")},{preventDefault:true});return jsxRuntime.jsx("div",{ref:f,role:"tablist","aria-label":t,"aria-orientation":a,onKeyDown:u=>{d?.(u),u.defaultPrevented||b.onKeyDown(u);},"data-compa11y-tablist":true,...T,children:e})}),I=S.forwardRef(function({value:e,disabled:t=false,children:d,onClick:T,...f},a){let{selectedValue:i,setSelectedValue:r,baseId:l,registerTab:c,unregisterTab:n}=g(),{announce:b}=chunkJS3UD7KS_cjs.a();S__default.default.useEffect(()=>(c(e),()=>n(e)),[e,c,n]);let x=i===e,u=`${l}-tab-${e}`,o=`${l}-panel-${e}`;return jsxRuntime.jsx("button",{ref:a,type:"button",role:"tab",id:u,"aria-selected":x,"aria-controls":o,"aria-disabled":t,tabIndex:x?0:-1,onClick:s=>{T?.(s),!s.defaultPrevented&&!t&&(r(e),b(`${e} tab selected`));},disabled:t,"data-selected":x,"data-disabled":t,"data-value":e,"data-compa11y-tab":true,...f,children:d})}),$=S.forwardRef(function({value:e,forceMount:t=false,children:d,...T},f){let{selectedValue:a,baseId:i}=g(),r=a===e,l=`${i}-tab-${e}`,c=`${i}-panel-${e}`;return !r&&!t?null:jsxRuntime.jsx("div",{ref:f,role:"tabpanel",id:c,"aria-labelledby":l,tabIndex:0,hidden:!r,"data-selected":r,"data-compa11y-tabpanel":true,...T,children:d})}),B=Object.assign(H,{List:D,Tab:I,Panel:$});exports.a=g;exports.b=H;exports.c=D;exports.d=I;exports.e=$;exports.f=B;

package/dist/chunk-FD4F6ONU.cjs

@@ -0,0 +1 @@
+'use strict';var chunkJS3UD7KS_cjs=require('./chunk-JS3UD7KS.cjs'),chunkMAR6RBHF_cjs=require('./chunk-MAR6RBHF.cjs'),react=require('react'),reactDom=require('react-dom'),core=require('@compa11y/core'),jsxRuntime=require('react/jsx-runtime');function A(o={}){let{active:t=true,...e}=o,a=react.useRef(null),i=react.useRef(null);return react.useEffect(()=>{let n=a.current;if(n)return i.current=core.createFocusTrap(n,e),t&&i.current.activate(),()=>{i.current?.destroy(),i.current=null;}},[e.initialFocus,e.returnFocus,e.clickOutsideDeactivates,e.escapeDeactivates,e.onDeactivate]),react.useEffect(()=>{i.current&&(t?i.current.activate():i.current.deactivate());},[t]),a}function oe(o={}){let t=react.useRef(null),e=react.useRef(null),a=react.useCallback(()=>{let l=t.current;l&&(e.current||(e.current=core.createFocusTrap(l,o)),e.current.activate());},[o]),i=react.useCallback(()=>{e.current?.deactivate();},[]),n=react.useCallback(()=>{e.current?.pause();},[]),r=react.useCallback(()=>{e.current?.unpause();},[]);return react.useEffect(()=>()=>{e.current?.destroy(),e.current=null;},[]),{ref:t,activate:a,deactivate:i,pause:n,unpause:r,isActive:()=>e.current?.isActive()??false,isPaused:()=>e.current?.isPaused()??false}}var F=react.createContext(null);function p(){let o=react.useContext(F);if(!o)throw new Error("Dialog compound components must be used within a Dialog component");return o}var I=F.Provider;var Y=core.createComponentWarnings("Dialog");function N({open:o,onOpenChange:t,children:e,className:a,initialFocus:i,closeOnOutsideClick:n=true,closeOnEscape:r=true,container:l,"aria-label":u,"aria-labelledby":f,unstyled:y=false}){let v=chunkMAR6RBHF_cjs.a("dialog"),x=chunkMAR6RBHF_cjs.a("dialog-title"),C=chunkMAR6RBHF_cjs.a("dialog-desc"),[c,R]=react.useState(false),[P,H]=react.useState(false),h=react.useCallback(()=>{t(false);},[t]);react.useEffect(()=>{o&&!c&&!u&&!f&&Y.warning("Dialog has no accessible title. Add a DialogTitle or aria-label prop.",'Use <Dialog.Title> or provide aria-label="..."');},[o,c,u,f]);let E={isOpen:o,close:h,dialogId:v,titleId:x,descriptionId:C,hasTitle:c,hasDescription:P,setHasTitle:R,setHasDescription:H};if(!o)return null;let O=jsxRuntime.jsx(I,{value:E,children:jsxRuntime.jsx(Z,{className:a,closeOnOutsideClick:n,closeOnEscape:r,initialFocus:i,ariaLabel:u,ariaLabelledBy:f,unstyled:y,children:e})}),L=l??document.body;return reactDom.createPortal(O,L)}function Z({children:o,className:t,closeOnOutsideClick:e,closeOnEscape:a,initialFocus:i,ariaLabel:n,ariaLabelledBy:r,unstyled:l}){let{close:u,dialogId:f,titleId:y,descriptionId:v,hasTitle:x,hasDescription:C}=p(),{announce:c}=chunkJS3UD7KS_cjs.a(),R=A({active:true,initialFocus:i?.current??void 0,escapeDeactivates:a,clickOutsideDeactivates:false,onDeactivate:u});react.useEffect(()=>(c("Dialog opened",{politeness:"polite"}),()=>{c("Dialog closed",{politeness:"polite"});}),[c]),react.useEffect(()=>{let d=document.body.style.overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=d;}},[]);let P=d=>{e&&d.target===d.currentTarget&&u();},H=r??(x?y:void 0),h=C?v:void 0,E=d=>{d.stopPropagation();},q={...{position:"fixed",inset:0,display:"flex",alignItems:"center",justifyContent:"center",zIndex:9999},...l?{}:{backgroundColor:"rgba(0, 0, 0, 0.5)"}};return jsxRuntime.jsx("div",{className:t,style:q,onClick:P,"data-compa11y-dialog-overlay":true,children:jsxRuntime.jsx("div",{ref:R,id:f,role:"dialog","aria-modal":"true","aria-label":n,"aria-labelledby":H,"aria-describedby":h,onClick:E,style:l?{}:{backgroundColor:"white",borderRadius:"8px",padding:"1.5rem",minWidth:"300px",maxWidth:"500px",boxShadow:"0 10px 25px rgba(0, 0, 0, 0.2)"},"data-compa11y-dialog":true,children:o})})}var B=react.forwardRef(function({children:t,...e},a){return jsxRuntime.jsx("button",{ref:a,type:"button",tabIndex:0,"data-compa11y-dialog-trigger":true,...e,children:t})}),V=react.forwardRef(function({as:t="h2",children:e,...a},i){let{titleId:n,setHasTitle:r}=p();return react.useEffect(()=>(r(true),()=>r(false)),[r]),jsxRuntime.jsx(t,{ref:i,id:n,"data-compa11y-dialog-title":true,...a,children:e})}),j=react.forwardRef(function({children:t,...e},a){let{descriptionId:i,setHasDescription:n}=p();return react.useEffect(()=>(n(true),()=>n(false)),[n]),jsxRuntime.jsx("p",{ref:a,id:i,"data-compa11y-dialog-description":true,...e,children:t})}),U=react.forwardRef(function({children:t,onClick:e,...a},i){let{close:n}=p();return jsxRuntime.jsx("button",{ref:i,type:"button",tabIndex:0,onClick:l=>{e?.(l),l.defaultPrevented||n();},"aria-label":t?void 0:"Close dialog","data-compa11y-dialog-close":true,...a,children:t??"\xD7"})}),W=react.forwardRef(function({children:t,...e},a){return jsxRuntime.jsx("div",{ref:a,"data-compa11y-dialog-content":true,...e,children:t})}),z=react.forwardRef(function({children:t,...e},a){return jsxRuntime.jsx("div",{ref:a,"data-compa11y-dialog-actions":true,...e,children:t})}),_=Object.assign(N,{Trigger:B,Title:V,Description:j,Close:U,Content:W,Actions:z});exports.a=A;exports.b=oe;exports.c=p;exports.d=N;exports.e=B;exports.f=V;exports.g=j;exports.h=U;exports.i=W;exports.j=z;exports.k=_;

package/dist/chunk-FOVHQAY5.cjs

@@ -0,0 +1 @@
+'use strict';var chunkJS3UD7KS_cjs=require('./chunk-JS3UD7KS.cjs'),chunkAJ7JSWUT_cjs=require('./chunk-AJ7JSWUT.cjs'),chunkMAR6RBHF_cjs=require('./chunk-MAR6RBHF.cjs'),react=require('react'),core=require('@compa11y/core'),jsxRuntime=require('react/jsx-runtime');var Y=core.createComponentWarnings("Combobox"),$=react.createContext(null);function F(){let u=react.useContext($);if(!u)throw new Error("Combobox compound components must be used within a Combobox component");return u}function B({options:u,value:t,onValueChange:m,onInputChange:f,defaultInputValue:h="",disabled:d=false,filterFn:s,"aria-label":c,"aria-labelledby":x,children:C}){let[o,i]=react.useState(h),[a,n]=react.useState(t??null),[r,I]=react.useState(false),[l,p]=react.useState(-1),v=chunkMAR6RBHF_cjs.a("combobox-input"),b=chunkMAR6RBHF_cjs.a("combobox-listbox"),O=chunkMAR6RBHF_cjs.a("combobox-option");react.useEffect(()=>{if(t!==void 0){n(t);let e=u.find(y=>y.value===t);e&&i(e.label);}},[t,u]);let L=react.useCallback(e=>{i(e),f?.(e);},[f]),H=react.useCallback(e=>{t===void 0&&n(e),m?.(e);},[t,m]),R=react.useMemo(()=>{if(!o)return u;let y=s??((A,q)=>A.label.toLowerCase().includes(q.toLowerCase()));return u.filter(A=>y(A,o))},[u,o,s]),S=react.useCallback(e=>`${O}-${e}`,[O]),V=react.useCallback(e=>{H(e.value),L(e.label),I(false),p(-1);},[H,L]);react.useEffect(()=>{!c&&!x&&Y.warning("Combobox has no accessible label.","Add aria-label or aria-labelledby prop.");},[c,x]);let w={inputValue:o,setInputValue:L,selectedValue:a,setSelectedValue:H,isOpen:r,setIsOpen:I,highlightedIndex:l,setHighlightedIndex:p,options:u,filteredOptions:R,inputId:v,listboxId:b,getOptionId:S,onSelect:V};return jsxRuntime.jsx($.Provider,{value:w,children:jsxRuntime.jsx("div",{"data-compa11y-combobox":true,"data-disabled":d,children:C})})}var j=react.forwardRef(function({clearable:t=false,onKeyDown:m,onFocus:f,onBlur:h,...d},s){let{inputValue:c,setInputValue:x,setSelectedValue:C,isOpen:o,setIsOpen:i,highlightedIndex:a,setHighlightedIndex:n,filteredOptions:r,inputId:I,listboxId:l,getOptionId:p,onSelect:v}=F(),{announce:b}=chunkJS3UD7KS_cjs.a(),O=chunkAJ7JSWUT_cjs.a({ArrowDown:()=>{if(!o)i(true),n(0);else {let e=(a+1)%r.length;n(e);}},ArrowUp:()=>{if(!o)i(true),n(r.length-1);else {let e=(a-1+r.length)%r.length;n(e);}},Enter:()=>{if(o&&a>=0){let e=r[a];e&&!e.disabled&&(v(e),b(`${e.label} selected`));}},Escape:()=>{o&&(i(false),n(-1));},Tab:()=>(o&&(i(false),n(-1)),false),Home:()=>{o&&n(0);},End:()=>{o&&n(r.length-1);}},{preventDefault:true,stopPropagation:false}),L=e=>{m?.(e),e.defaultPrevented||O.onKeyDown(e);},H=e=>{let y=e.target.value;x(y),i(true),n(0),y===""&&C(null);},R=e=>{f?.(e),i(true);},S=e=>{h?.(e),setTimeout(()=>{i(false);},150);},V=()=>{x(""),C(null),i(false);},w=o&&a>=0?p(a):void 0;return jsxRuntime.jsxs("div",{"data-compa11y-combobox-input-wrapper":true,children:[jsxRuntime.jsx("input",{ref:s,id:I,type:"text",role:"combobox",value:c,onChange:H,onKeyDown:L,onFocus:R,onBlur:S,"aria-expanded":o,"aria-controls":l,"aria-activedescendant":w,"aria-autocomplete":"list","aria-haspopup":"listbox",autoComplete:"off","data-compa11y-combobox-input":true,...d}),t&&c&&jsxRuntime.jsx("button",{type:"button",onClick:V,"aria-label":"Clear selection",tabIndex:-1,"data-compa11y-combobox-clear":true,children:"\xD7"})]})}),W=react.forwardRef(function({emptyMessage:t="No results found",children:m,style:f,...h},d){let{isOpen:s,filteredOptions:c,listboxId:x,inputId:C}=F(),{announce:o}=chunkJS3UD7KS_cjs.a(),i=react.useRef(null),[a,n]=react.useState("bottom");react.useEffect(()=>{if(s){let l=c.length;o(l===0?"No results":`${l} result${l===1?"":"s"} available`);}},[s,c.length,o]),react.useLayoutEffect(()=>{if(s&&i.current){let p=i.current.getBoundingClientRect(),b=window.innerHeight-p.top,O=p.top,L=Math.min(p.height,200);b<L+50&&O>b?n("top"):n("bottom");}},[s]);let r=react.useCallback(l=>{i.current=l,typeof d=="function"?d(l):d&&(d.current=l);},[d]);return s?jsxRuntime.jsx("ul",{ref:r,id:x,role:"listbox","aria-labelledby":C,style:{...f,...a==="top"?{bottom:"100%",top:"auto",marginBottom:"4px",marginTop:0}:{}},"data-compa11y-combobox-listbox":true,"data-position":a,...h,children:c.length===0?jsxRuntime.jsx("li",{role:"presentation","data-compa11y-combobox-empty":true,children:t}):m??c.map((l,p)=>jsxRuntime.jsx(U,{option:l,index:p},l.value))}):null}),U=react.forwardRef(function({option:t,index:m,onClick:f,onMouseEnter:h,...d},s){let{selectedValue:c,highlightedIndex:x,setHighlightedIndex:C,getOptionId:o,onSelect:i}=F(),a=react.useRef(null),n=c===t.value,r=x===m,I=o(m);react.useEffect(()=>{r&&a.current&&a.current.scrollIntoView({block:"nearest",behavior:"smooth"});},[r]);let l=b=>{f?.(b),!b.defaultPrevented&&!t.disabled&&i(t);},p=b=>{h?.(b),t.disabled||C(m);},v=react.useCallback(b=>{a.current=b,typeof s=="function"?s(b):s&&(s.current=b);},[s]);return jsxRuntime.jsx("li",{ref:v,id:I,role:"option","aria-selected":n,"aria-disabled":t.disabled,"data-highlighted":r,"data-selected":n,"data-disabled":t.disabled,onClick:l,onMouseEnter:p,"data-compa11y-combobox-option":true,...d,children:t.label})}),Z=Object.assign(B,{Input:j,Listbox:W,Option:U});exports.a=B;exports.b=j;exports.c=W;exports.d=U;exports.e=Z;

package/dist/chunk-GITBIGD4.js

@@ -0,0 +1 @@
+import {a}from'./chunk-VMM4K2K4.js';import {a as a$1}from'./chunk-IZ7LLPPV.js';import {createContext,forwardRef,useRef,useEffect,useContext,useState,useCallback}from'react';import {jsx}from'react/jsx-runtime';var V=createContext(null);function S(){let M=useContext(V);if(!M)throw new Error("ActionMenu compound components must be used within an ActionMenu component");return M}var D=V.Provider;function O({defaultOpen:M=false,open:u,onOpenChange:e,children:f,unstyled:h=false}){let[d,i]=useState(M),c=u??d,[x,a]=useState(-1),r=useRef([]),p=useRef(null),m=a$1("action-menu"),y=a$1("action-menu-trigger"),n=useCallback(o=>{u===void 0&&i(o),e?.(o),o||a(-1);},[u,e]),l=useCallback(()=>n(true),[n]),g=useCallback(()=>n(false),[n]),s=useCallback(()=>n(!c),[n,c]),E=useCallback(o=>{let v=r.current.length;return r.current.push(o),v},[]),R=useCallback(o=>{let v=r.current.indexOf(o);v>-1&&r.current.splice(v,1);},[]),P=useCallback(()=>r.current.length,[]),t=useCallback(o=>{p.current?.(o),g();},[g]);return jsx(D,{value:{isOpen:c,open:l,close:g,toggle:s,highlightedIndex:x,setHighlightedIndex:a,menuId:m,triggerId:y,registerItem:E,unregisterItem:R,getItemCount:P,selectItem:t,unstyled:h},children:jsx("div",{style:{position:"relative",display:"inline-block"},"data-compa11y-action-menu":true,children:f})})}var B=forwardRef(function({children:u,onClick:e,onKeyDown:f,...h},d){let{isOpen:i,toggle:c,open:x,close:a$1,triggerId:r,menuId:p,setHighlightedIndex:m,getItemCount:y}=S(),n=s=>{e?.(s),s.defaultPrevented||c();},l=a({ArrowDown:()=>{i||x(),m(0);},ArrowUp:()=>{i||x(),m(y()-1);},Enter:()=>c(),Space:()=>c(),Escape:()=>a$1()},{preventDefault:true});return jsx("button",{ref:d,id:r,type:"button",tabIndex:0,"aria-haspopup":"menu","aria-expanded":i,"aria-controls":i?p:void 0,onClick:n,onKeyDown:s=>{f?.(s),s.defaultPrevented||l.onKeyDown(s);},"data-compa11y-action-menu-trigger":true,...h,children:u})}),N=forwardRef(function({children:u,onKeyDown:e,style:f,...h},d){let{isOpen:i,close:c,menuId:x,triggerId:a$1,highlightedIndex:r,setHighlightedIndex:p,getItemCount:m,unstyled:y}=S(),n=useRef(null),l=()=>{if(r>=0&&n.current){let A=n.current.querySelectorAll('[role="menuitem"]')[r];A&&A.getAttribute("aria-disabled")!=="true"&&A.click();}},g=a({ArrowDown:()=>{let t=m();p((r+1)%t);},ArrowUp:()=>{let t=m();p((r-1+t)%t);},Home:()=>p(0),End:()=>p(m()-1),Enter:()=>l(),Space:()=>l(),Escape:()=>c(),Tab:()=>(c(),false)},{preventDefault:true}),s=t=>{e?.(t),t.defaultPrevented||g.onKeyDown(t);};if(useEffect(()=>{i&&n.current&&n.current.focus();},[i]),useEffect(()=>{if(!i)return;let t=A=>{let o=A.target,v=n.current,k=document.getElementById(a$1);v&&!v.contains(o)&&k&&!k.contains(o)&&c();};return document.addEventListener("mousedown",t),()=>document.removeEventListener("mousedown",t)},[i,c,a$1]),!i)return null;let P={...{position:"absolute",top:"100%",left:0,marginTop:"4px",zIndex:1e3},...y?{}:{minWidth:"160px",backgroundColor:"white",border:"1px solid #e0e0e0",borderRadius:"4px",boxShadow:"0 4px 6px rgba(0, 0, 0, 0.1)",padding:"4px 0"}};return jsx("div",{ref:t=>{n.current=t,typeof d=="function"?d(t):d&&(d.current=t);},id:x,role:"menu","aria-labelledby":a$1,tabIndex:-1,onKeyDown:s,style:{...P,...f},"data-compa11y-action-menu-content":true,...h,children:u})}),U=forwardRef(function({children:u,disabled:e=false,onSelect:f,onClick:h,onMouseEnter:d,style:i,...c},x){let{registerItem:a,unregisterItem:r,highlightedIndex:p,setHighlightedIndex:m,close:y,unstyled:n}=S(),l=a$1("action-menu-item"),g=useRef(-1);useEffect(()=>(e||(g.current=a(l)),()=>{e||r(l);}),[l,e,a,r]);let s=g.current===p,E=o=>{h?.(o),!o.defaultPrevented&&!e&&(f?.(),y());},R=o=>{d?.(o),e||m(g.current);},A={...{cursor:e?"not-allowed":"pointer",opacity:e?.5:1},...n?{}:{padding:"8px 16px",backgroundColor:s?"#f0f0f0":"transparent"}};return jsx("div",{ref:x,id:l,role:"menuitem",tabIndex:-1,"aria-disabled":e,"data-highlighted":s,"data-disabled":e,onClick:E,onMouseEnter:R,style:{...A,...i},"data-compa11y-action-menu-item":true,...c,children:u})}),j=forwardRef(function(u,e){return jsx("div",{ref:e,role:"separator","data-compa11y-action-menu-separator":true,...u})}),q=forwardRef(function({children:u,...e},f){return jsx("div",{ref:f,role:"presentation","data-compa11y-action-menu-label":true,...e,children:u})}),F=Object.assign(O,{Trigger:B,Content:N,Item:U,Separator:j,Label:q});export{S as a,D as b,O as c,B as d,N as e,U as f,j as g,q as h,F as i};

package/dist/chunk-HEA4NAOM.js

@@ -0,0 +1 @@
+import {a}from'./chunk-MD4AVTLT.js';import {a as a$1}from'./chunk-VMM4K2K4.js';import {a as a$2}from'./chunk-IZ7LLPPV.js';import {createContext,forwardRef,useRef,useState,useEffect,useLayoutEffect,useCallback,useContext,useMemo}from'react';import {createComponentWarnings}from'@compa11y/core';import {jsxs,jsx}from'react/jsx-runtime';var Y=createComponentWarnings("Combobox"),$=createContext(null);function F(){let u=useContext($);if(!u)throw new Error("Combobox compound components must be used within a Combobox component");return u}function B({options:u,value:t,onValueChange:m,onInputChange:f,defaultInputValue:h="",disabled:d=false,filterFn:s,"aria-label":c,"aria-labelledby":x,children:C}){let[o,i]=useState(h),[a,n]=useState(t??null),[r,I]=useState(false),[l,p]=useState(-1),v=a$2("combobox-input"),b=a$2("combobox-listbox"),O=a$2("combobox-option");useEffect(()=>{if(t!==void 0){n(t);let e=u.find(y=>y.value===t);e&&i(e.label);}},[t,u]);let L=useCallback(e=>{i(e),f?.(e);},[f]),H=useCallback(e=>{t===void 0&&n(e),m?.(e);},[t,m]),R=useMemo(()=>{if(!o)return u;let y=s??((A,q)=>A.label.toLowerCase().includes(q.toLowerCase()));return u.filter(A=>y(A,o))},[u,o,s]),S=useCallback(e=>`${O}-${e}`,[O]),V=useCallback(e=>{H(e.value),L(e.label),I(false),p(-1);},[H,L]);useEffect(()=>{!c&&!x&&Y.warning("Combobox has no accessible label.","Add aria-label or aria-labelledby prop.");},[c,x]);let w={inputValue:o,setInputValue:L,selectedValue:a,setSelectedValue:H,isOpen:r,setIsOpen:I,highlightedIndex:l,setHighlightedIndex:p,options:u,filteredOptions:R,inputId:v,listboxId:b,getOptionId:S,onSelect:V};return jsx($.Provider,{value:w,children:jsx("div",{"data-compa11y-combobox":true,"data-disabled":d,children:C})})}var j=forwardRef(function({clearable:t=false,onKeyDown:m,onFocus:f,onBlur:h,...d},s){let{inputValue:c,setInputValue:x,setSelectedValue:C,isOpen:o,setIsOpen:i,highlightedIndex:a$2,setHighlightedIndex:n,filteredOptions:r,inputId:I,listboxId:l,getOptionId:p,onSelect:v}=F(),{announce:b}=a(),O=a$1({ArrowDown:()=>{if(!o)i(true),n(0);else {let e=(a$2+1)%r.length;n(e);}},ArrowUp:()=>{if(!o)i(true),n(r.length-1);else {let e=(a$2-1+r.length)%r.length;n(e);}},Enter:()=>{if(o&&a$2>=0){let e=r[a$2];e&&!e.disabled&&(v(e),b(`${e.label} selected`));}},Escape:()=>{o&&(i(false),n(-1));},Tab:()=>(o&&(i(false),n(-1)),false),Home:()=>{o&&n(0);},End:()=>{o&&n(r.length-1);}},{preventDefault:true,stopPropagation:false}),L=e=>{m?.(e),e.defaultPrevented||O.onKeyDown(e);},H=e=>{let y=e.target.value;x(y),i(true),n(0),y===""&&C(null);},R=e=>{f?.(e),i(true);},S=e=>{h?.(e),setTimeout(()=>{i(false);},150);},V=()=>{x(""),C(null),i(false);},w=o&&a$2>=0?p(a$2):void 0;return jsxs("div",{"data-compa11y-combobox-input-wrapper":true,children:[jsx("input",{ref:s,id:I,type:"text",role:"combobox",value:c,onChange:H,onKeyDown:L,onFocus:R,onBlur:S,"aria-expanded":o,"aria-controls":l,"aria-activedescendant":w,"aria-autocomplete":"list","aria-haspopup":"listbox",autoComplete:"off","data-compa11y-combobox-input":true,...d}),t&&c&&jsx("button",{type:"button",onClick:V,"aria-label":"Clear selection",tabIndex:-1,"data-compa11y-combobox-clear":true,children:"\xD7"})]})}),W=forwardRef(function({emptyMessage:t="No results found",children:m,style:f,...h},d){let{isOpen:s,filteredOptions:c,listboxId:x,inputId:C}=F(),{announce:o}=a(),i=useRef(null),[a$1,n]=useState("bottom");useEffect(()=>{if(s){let l=c.length;o(l===0?"No results":`${l} result${l===1?"":"s"} available`);}},[s,c.length,o]),useLayoutEffect(()=>{if(s&&i.current){let p=i.current.getBoundingClientRect(),b=window.innerHeight-p.top,O=p.top,L=Math.min(p.height,200);b<L+50&&O>b?n("top"):n("bottom");}},[s]);let r=useCallback(l=>{i.current=l,typeof d=="function"?d(l):d&&(d.current=l);},[d]);return s?jsx("ul",{ref:r,id:x,role:"listbox","aria-labelledby":C,style:{...f,...a$1==="top"?{bottom:"100%",top:"auto",marginBottom:"4px",marginTop:0}:{}},"data-compa11y-combobox-listbox":true,"data-position":a$1,...h,children:c.length===0?jsx("li",{role:"presentation","data-compa11y-combobox-empty":true,children:t}):m??c.map((l,p)=>jsx(U,{option:l,index:p},l.value))}):null}),U=forwardRef(function({option:t,index:m,onClick:f,onMouseEnter:h,...d},s){let{selectedValue:c,highlightedIndex:x,setHighlightedIndex:C,getOptionId:o,onSelect:i}=F(),a=useRef(null),n=c===t.value,r=x===m,I=o(m);useEffect(()=>{r&&a.current&&a.current.scrollIntoView({block:"nearest",behavior:"smooth"});},[r]);let l=b=>{f?.(b),!b.defaultPrevented&&!t.disabled&&i(t);},p=b=>{h?.(b),t.disabled||C(m);},v=useCallback(b=>{a.current=b,typeof s=="function"?s(b):s&&(s.current=b);},[s]);return jsx("li",{ref:v,id:I,role:"option","aria-selected":n,"aria-disabled":t.disabled,"data-highlighted":r,"data-selected":n,"data-disabled":t.disabled,onClick:l,onMouseEnter:p,"data-compa11y-combobox-option":true,...d,children:t.label})}),Z=Object.assign(B,{Input:j,Listbox:W,Option:U});export{B as a,j as b,W as c,U as d,Z as e};

package/dist/chunk-IZ7LLPPV.js

@@ -0,0 +1 @@
+import {useId,useMemo}from'react';function c(e){let r=useId();return useMemo(()=>{let n=r.replace(/:/g,"");return e?`compa11y-${e}-${n}`:`compa11y-${n}`},[r,e])}function u(e,r){let n=c(r);return useMemo(()=>{let t={};for(let s of e)t[s]=`${n}-${s}`;return t},[n,e])}function a(e){let r=c(e);return useMemo(()=>({id:r,generate:n=>`${r}-${n}`,generateMultiple:n=>{let t={};for(let s of n)t[s]=`${r}-${s}`;return t}}),[r])}export{c as a,u as b,a as c};

package/dist/chunk-JS3UD7KS.cjs

@@ -0,0 +1 @@
+'use strict';var react=require('react'),core=require('@compa11y/core');function M(){react.useEffect(()=>core.initAnnouncer(),[]);let r=react.useCallback((e,n)=>{core.announce(e,n);},[]),t=react.useCallback((e,n)=>{core.announcePolite(e,n);},[]),s=react.useCallback((e,n)=>{core.announceAssertive(e,n);},[]),c=react.useCallback((e,n)=>{core.queueAnnouncement(e,n);},[]),o=react.useCallback(()=>{core.clearAnnouncements();},[]);return {announce:r,polite:t,assertive:s,queue:c,clear:o}}function b(r,t,s){let{skipInitial:c=true,...o}=s??{},e=react.useRef(true),n=react.useRef(r);react.useEffect(()=>{if(e.current&&c){e.current=false,n.current=r;return}n.current!==r&&(core.announce(t(r),o),n.current=r);},[r,t,o]);}function k(r,t={}){let{loadingMessage:s="Loading...",loadedMessage:c="Content loaded",errorMessage:o="An error occurred",error:e}=t,n=react.useRef(false);react.useEffect(()=>{r&&!n.current?core.announcePolite(s):!r&&n.current&&(e?core.announceAssertive(o):core.announcePolite(c)),n.current=r;},[r,e,s,c,o]);}exports.a=M;exports.b=b;exports.c=k;

package/dist/chunk-MAR6RBHF.cjs

@@ -0,0 +1 @@
+'use strict';var react=require('react');function c(e){let r=react.useId();return react.useMemo(()=>{let n=r.replace(/:/g,"");return e?`compa11y-${e}-${n}`:`compa11y-${n}`},[r,e])}function u(e,r){let n=c(r);return react.useMemo(()=>{let t={};for(let s of e)t[s]=`${n}-${s}`;return t},[n,e])}function a(e){let r=c(e);return react.useMemo(()=>({id:r,generate:n=>`${r}-${n}`,generateMultiple:n=>{let t={};for(let s of n)t[s]=`${r}-${s}`;return t}}),[r])}exports.a=c;exports.b=u;exports.c=a;

package/dist/chunk-MD4AVTLT.js

@@ -0,0 +1 @@
+import {useEffect,useCallback,useRef}from'react';import {initAnnouncer,announce,announcePolite,announceAssertive,queueAnnouncement,clearAnnouncements}from'@compa11y/core';function M(){useEffect(()=>initAnnouncer(),[]);let r=useCallback((e,n)=>{announce(e,n);},[]),t=useCallback((e,n)=>{announcePolite(e,n);},[]),s=useCallback((e,n)=>{announceAssertive(e,n);},[]),c=useCallback((e,n)=>{queueAnnouncement(e,n);},[]),o=useCallback(()=>{clearAnnouncements();},[]);return {announce:r,polite:t,assertive:s,queue:c,clear:o}}function b(r,t,s){let{skipInitial:c=true,...o}=s??{},e=useRef(true),n=useRef(r);useEffect(()=>{if(e.current&&c){e.current=false,n.current=r;return}n.current!==r&&(announce(t(r),o),n.current=r);},[r,t,o]);}function k(r,t={}){let{loadingMessage:s="Loading...",loadedMessage:c="Content loaded",errorMessage:o="An error occurred",error:e}=t,n=useRef(false);useEffect(()=>{r&&!n.current?announcePolite(s):!r&&n.current&&(e?announceAssertive(o):announcePolite(c)),n.current=r;},[r,e,s,c,o]);}export{M as a,b,k as c};

package/dist/chunk-SB6ASQ36.js

@@ -0,0 +1 @@
+import {a as a$2}from'./chunk-MD4AVTLT.js';import {a as a$1}from'./chunk-VMM4K2K4.js';import {a}from'./chunk-IZ7LLPPV.js';import S,{createContext,forwardRef,useState,useRef,useCallback,useContext}from'react';import {jsx}from'react/jsx-runtime';var E=createContext(null);function g(){let m=useContext(E);if(!m)throw new Error("Tabs compound components must be used within a Tabs component");return m}var w=E.Provider;var H=forwardRef(function({defaultValue:e="",value:t,onValueChange:d,orientation:T="horizontal",activationMode:f="automatic",children:a$1,...i},r){let[l,c]=useState(e),n=t??l,b=useRef([]),x=a("tabs"),u=useCallback(p=>{t===void 0&&c(p),d?.(p);},[t,d]),o=useCallback(p=>{b.current.includes(p)||b.current.push(p);},[]),v=useCallback(p=>{let y=b.current.indexOf(p);y>-1&&b.current.splice(y,1);},[]),s=useCallback(()=>[...b.current],[]);return jsx(w,{value:{selectedValue:n,setSelectedValue:u,baseId:x,orientation:T,activationMode:f,registerTab:o,unregisterTab:v,getTabValues:s},children:jsx("div",{ref:r,"data-orientation":T,"data-compa11y-tabs":true,...i,children:a$1})})}),D=forwardRef(function({children:e,"aria-label":t,onKeyDown:d,...T},f){let{orientation:a,selectedValue:i,setSelectedValue:r,getTabValues:l,activationMode:c}=g(),n=useCallback(u=>{let o=l();if(o.length===0)return;let v=o.indexOf(i),s;switch(u){case "next":s=(v+1)%o.length;break;case "previous":s=(v-1+o.length)%o.length;break;case "first":s=0;break;case "last":s=o.length-1;break}let L=o[s];L&&(document.querySelector(`[data-compa11y-tab][data-value="${L}"]`)?.focus(),c==="automatic"&&r(L));},[l,i,r,c]),b=a$1({ArrowRight:()=>{a==="horizontal"&&n("next");},ArrowLeft:()=>{a==="horizontal"&&n("previous");},ArrowDown:()=>{a==="vertical"&&n("next");},ArrowUp:()=>{a==="vertical"&&n("previous");},Home:()=>n("first"),End:()=>n("last")},{preventDefault:true});return jsx("div",{ref:f,role:"tablist","aria-label":t,"aria-orientation":a,onKeyDown:u=>{d?.(u),u.defaultPrevented||b.onKeyDown(u);},"data-compa11y-tablist":true,...T,children:e})}),I=forwardRef(function({value:e,disabled:t=false,children:d,onClick:T,...f},a){let{selectedValue:i,setSelectedValue:r,baseId:l,registerTab:c,unregisterTab:n}=g(),{announce:b}=a$2();S.useEffect(()=>(c(e),()=>n(e)),[e,c,n]);let x=i===e,u=`${l}-tab-${e}`,o=`${l}-panel-${e}`;return jsx("button",{ref:a,type:"button",role:"tab",id:u,"aria-selected":x,"aria-controls":o,"aria-disabled":t,tabIndex:x?0:-1,onClick:s=>{T?.(s),!s.defaultPrevented&&!t&&(r(e),b(`${e} tab selected`));},disabled:t,"data-selected":x,"data-disabled":t,"data-value":e,"data-compa11y-tab":true,...f,children:d})}),$=forwardRef(function({value:e,forceMount:t=false,children:d,...T},f){let{selectedValue:a,baseId:i}=g(),r=a===e,l=`${i}-tab-${e}`,c=`${i}-panel-${e}`;return !r&&!t?null:jsx("div",{ref:f,role:"tabpanel",id:c,"aria-labelledby":l,tabIndex:0,hidden:!r,"data-selected":r,"data-compa11y-tabpanel":true,...T,children:d})}),B=Object.assign(H,{List:D,Tab:I,Panel:$});export{g as a,H as b,D as c,I as d,$ as e,B as f};

package/dist/chunk-VMM4K2K4.js

@@ -0,0 +1 @@
+import {useRef,useCallback,useMemo,useState,useEffect}from'react';import {getKeyCombo,normalizeKey,KeyboardPatterns,createTypeAhead}from'@compa11y/core';function f(e,n={}){let{preventDefault:o=true,stopPropagation:r=true,disabled:d=false}=n,t=useRef(e);return t.current=e,{onKeyDown:useCallback(i=>{if(d)return;let a=getKeyCombo(i.nativeEvent),s=t.current[a];if(!s){let b=normalizeKey(i.nativeEvent);s=t.current[b];}s&&s(i.nativeEvent)!==false&&(o&&i.preventDefault(),r&&i.stopPropagation());},[d,o,r])}}function w(e){let{disabled:n,...o}=e;return f(KeyboardPatterns.menu(o),{disabled:n})}function k(e){let{disabled:n,...o}=e;return f(KeyboardPatterns.tabs(o),{disabled:n})}function R(e){let{disabled:n,...o}=e;return f(KeyboardPatterns.grid(o),{disabled:n})}function x(e,n,o={}){let{timeout:r=500,disabled:d=false}=o,t=useMemo(()=>createTypeAhead(e,{timeout:r}),[e,r]),u=useRef(n);return u.current=n,{onKeyDown:useCallback(a=>{if(d||a.key.length!==1||a.ctrlKey||a.altKey||a.metaKey)return;let s=t.type(a.key);s&&u.current(s);},[d,t]),reset:t.reset,getSearch:t.getSearch}}function H(e){let[n,o]=useState(false);return useEffect(()=>{let r=t=>{normalizeKey(t)===e&&o(true);},d=t=>{normalizeKey(t)===e&&o(false);};return document.addEventListener("keydown",r),document.addEventListener("keyup",d),()=>{document.removeEventListener("keydown",r),document.removeEventListener("keyup",d);}},[e]),n}export{f as a,w as b,k as c,R as d,x as e,H as f};