@rfdtech/components 1.0.2 → 1.1.0

package/README.md

@@ -4,6 +4,10 @@ Shared React component library for Ghana School of Law (GSL) projects.
 
 Requires React 18+ and a bundler that processes CSS (Vite, Webpack, etc.).
 
+## Changelog
+
+See [CHANGELOG.md](./CHANGELOG.md) for release history.
+
 ## Styles
 
 Component styles load automatically when you import from `@rfdtech/components` (the JS bundle includes `import './index.css'`). For reliable styling in production, add this once in your app entry (`main.tsx` or `App.tsx`):
@@ -237,6 +241,276 @@ Override shared tokens on `.gsl-app-switcher` (see [Shared theming](#shared-them
 
 When fetching from a remote `baseUrl` in the browser, the API must allow the host application's origin. Configure CORS on your backend or proxy `/v1` through your dev server during local development.
 
+## Dropdown
+
+Single-value select with a combobox trigger and portaled listbox. Use for forms and filters where the user picks one option from a list.
+
+### Usage
+
+```tsx
+import { Dropdown } from "@rfdtech/components";
+
+function DepartmentFilter() {
+  const [department, setDepartment] = useState<string | null>(null);
+
+  return (
+    <Dropdown
+      ariaLabel="Department"
+      value={department}
+      onChange={setDepartment}
+      placeholder="Choose department..."
+      clearable
+      options={[
+        { value: "finance", label: "Finance" },
+        { value: "hr", label: "Human Resources" },
+      ]}
+    />
+  );
+}
+```
+
+### Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `ariaLabel` | `string` | required | Accessible label for the combobox |
+| `value` | `string \| null` | required | Selected option value |
+| `onChange` | `(value: string \| null) => void` | required | Called when selection changes |
+| `options` | `DropdownOption[]` | required | `{ value, label, disabled? }` items |
+| `placeholder` | `string` | `"Select..."` | Text shown when no value is selected |
+| `clearable` | `boolean` | `false` | Show placeholder as a clear option |
+| `disabled` | `boolean` | `false` | Disable the trigger |
+| `open` | `boolean` | — | Controlled open state |
+| `onOpenChange` | `(open: boolean) => void` | — | Open state callback |
+| `className` | `string` | — | Root CSS class |
+| `style` | `CSSProperties` | — | Root inline styles |
+
+## Combobox
+
+Text-input combobox with debounced async search. Use when options are loaded from an API based on what the user types.
+
+### Usage
+
+```tsx
+import { Combobox } from "@rfdtech/components";
+import type { DropdownOption } from "@rfdtech/components";
+
+const loadUsers = (query: string): Promise<DropdownOption[]> =>
+  fetch(`/api/users?q=${encodeURIComponent(query)}`).then((r) => r.json());
+
+function UserPicker() {
+  const [userId, setUserId] = useState<string | null>(null);
+
+  return (
+    <Combobox
+      ariaLabel="User"
+      value={userId}
+      onChange={setUserId}
+      loadOptions={loadUsers}
+      placeholder="Search users..."
+      clearable
+      getOptionLabel={(id) => cachedUsers.get(id)}
+    />
+  );
+}
+```
+
+The component caches the selected option label internally. Pass `getOptionLabel` when the value may be set before options are loaded (e.g. editing an existing record).
+
+### Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `ariaLabel` | `string` | required | Accessible label for the combobox input |
+| `value` | `string \| null` | required | Selected option value |
+| `onChange` | `(value: string \| null) => void` | required | Called when selection changes |
+| `loadOptions` | `(query: string) => Promise<DropdownOption[]>` | required | Async search function |
+| `placeholder` | `string` | `"Search..."` | Input placeholder |
+| `debounceMs` | `number` | `300` | Debounce delay before calling `loadOptions` |
+| `minSearchLength` | `number` | `0` | Minimum query length before searching |
+| `getOptionLabel` | `(value: string) => string \| undefined` | — | Resolve label for a value not in current results |
+| `noResultsText` | `string` | `"No results"` | Text when search returns no options |
+| `loadingText` | `string` | `"Loading..."` | Accessible label for the loading spinner |
+| `clearable` | `boolean` | `false` | Show a clear button when a value is selected |
+| `disabled` | `boolean` | `false` | Disable the input |
+| `open` | `boolean` | — | Controlled open state |
+| `onOpenChange` | `(open: boolean) => void` | — | Open state callback |
+| `className` | `string` | — | Root CSS class |
+| `style` | `CSSProperties` | — | Root inline styles |
+
+## InputMask
+
+Pattern-based masked text input for phone numbers, dates, and other formatted fields.
+
+### Mask syntax
+
+| Token | Accepts |
+|-------|---------|
+| `#` | Digit (`0-9`) |
+| `A` | Letter (`a-z`, `A-Z`) |
+| `*` | Alphanumeric |
+| Other characters | Literals inserted automatically |
+
+### Usage
+
+```tsx
+import { INPUT_MASK_PRESETS, InputMask } from "@rfdtech/components";
+
+function ContactForm() {
+  const [phone, setPhone] = useState("");
+  const [rawPhone, setRawPhone] = useState("");
+
+  return (
+    <InputMask
+      ariaLabel="Phone number"
+      mask={INPUT_MASK_PRESETS.phoneGh}
+      value={phone}
+      onChange={setPhone}
+      onValueChange={setRawPhone}
+      placeholder="0XX XXX XXXX"
+      inputMode="tel"
+    />
+  );
+}
+```
+
+`onChange` receives the masked display value (e.g. `024 123 4567`). `onValueChange` receives only the slot characters (e.g. `0241234567`).
+
+### Presets
+
+`INPUT_MASK_PRESETS` includes `phoneGh`, `phoneIntlGh`, `date`, and `time`. Pass any custom pattern string to `mask`.
+
+### Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `mask` | `string` | required | Pattern string (`#`, `A`, `*`, literals) |
+| `ariaLabel` | `string` | required | Accessible label for the input |
+| `value` | `string` | — | Masked display value (controlled) |
+| `defaultValue` | `string` | `""` | Initial value (uncontrolled) |
+| `onChange` | `(masked: string) => void` | — | Called with masked display value |
+| `onValueChange` | `(unmasked: string) => void` | — | Called with raw slot characters |
+| `placeholder` | `string` | — | Placeholder text |
+| `disabled` | `boolean` | `false` | Disable the input |
+| `id` | `string` | — | Input `id` attribute |
+| `name` | `string` | — | Input `name` attribute |
+| `inputMode` | `string` | `"text"` | Mobile keyboard hint |
+| `className` | `string` | — | Root CSS class |
+| `style` | `CSSProperties` | — | Root inline styles |
+
+## DataTable
+
+Read-focused data table with column sorting and pagination. Pass `data` for client-side sorting and pagination; use `loading` when data is fetched by the parent.
+
+`DataTable` composes the standalone [`Pagination`](#pagination) component for its footer.
+
+### Usage
+
+```tsx
+import { DataTable } from "@rfdtech/components";
+
+const columns = [
+  { key: "name", label: "Name", sortable: true },
+  { key: "department", label: "Department", sortable: true },
+];
+
+const { data, loading } = useStaff();
+
+<DataTable
+  columns={columns}
+  data={data}
+  loading={loading}
+  emptyText="No staff found."
+  pageSize={10}
+  onRowClick={(row) => console.log(row.name)}
+/>
+```
+
+Sorting and pagination run in the browser against the `data` array you provide.
+
+### Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `columns` | `DataTableColumn[]` | required | Column definitions |
+| `data` | `T[]` | required | Rows to display |
+| `loading` | `boolean` | `false` | Show loading spinner and disable controls |
+| `getRowId` | `(row, index) => string \| number` | index | Stable row key |
+| `pageSize` | `number` | `10` | Initial rows per page |
+| `pageSizeOptions` | `number[]` | `[10, 25, 50]` | Page size choices |
+| `emptyText` | `string` | `"No results found."` | Empty state message |
+| `loadingLabel` | `string` | `"Loading data"` | Accessible label for loading spinner |
+| `onRowClick` | `(row: T) => void` | — | Row click handler |
+| `className` | `string` | — | Root CSS class |
+| `style` | `CSSProperties` | — | Root inline styles |
+
+## Pagination
+
+Standalone pagination footer with result summary, rows-per-page dropdown, and previous/next controls. Used by `DataTable` but can be composed independently.
+
+### Usage
+
+```tsx
+import { Pagination } from "@rfdtech/components";
+
+<Pagination
+  page={page}
+  pageSize={pageSize}
+  total={total}
+  onPageChange={setPage}
+  onPageSizeChange={setPageSize}
+/>
+```
+
+### Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `page` | `number` | required | Current page (1-based) |
+| `pageSize` | `number` | required | Rows per page |
+| `total` | `number` | required | Total row count |
+| `pageSizeOptions` | `number[]` | `[10, 25, 50]` | Page size choices |
+| `loading` | `boolean` | `false` | Disable controls while loading |
+| `emptySummaryText` | `string` | `"Showing 0 results"` | Summary when `total` is 0 |
+| `onPageChange` | `(page: number) => void` | required | Page change callback |
+| `onPageSizeChange` | `(pageSize: number) => void` | required | Page size change callback |
+| `className` | `string` | — | Root CSS class |
+| `style` | `CSSProperties` | — | Root inline styles |
+
+## DropdownMenu
+
+Action menu triggered by a custom button. Use for row actions, overflow menus, and navigation shortcuts.
+
+### Usage
+
+```tsx
+import { DropdownMenu } from "@rfdtech/components";
+
+<DropdownMenu
+  ariaLabel="Row actions"
+  trigger={<span>⋮</span>}
+  items={[
+    { id: "edit", label: "Edit", onSelect: () => console.log("edit") },
+    { id: "docs", label: "Docs", href: "https://example.com/docs" },
+    { id: "delete", label: "Delete", onSelect: () => {}, destructive: true },
+  ]}
+/>
+```
+
+### Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `trigger` | `ReactNode \| (state) => ReactNode` | required | Button content or render prop |
+| `items` | `DropdownMenuItem[]` | required | Menu entries |
+| `ariaLabel` | `string` | required | Accessible label for trigger and menu |
+| `placement` | `"bottom-start" \| "bottom-end" \| "bottom"` | `"bottom-end"` | Panel position |
+| `closeOnSelect` | `boolean` | `true` | Close after an item is chosen |
+| `open` | `boolean` | — | Controlled open state |
+| `onOpenChange` | `(open: boolean) => void` | — | Open state callback |
+| `className` | `string` | — | Root CSS class |
+| `style` | `CSSProperties` | — | Root inline styles |
+
 ## BulkImportModal
 
 Four-step modal wizard for importing spreadsheet data (.xlsx, .xls, .csv). Parsing and validation run entirely in the browser.
@@ -389,7 +663,7 @@ To change the gutter size, override `--gsl-bulk-import-gutter` on `.gsl-bulk-imp
 
 ```bash
 npm install
-npm run demo        # Start demo at http://localhost:5173
+npm run demo        # Start demo at http://localhost:5173 — interactive examples at / and MDX docs at /docs
 npm run test        # Run unit and component tests
 npm run test:watch  # Run tests in watch mode
 npm run build       # Build library to dist/

package/dist/components/bulk-import-modal/steps/MatchColumnsStep.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MatchColumnsStep.d.ts","sourceRoot":"","sources":["../../../../src/components/bulk-import-modal/steps/MatchColumnsStep.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,eAAe,EACf,YAAY,EACZ,mBAAmB,EACpB,MAAM,kCAAkC,CAAC;AAG1C,UAAU,qBAAqB;IAC7B,MAAM,EAAE,eAAe,EAAE,CAAC;IAC1B,gBAAgB,EAAE,YAAY,EAAE,CAAC;IACjC,WAAW,EAAE,MAAM,EAAE,EAAE,CAAC;IACxB,mBAAmB,EAAE,mBAAmB,CAAC;IACzC,eAAe,EAAE,MAAM,EAAE,CAAC;IAC1B,qBAAqB,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9E,sBAAsB,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CACvD;AAwCD,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,gBAAgB,EAChB,WAAW,EACX,mBAAmB,EACnB,eAAe,EACf,qBAAqB,EACrB,sBAAsB,GACvB,EAAE,qBAAqB,+BA4FvB"}
+{"version":3,"file":"MatchColumnsStep.d.ts","sourceRoot":"","sources":["../../../../src/components/bulk-import-modal/steps/MatchColumnsStep.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,eAAe,EACf,YAAY,EACZ,mBAAmB,EACpB,MAAM,kCAAkC,CAAC;AAG1C,UAAU,qBAAqB;IAC7B,MAAM,EAAE,eAAe,EAAE,CAAC;IAC1B,gBAAgB,EAAE,YAAY,EAAE,CAAC;IACjC,WAAW,EAAE,MAAM,EAAE,EAAE,CAAC;IACxB,mBAAmB,EAAE,mBAAmB,CAAC;IACzC,eAAe,EAAE,MAAM,EAAE,CAAC;IAC1B,qBAAqB,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9E,sBAAsB,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;CACvD;AAwCD,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,gBAAgB,EAChB,WAAW,EACX,mBAAmB,EACnB,eAAe,EACf,qBAAqB,EACrB,sBAAsB,GACvB,EAAE,qBAAqB,+BA8FvB"}

package/dist/components/data-table/DataTable.d.ts

@@ -0,0 +1,5 @@
+import type { DataTableProps } from "../../types/data-table";
+import "../../styles/theme.css";
+import "./styles/data-table.css";
+export declare function DataTable<T extends Record<string, unknown>>({ columns, data, loading, getRowId, pageSize: initialPageSize, pageSizeOptions, emptyText, loadingLabel, onRowClick, className, style, }: DataTableProps<T>): import("react").JSX.Element;
+//# sourceMappingURL=DataTable.d.ts.map

package/dist/components/data-table/DataTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../src/components/data-table/DataTable.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAG7D,OAAO,wBAAwB,CAAC;AAChC,OAAO,yBAAyB,CAAC;AAEjC,wBAAgB,SAAS,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,EAC3D,OAAO,EACP,IAAI,EACJ,OAAe,EACf,QAAQ,EACR,QAAQ,EAAE,eAAoB,EAC9B,eAAe,EACf,SAA+B,EAC/B,YAA6B,EAC7B,UAAU,EACV,SAAS,EACT,KAAK,GACN,EAAE,cAAc,CAAC,CAAC,CAAC,+BA8InB"}

package/dist/components/data-table/DataTable.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=DataTable.test.d.ts.map

package/dist/components/data-table/DataTable.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.test.d.ts","sourceRoot":"","sources":["../../../src/components/data-table/DataTable.test.tsx"],"names":[],"mappings":""}

package/dist/components/data-table/hooks/useDataTable.d.ts

@@ -0,0 +1,3 @@
+import type { UseDataTableOptions, UseDataTableReturn } from "../../../types/data-table";
+export declare function useDataTable<T extends Record<string, unknown>>({ columns, data, initialPageSize, }: UseDataTableOptions<T>): UseDataTableReturn<T>;
+//# sourceMappingURL=useDataTable.d.ts.map

package/dist/components/data-table/hooks/useDataTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDataTable.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/hooks/useDataTable.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,mBAAmB,EACnB,kBAAkB,EACnB,MAAM,2BAA2B,CAAC;AAInC,wBAAgB,YAAY,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,EAC9D,OAAO,EACP,IAAI,EACJ,eAAoB,GACrB,EAAE,mBAAmB,CAAC,CAAC,CAAC,GAAG,kBAAkB,CAAC,CAAC,CAAC,CAqDhD"}

package/dist/components/data-table/index.d.ts

@@ -0,0 +1,3 @@
+export { DataTable } from "./DataTable";
+export type { DataTableColumn, DataTableProps, DataTableSort, } from "../../types/data-table";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/data-table/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/data-table/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EACV,eAAe,EACf,cAAc,EACd,aAAa,GACd,MAAM,wBAAwB,CAAC"}

package/dist/components/data-table/utils/dataTableClient.d.ts

@@ -0,0 +1,4 @@
+import type { DataTableColumn, DataTableSort } from "../../../types/data-table";
+export declare function sortRows<T extends Record<string, unknown>>(rows: T[], sort: DataTableSort | null, columns: DataTableColumn<T>[]): T[];
+export declare function paginateRows<T>(rows: T[], page: number, pageSize: number): T[];
+//# sourceMappingURL=dataTableClient.d.ts.map

package/dist/components/data-table/utils/dataTableClient.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dataTableClient.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/utils/dataTableClient.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAchF,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACxD,IAAI,EAAE,CAAC,EAAE,EACT,IAAI,EAAE,aAAa,GAAG,IAAI,EAC1B,OAAO,EAAE,eAAe,CAAC,CAAC,CAAC,EAAE,GAC5B,CAAC,EAAE,CAoBL;AAED,wBAAgB,YAAY,CAAC,CAAC,EAC5B,IAAI,EAAE,CAAC,EAAE,EACT,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,MAAM,GACf,CAAC,EAAE,CAGL"}

package/dist/components/data-table/utils/dataTableClient.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=dataTableClient.test.d.ts.map

package/dist/components/data-table/utils/dataTableClient.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dataTableClient.test.d.ts","sourceRoot":"","sources":["../../../../src/components/data-table/utils/dataTableClient.test.ts"],"names":[],"mappings":""}

package/dist/components/dropdown/Combobox.d.ts

@@ -0,0 +1,5 @@
+import type { ComboboxProps } from "../../types/dropdown";
+import "../../styles/theme.css";
+import "./styles/dropdown.css";
+export declare function Combobox({ ariaLabel, placeholder, value, loadOptions, debounceMs, minSearchLength, getOptionLabel, noResultsText, loadingText, clearable, disabled, open: controlledOpen, onOpenChange, onChange, className, style, }: ComboboxProps): import("react").JSX.Element;
+//# sourceMappingURL=Combobox.d.ts.map

package/dist/components/dropdown/Combobox.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/Combobox.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,aAAa,EAAkB,MAAM,sBAAsB,CAAC;AAI1E,OAAO,wBAAwB,CAAC;AAChC,OAAO,uBAAuB,CAAC;AAK/B,wBAAgB,QAAQ,CAAC,EACvB,SAAS,EACT,WAAyB,EACzB,KAAK,EACL,WAAW,EACX,UAAgB,EAChB,eAAmB,EACnB,cAAc,EACd,aAA4B,EAC5B,WAA0B,EAC1B,SAAiB,EACjB,QAAgB,EAChB,IAAI,EAAE,cAAc,EACpB,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,KAAK,GACN,EAAE,aAAa,+BA4Nf"}

package/dist/components/dropdown/Combobox.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Combobox.test.d.ts.map

package/dist/components/dropdown/Combobox.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Combobox.test.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/Combobox.test.tsx"],"names":[],"mappings":""}

package/dist/components/dropdown/Dropdown.d.ts

@@ -0,0 +1,5 @@
+import type { DropdownProps } from "../../types/dropdown";
+import "../../styles/theme.css";
+import "./styles/dropdown.css";
+export declare function Dropdown({ ariaLabel, placeholder, value, options, clearable, disabled, open: controlledOpen, onOpenChange, onChange, className, style, }: DropdownProps): import("react").JSX.Element;
+//# sourceMappingURL=Dropdown.d.ts.map

package/dist/components/dropdown/Dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/Dropdown.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAG1D,OAAO,wBAAwB,CAAC;AAChC,OAAO,uBAAuB,CAAC;AAK/B,wBAAgB,QAAQ,CAAC,EACvB,SAAS,EACT,WAAyB,EACzB,KAAK,EACL,OAAO,EACP,SAAiB,EACjB,QAAgB,EAChB,IAAI,EAAE,cAAc,EACpB,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,KAAK,GACN,EAAE,aAAa,+BAoHf"}

package/dist/components/dropdown/Dropdown.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Dropdown.test.d.ts.map

package/dist/components/dropdown/Dropdown.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.test.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/Dropdown.test.tsx"],"names":[],"mappings":""}

package/dist/components/dropdown/DropdownMenu.d.ts

@@ -0,0 +1,5 @@
+import type { DropdownMenuProps } from "../../types/dropdown";
+import "../../styles/theme.css";
+import "./styles/dropdown.css";
+export declare function DropdownMenu({ trigger, items, ariaLabel, placement, closeOnSelect, open: controlledOpen, onOpenChange, className, style, }: DropdownMenuProps): import("react").JSX.Element;
+//# sourceMappingURL=DropdownMenu.d.ts.map

package/dist/components/dropdown/DropdownMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/DropdownMenu.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAE9D,OAAO,wBAAwB,CAAC;AAChC,OAAO,uBAAuB,CAAC;AAE/B,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,KAAK,EACL,SAAS,EACT,SAAwB,EACxB,aAAoB,EACpB,IAAI,EAAE,cAAc,EACpB,YAAY,EACZ,SAAS,EACT,KAAK,GACN,EAAE,iBAAiB,+BAgGnB"}

package/dist/components/dropdown/DropdownMenu.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=DropdownMenu.test.d.ts.map

package/dist/components/dropdown/DropdownMenu.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownMenu.test.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/DropdownMenu.test.tsx"],"names":[],"mappings":""}

package/dist/components/dropdown/hooks/useComboboxSearch.d.ts

@@ -0,0 +1,3 @@
+import type { UseComboboxSearchOptions, UseComboboxSearchReturn } from "../../../types/dropdown";
+export declare function useComboboxSearch({ loadOptions, debounceMs, minSearchLength, enabled, }: UseComboboxSearchOptions): UseComboboxSearchReturn;
+//# sourceMappingURL=useComboboxSearch.d.ts.map

package/dist/components/dropdown/hooks/useComboboxSearch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useComboboxSearch.d.ts","sourceRoot":"","sources":["../../../../src/components/dropdown/hooks/useComboboxSearch.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,wBAAwB,EACxB,uBAAuB,EACxB,MAAM,yBAAyB,CAAC;AAEjC,wBAAgB,iBAAiB,CAAC,EAChC,WAAW,EACX,UAAgB,EAChB,eAAmB,EACnB,OAAc,GACf,EAAE,wBAAwB,GAAG,uBAAuB,CAoEpD"}

package/dist/components/dropdown/hooks/useDropdown.d.ts

@@ -0,0 +1,4 @@
+import { type RefObject } from "react";
+import type { UseDropdownOptions, UseDropdownReturn } from "../../../types/dropdown";
+export declare function useDropdown<T extends HTMLElement = HTMLElement, U extends HTMLElement = HTMLElement>(options?: UseDropdownOptions, panelRefProp?: RefObject<T | null>, triggerRefProp?: RefObject<U | null>): UseDropdownReturn<T, U>;
+//# sourceMappingURL=useDropdown.d.ts.map

package/dist/components/dropdown/hooks/useDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/dropdown/hooks/useDropdown.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAErF,wBAAgB,WAAW,CACzB,CAAC,SAAS,WAAW,GAAG,WAAW,EACnC,CAAC,SAAS,WAAW,GAAG,WAAW,EAEnC,OAAO,GAAE,kBAAuB,EAChC,YAAY,CAAC,EAAE,SAAS,CAAC,CAAC,GAAG,IAAI,CAAC,EAClC,cAAc,CAAC,EAAE,SAAS,CAAC,CAAC,GAAG,IAAI,CAAC,GACnC,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,CAkEzB"}

package/dist/components/dropdown/hooks/useDropdownPosition.d.ts

@@ -0,0 +1,4 @@
+import { type RefObject } from "react";
+import type { DropdownPosition } from "../../../types/dropdown";
+export declare function useDropdownPosition(open: boolean, triggerRef: RefObject<HTMLElement | null>): DropdownPosition | null;
+//# sourceMappingURL=useDropdownPosition.d.ts.map

package/dist/components/dropdown/hooks/useDropdownPosition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDropdownPosition.d.ts","sourceRoot":"","sources":["../../../../src/components/dropdown/hooks/useDropdownPosition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAEhE,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,OAAO,EACb,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GACxC,gBAAgB,GAAG,IAAI,CAuCzB"}

package/dist/components/dropdown/index.d.ts

@@ -0,0 +1,5 @@
+export { Combobox } from "./Combobox";
+export { Dropdown } from "./Dropdown";
+export { DropdownMenu } from "./DropdownMenu";
+export type { ComboboxProps, DropdownOption, DropdownProps, DropdownMenuItem, DropdownMenuProps, DropdownMenuPlacement, } from "../../types/dropdown";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/dropdown/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EACV,aAAa,EACb,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,iBAAiB,EACjB,qBAAqB,GACtB,MAAM,sBAAsB,CAAC"}

package/dist/components/input-mask/InputMask.d.ts

@@ -0,0 +1,5 @@
+import type { InputMaskProps } from "../../types/input-mask";
+import "../../styles/theme.css";
+import "./styles/input-mask.css";
+export declare function InputMask({ mask, value, defaultValue, onChange, onValueChange, ariaLabel, placeholder, disabled, id, name, className, style, inputMode, }: InputMaskProps): import("react").JSX.Element;
+//# sourceMappingURL=InputMask.d.ts.map

package/dist/components/input-mask/InputMask.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputMask.d.ts","sourceRoot":"","sources":["../../../src/components/input-mask/InputMask.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAE7D,OAAO,wBAAwB,CAAC;AAChC,OAAO,yBAAyB,CAAC;AAEjC,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,KAAK,EACL,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,SAAS,EACT,WAAW,EACX,QAAgB,EAChB,EAAE,EACF,IAAI,EACJ,SAAS,EACT,KAAK,EACL,SAAkB,GACnB,EAAE,cAAc,+BAkChB"}

package/dist/components/input-mask/InputMask.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=InputMask.test.d.ts.map

package/dist/components/input-mask/InputMask.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputMask.test.d.ts","sourceRoot":"","sources":["../../../src/components/input-mask/InputMask.test.tsx"],"names":[],"mappings":""}

package/dist/components/input-mask/hooks/useInputMask.d.ts

@@ -0,0 +1,18 @@
+import { type ChangeEvent, type ClipboardEvent, type KeyboardEvent } from "react";
+interface UseInputMaskOptions {
+    mask: string;
+    value?: string;
+    defaultValue?: string;
+    onChange?: (masked: string) => void;
+    onValueChange?: (unmasked: string) => void;
+    disabled?: boolean;
+}
+export declare function useInputMask({ mask, value, defaultValue, onChange, onValueChange, disabled, }: UseInputMaskOptions): {
+    inputRef: import("react").RefObject<HTMLInputElement | null>;
+    maskedValue: string;
+    handleChange: (event: ChangeEvent<HTMLInputElement>) => void;
+    handleKeyDown: (event: KeyboardEvent<HTMLInputElement>) => void;
+    handlePaste: (event: ClipboardEvent<HTMLInputElement>) => void;
+};
+export {};
+//# sourceMappingURL=useInputMask.d.ts.map

package/dist/components/input-mask/hooks/useInputMask.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInputMask.d.ts","sourceRoot":"","sources":["../../../../src/components/input-mask/hooks/useInputMask.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,WAAW,EAChB,KAAK,cAAc,EACnB,KAAK,aAAa,EACnB,MAAM,OAAO,CAAC;AASf,UAAU,mBAAmB;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,KAAK,EACL,YAAiB,EACjB,QAAQ,EACR,aAAa,EACb,QAAgB,GACjB,EAAE,mBAAmB;;;0BA0CV,WAAW,CAAC,gBAAgB,CAAC;2BAwB7B,aAAa,CAAC,gBAAgB,CAAC;yBA+B/B,cAAc,CAAC,gBAAgB,CAAC;EA8B3C"}

package/dist/components/input-mask/index.d.ts

@@ -0,0 +1,5 @@
+export { InputMask } from "./InputMask";
+export { INPUT_MASK_PRESETS } from "./presets";
+export type { InputMaskPreset } from "./presets";
+export type { InputMaskProps } from "../../types/input-mask";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/input-mask/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/input-mask/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAC/C,YAAY,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AACjD,YAAY,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/components/input-mask/presets.d.ts

@@ -0,0 +1,8 @@
+export declare const INPUT_MASK_PRESETS: {
+    readonly phoneGh: "0## ### ####";
+    readonly phoneIntlGh: "+233 ## ### ####";
+    readonly date: "##/##/####";
+    readonly time: "##:##";
+};
+export type InputMaskPreset = (typeof INPUT_MASK_PRESETS)[keyof typeof INPUT_MASK_PRESETS];
+//# sourceMappingURL=presets.d.ts.map

package/dist/components/input-mask/presets.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"presets.d.ts","sourceRoot":"","sources":["../../../src/components/input-mask/presets.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,kBAAkB;;;;;CAKrB,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,OAAO,kBAAkB,CAAC,CAAC"}

package/dist/components/input-mask/utils/maskUtils.d.ts

@@ -0,0 +1,13 @@
+export type MaskSlotType = "digit" | "letter" | "alphanumeric" | "literal";
+export interface MaskSlot {
+    type: MaskSlotType;
+    char?: string;
+}
+export declare function parseMask(mask: string): MaskSlot[];
+export declare function applyMask(rawInput: string, mask: string): string;
+export declare function stripMask(masked: string, mask: string): string;
+export declare function maskedIndexForSlotCount(slotCount: number, mask: string): number;
+export declare function getCursorAfterEdit(prevMasked: string, nextMasked: string, prevCursor: number, mask: string): number;
+export declare function getCursorAfterBackspace(masked: string, cursor: number, mask: string): number;
+export declare function deleteAtCursor(masked: string, cursor: number, mask: string): string;
+//# sourceMappingURL=maskUtils.d.ts.map

package/dist/components/input-mask/utils/maskUtils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"maskUtils.d.ts","sourceRoot":"","sources":["../../../../src/components/input-mask/utils/maskUtils.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,QAAQ,GAAG,cAAc,GAAG,SAAS,CAAC;AAE3E,MAAM,WAAW,QAAQ;IACvB,IAAI,EAAE,YAAY,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAMD,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,GAAG,QAAQ,EAAE,CAgBlD;AA6DD,wBAAgB,SAAS,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAEhE;AAED,wBAAgB,SAAS,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAuB9D;AAMD,wBAAgB,uBAAuB,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAsB/E;AAED,wBAAgB,kBAAkB,CAChC,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,MAAM,EAClB,IAAI,EAAE,MAAM,GACX,MAAM,CAiBR;AAED,wBAAgB,uBAAuB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAG5F;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAenF"}

package/dist/components/pagination/Pagination.d.ts

@@ -0,0 +1,5 @@
+import type { PaginationProps } from "../../types/pagination";
+import "../../styles/theme.css";
+import "./styles/pagination.css";
+export declare function Pagination({ page, pageSize, total, pageSizeOptions, loading, emptySummaryText, onPageChange, onPageSizeChange, className, style, }: PaginationProps): import("react").JSX.Element;
+//# sourceMappingURL=Pagination.d.ts.map

package/dist/components/pagination/Pagination.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/pagination/Pagination.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAG9D,OAAO,wBAAwB,CAAC;AAChC,OAAO,yBAAyB,CAAC;AAIjC,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,eAA2C,EAC3C,OAAe,EACf,gBAAsC,EACtC,YAAY,EACZ,gBAAgB,EAChB,SAAS,EACT,KAAK,GACN,EAAE,eAAe,+BAkEjB"}

package/dist/components/pagination/Pagination.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Pagination.test.d.ts.map

package/dist/components/pagination/Pagination.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.test.d.ts","sourceRoot":"","sources":["../../../src/components/pagination/Pagination.test.tsx"],"names":[],"mappings":""}

package/dist/components/pagination/index.d.ts

@@ -0,0 +1,4 @@
+export { Pagination } from "./Pagination";
+export { getPageCount, getPageRange } from "./utils";
+export type { PaginationProps } from "../../types/pagination";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/pagination/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/pagination/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACrD,YAAY,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/components/pagination/utils.d.ts

@@ -0,0 +1,6 @@
+export declare function getPageCount(total: number, pageSize: number): number;
+export declare function getPageRange(page: number, pageSize: number, total: number): {
+    start: number;
+    end: number;
+};
+//# sourceMappingURL=utils.d.ts.map

package/dist/components/pagination/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/pagination/utils.ts"],"names":[],"mappings":"AAAA,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAMpE;AAED,wBAAgB,YAAY,CAC1B,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,MAAM,GACZ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAQhC"}

package/dist/components/pagination/utils.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=utils.test.d.ts.map

package/dist/components/pagination/utils.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.test.d.ts","sourceRoot":"","sources":["../../../src/components/pagination/utils.test.ts"],"names":[],"mappings":""}