@ankhorage/zora 2.4.5 → 2.4.6

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 2.4.6
+
+### Patch Changes
+
+- 884095d: Add DatePicker and TimePicker components backed by existing ZORA ActionSheet primitives.
+
 ## 2.4.5
 
 ### Patch Changes

package/README.md

@@ -301,6 +301,7 @@ Metadata model overview:
 - `CheckboxGroup`
 - `Chip`
 - `ChipGroup`
+- `DataTable`
 - `DropdownMenu`
 - `Drawer`
 - `Form`
@@ -1131,6 +1132,193 @@ No inherited props. `ChipGroupProps` is declared directly by ZORA.
 
 </details>
 
+### `DataTable`
+
+Typed, app-facing tabular data display for admin lists, dashboards, commerce
+orders, transactions, inventory, reports, moderation queues, bookings, and other
+structured app screens.
+
+`DataTable` is intentionally a ZORA component, not a Surface primitive. Surface
+provides the render foundation. ZORA owns the app-facing table behavior:
+columns, rows, sorting UI, row actions, loading/empty states, and responsive
+mobile fallback.
+
+```tsx
+type Order = {
+  id: string;
+  customer: string;
+  status: 'paid' | 'pending' | 'failed';
+  total: string;
+};
+
+const orders: Order[] = [
+  { id: 'ord-1001', customer: 'Nora Frei', status: 'paid', total: 'CHF 128' },
+  { id: 'ord-1002', customer: 'Mika Baumann', status: 'pending', total: 'CHF 64' },
+];
+
+<DataTable
+  columns={[
+    { id: 'customer', header: 'Customer', accessor: 'customer', sortable: true },
+    {
+      id: 'status',
+      header: 'Status',
+      renderCell: ({ row }) => (
+        <Badge color={row.status === 'paid' ? 'success' : 'warning'}>{row.status}</Badge>
+      ),
+    },
+    { id: 'total', header: 'Total', accessor: 'total', align: 'end' },
+  ]}
+  rows={orders}
+  rowId={(row) => row.id}
+/>;
+```
+
+Use `rowActions` to attach contextual actions. Row actions are rendered through
+ZORA `DropdownMenu`, so `DataTable` does not invent its own overflow behavior.
+
+```tsx
+<DataTable
+  columns={[
+    { id: 'customer', header: 'Customer', accessor: 'customer' },
+    { id: 'total', header: 'Total', accessor: 'total', align: 'end' },
+  ]}
+  rows={orders}
+  rowId={(row) => row.id}
+  rowActions={(row) => [
+    {
+      id: 'view',
+      title: 'View',
+      icon: { name: 'eye-outline' },
+      onPress: () => viewOrder(row),
+    },
+    {
+      id: 'refund',
+      title: 'Refund',
+      description: 'Start a refund workflow.',
+      icon: { name: 'return-down-back-outline' },
+      intent: 'danger',
+      onPress: () => refundOrder(row),
+    },
+  ]}
+/>
+```
+
+Use controlled sort state when a screen owns sorting:
+
+```tsx
+const [sort, setSort] = React.useState<DataTableSortState>({
+  columnId: 'customer',
+  direction: 'asc',
+});
+
+<DataTable
+  columns={[
+    { id: 'customer', header: 'Customer', accessor: 'customer', sortable: true },
+    { id: 'total', header: 'Total', accessor: 'total', align: 'end', sortable: true },
+  ]}
+  rows={orders}
+  rowId={(row) => row.id}
+  sort={sort}
+  onSortChange={setSort}
+/>;
+```
+
+`DataTable` renders a table-like layout on wider screens and a card/list fallback
+on narrow screens. It supports loading and empty states out of the box:
+
+```tsx
+<DataTable
+  columns={columns}
+  rows={orders}
+  rowId={(row) => row.id}
+  loading={isLoading}
+  loadingRows={6}
+  emptyTitle="No orders"
+  emptyDescription="Orders will appear here when customers check out."
+/>
+```
+
+V1 is intentionally not a spreadsheet or data grid. It does not include
+virtualization, column resizing, column pinning, inline editing, grouped rows,
+nested rows, server-side pagination controllers, or export features.
+
+<details>
+<summary>Props</summary>
+
+`DataTable` props:
+
+| Prop               | Type                                   | Default                           | Notes                                       |
+| ------------------ | -------------------------------------- | --------------------------------- | ------------------------------------------- |
+| `columns`          | `readonly DataTableColumn<TRow>[]`     | -                                 | Column definitions.                         |
+| `rows`             | `readonly TRow[]`                      | -                                 | Row data.                                   |
+| `rowId`            | `(row: TRow, index: number) => string` | -                                 | Stable row id resolver.                     |
+| `rowActions`       | `(row, index) => DataTableRowAction[]` | -                                 | Optional contextual row actions.            |
+| `sort`             | `DataTableSortState`                   | -                                 | Controlled sort state.                      |
+| `onSortChange`     | `(sort: DataTableSortState) => void`   | -                                 | Called when a sortable header is activated. |
+| `loading`          | `boolean`                              | `false`                           | Shows loading placeholders.                 |
+| `loadingRows`      | `number`                               | `5`                               | Placeholder row count while loading.        |
+| `emptyTitle`       | `React.ReactNode`                      | `'No data'`                       | Empty-state title.                          |
+| `emptyDescription` | `React.ReactNode`                      | `'There are no rows to display.'` | Empty-state description.                    |
+| `density`          | `DataTableDensity`                     | `'comfortable'`                   | Row density: `comfortable` or `compact`.    |
+| `testID`           | `string`                               | -                                 | Test id.                                    |
+| `mode`             | `ZoraThemeMode`                        | -                                 | Optional scoped theme mode override.        |
+| `themeId`          | `ZoraThemeId`                          | -                                 | Optional scoped theme id override.          |
+
+`DataTableColumn<TRow>` fields:
+
+| Field        | Type                                                       | Default | Notes                                      |
+| ------------ | ---------------------------------------------------------- | ------- | ------------------------------------------ |
+| `id`         | `string`                                                   | -       | Stable column id.                          |
+| `header`     | `React.ReactNode`                                          | -       | Header label.                              |
+| `accessor`   | `keyof TRow`                                               | -       | Reads a primitive/date value from the row. |
+| `align`      | `DataTableColumnAlign`                                     | `start` | Cell alignment.                            |
+| `width`      | `number`                                                   | -       | Fixed column width.                        |
+| `minWidth`   | `number`                                                   | `140`   | Minimum column width.                      |
+| `sortable`   | `boolean`                                                  | `false` | Enables sort header behavior.              |
+| `renderCell` | `(context: DataTableCellContext<TRow>) => React.ReactNode` | -       | Custom cell rendering.                     |
+
+`DataTableCellContext<TRow>` fields:
+
+| Field      | Type                    | Notes                         |
+| ---------- | ----------------------- | ----------------------------- |
+| `row`      | `TRow`                  | Current row.                  |
+| `rowIndex` | `number`                | Current row index.            |
+| `column`   | `DataTableColumn<TRow>` | Current column.               |
+| `value`    | `unknown`               | Accessor value, when present. |
+
+`DataTableRowAction<TRow>` fields:
+
+| Field         | Type                  | Default | Notes                                        |
+| ------------- | --------------------- | ------- | -------------------------------------------- |
+| `id`          | `string`              | -       | Stable action id.                            |
+| `title`       | `React.ReactNode`     | -       | Action label.                                |
+| `description` | `React.ReactNode`     | -       | Optional secondary text.                     |
+| `icon`        | `ButtonIconSpec`      | -       | Optional action icon.                        |
+| `intent`      | `MenuActionIntent`    | -       | Action intent, currently `default`/`danger`. |
+| `disabled`    | `boolean`             | `false` | Disables the action.                         |
+| `onPress`     | `(row: TRow) => void` | -       | Called with the row when selected.           |
+
+Type aliases:
+
+```ts
+type DataTableColumnAlign = 'start' | 'center' | 'end';
+type DataTableDensity = 'comfortable' | 'compact';
+type DataTableSortDirection = 'asc' | 'desc';
+
+interface DataTableSortState {
+  columnId: string;
+  direction: DataTableSortDirection;
+}
+```
+
+Default cell rendering:
+
+- `string`, `number`, `boolean`, `bigint`, and `Date` values render automatically.
+- `null` / `undefined` render as `—`.
+- Structured values render as `—` unless `renderCell` is provided.
+
+</details>
+
 ### `Textarea`
 
 Multiline text input wrapper with ZORA sizing and optional Surface icon specs.

package/dist/components/date-picker/DatePicker.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { DatePickerProps } from './types';
+export declare const DatePicker: (props: DatePickerProps) => React.ReactElement | null;
+//# sourceMappingURL=DatePicker.d.ts.map

package/dist/components/date-picker/DatePicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/DatePicker.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAyO/C,eAAO,MAAM,UAAU,uDAAsC,CAAC"}

package/dist/components/date-picker/DatePicker.js

@@ -0,0 +1,144 @@
+import { Field } from '@ankhorage/surface';
+import React from 'react';
+import { Box, Stack } from '../../foundation';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+import { ActionSheet } from '../action-sheet';
+import { Button } from '../button';
+import { Text } from '../text';
+const WEEKDAY_LABELS = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
+const DAY_CELL_WIDTH = 42;
+function renderLabel(label, description) {
+    return (<Stack gap="xs">
+      <Text variant="label" weight="semiBold">
+        {label}
+      </Text>
+      {description ? (<Text emphasis="muted" variant="bodySmall">
+          {description}
+        </Text>) : null}
+    </Stack>);
+}
+function startOfLocalDay(value) {
+    return new Date(value.getFullYear(), value.getMonth(), value.getDate());
+}
+function isSameLocalDay(left, right) {
+    if (!left) {
+        return false;
+    }
+    return startOfLocalDay(left).getTime() === startOfLocalDay(right).getTime();
+}
+function isBeforeLocalDay(left, right) {
+    return startOfLocalDay(left).getTime() < startOfLocalDay(right).getTime();
+}
+function isAfterLocalDay(left, right) {
+    return startOfLocalDay(left).getTime() > startOfLocalDay(right).getTime();
+}
+function isDateDisabled(value, minDate, maxDate) {
+    if (minDate && isBeforeLocalDay(value, minDate)) {
+        return true;
+    }
+    if (maxDate && isAfterLocalDay(value, maxDate)) {
+        return true;
+    }
+    return false;
+}
+function formatMonthLabel(value) {
+    return value.toLocaleDateString(undefined, { month: 'long', year: 'numeric' });
+}
+function formatDefaultDate(value) {
+    return value.toLocaleDateString();
+}
+function createMonthDays(month) {
+    const firstDay = new Date(month.getFullYear(), month.getMonth(), 1);
+    const dayCount = new Date(month.getFullYear(), month.getMonth() + 1, 0).getDate();
+    const days = [];
+    for (let offset = 0; offset < firstDay.getDay(); offset += 1) {
+        days.push(null);
+    }
+    for (let day = 1; day <= dayCount; day += 1) {
+        days.push(new Date(month.getFullYear(), month.getMonth(), day));
+    }
+    while (days.length % 7 !== 0) {
+        days.push(null);
+    }
+    return days;
+}
+function resolveInitialMonth(value, minDate) {
+    const base = value ?? minDate ?? new Date();
+    return new Date(base.getFullYear(), base.getMonth(), 1);
+}
+function canNavigateToMonth(month, minDate, maxDate) {
+    const firstDay = new Date(month.getFullYear(), month.getMonth(), 1);
+    const lastDay = new Date(month.getFullYear(), month.getMonth() + 1, 0);
+    if (maxDate && isAfterLocalDay(firstDay, maxDate)) {
+        return false;
+    }
+    if (minDate && isBeforeLocalDay(lastDay, minDate)) {
+        return false;
+    }
+    return true;
+}
+function DatePickerInner({ themeId: _themeId, mode: _mode, value, onValueChange, label, description, error, placeholder = 'Choose date', minDate, maxDate, disabled = false, required = false, formatDate, testID, }) {
+    const [visible, setVisible] = React.useState(false);
+    const [displayMonth, setDisplayMonth] = React.useState(() => resolveInitialMonth(value, minDate));
+    const monthDays = React.useMemo(() => createMonthDays(displayMonth), [displayMonth]);
+    const previousMonth = new Date(displayMonth.getFullYear(), displayMonth.getMonth() - 1, 1);
+    const nextMonth = new Date(displayMonth.getFullYear(), displayMonth.getMonth() + 1, 1);
+    const displayValue = value
+        ? formatDate
+            ? formatDate(value)
+            : formatDefaultDate(value)
+        : placeholder;
+    React.useEffect(() => {
+        if (visible) {
+            setDisplayMonth(resolveInitialMonth(value, minDate));
+        }
+    }, [minDate, value, visible]);
+    return (<Field disabled={disabled} errorText={error} invalid={Boolean(error)} label={label ? renderLabel(label, description) : undefined} required={required} testID={testID}>
+      <Button disabled={disabled} onPress={() => setVisible(true)} testID={testID ? `${testID}-trigger` : undefined} trailingIcon={{ name: 'calendar-outline' }} variant="outline">
+        {displayValue}
+      </Button>
+      <ActionSheet description={description} onDismiss={() => setVisible(false)} testID={testID ? `${testID}-sheet` : undefined} title={label ?? 'Choose date'} visible={visible}>
+        <Stack gap="m">
+          <Stack align="center" direction="row" justify="space-between">
+            <Button disabled={!canNavigateToMonth(previousMonth, minDate, maxDate)} onPress={() => setDisplayMonth(previousMonth)} size="s" variant="ghost">
+              Previous
+            </Button>
+            <Text align="center" variant="label" weight="semiBold">
+              {formatMonthLabel(displayMonth)}
+            </Text>
+            <Button disabled={!canNavigateToMonth(nextMonth, minDate, maxDate)} onPress={() => setDisplayMonth(nextMonth)} size="s" variant="ghost">
+              Next
+            </Button>
+          </Stack>
+
+          <Stack direction="row" justify="space-between">
+            {WEEKDAY_LABELS.map((weekday) => (<Box key={weekday} style={{ width: DAY_CELL_WIDTH }}>
+                <Text align="center" emphasis="muted" variant="caption" weight="semiBold">
+                  {weekday}
+                </Text>
+              </Box>))}
+          </Stack>
+
+          <Stack direction="row" gap="xs" style={{ flexWrap: 'wrap' }}>
+            {monthDays.map((day, index) => {
+            if (!day) {
+                return <Box key={`empty-${index}`} style={{ width: DAY_CELL_WIDTH }}/>;
+            }
+            const selected = isSameLocalDay(value, day);
+            const dayDisabled = isDateDisabled(day, minDate, maxDate);
+            return (<Box key={day.toISOString()} style={{ width: DAY_CELL_WIDTH }}>
+                  <Button color={selected ? 'primary' : 'neutral'} disabled={dayDisabled} onPress={() => {
+                    onValueChange?.(startOfLocalDay(day));
+                    setVisible(false);
+                }} size="s" testID={testID ? `${testID}-day-${day.getDate()}` : undefined} variant={selected ? 'solid' : 'ghost'}>
+                    {day.getDate()}
+                  </Button>
+                </Box>);
+        })}
+          </Stack>
+        </Stack>
+      </ActionSheet>
+    </Field>);
+}
+export const DatePicker = withZoraThemeScope(DatePickerInner);
+//# sourceMappingURL=DatePicker.js.map

package/dist/components/date-picker/DatePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.js","sourceRoot":"","sources":["../../../src/components/date-picker/DatePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Field } from '@ankhorage/surface';\nimport React from 'react';\n\nimport { Box, Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { ActionSheet } from '../action-sheet';\nimport { Button } from '../button';\nimport { Text } from '../text';\nimport type { DatePickerProps } from './types';\n\nconst WEEKDAY_LABELS = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'] as const;\nconst DAY_CELL_WIDTH = 42;\n\nfunction renderLabel(label: React.ReactNode, description: React.ReactNode | undefined) {\n  return (\n    <Stack gap=\"xs\">\n      <Text variant=\"label\" weight=\"semiBold\">\n        {label}\n      </Text>\n      {description ? (\n        <Text emphasis=\"muted\" variant=\"bodySmall\">\n          {description}\n        </Text>\n      ) : null}\n    </Stack>\n  );\n}\n\nfunction startOfLocalDay(value: Date): Date {\n  return new Date(value.getFullYear(), value.getMonth(), value.getDate());\n}\n\nfunction isSameLocalDay(left: Date | null, right: Date): boolean {\n  if (!left) {\n    return false;\n  }\n\n  return startOfLocalDay(left).getTime() === startOfLocalDay(right).getTime();\n}\n\nfunction isBeforeLocalDay(left: Date, right: Date): boolean {\n  return startOfLocalDay(left).getTime() < startOfLocalDay(right).getTime();\n}\n\nfunction isAfterLocalDay(left: Date, right: Date): boolean {\n  return startOfLocalDay(left).getTime() > startOfLocalDay(right).getTime();\n}\n\nfunction isDateDisabled(\n  value: Date,\n  minDate: Date | undefined,\n  maxDate: Date | undefined,\n): boolean {\n  if (minDate && isBeforeLocalDay(value, minDate)) {\n    return true;\n  }\n\n  if (maxDate && isAfterLocalDay(value, maxDate)) {\n    return true;\n  }\n\n  return false;\n}\n\nfunction formatMonthLabel(value: Date): string {\n  return value.toLocaleDateString(undefined, { month: 'long', year: 'numeric' });\n}\n\nfunction formatDefaultDate(value: Date): string {\n  return value.toLocaleDateString();\n}\n\nfunction createMonthDays(month: Date): (Date | null)[] {\n  const firstDay = new Date(month.getFullYear(), month.getMonth(), 1);\n  const dayCount = new Date(month.getFullYear(), month.getMonth() + 1, 0).getDate();\n  const days: (Date | null)[] = [];\n\n  for (let offset = 0; offset < firstDay.getDay(); offset += 1) {\n    days.push(null);\n  }\n\n  for (let day = 1; day <= dayCount; day += 1) {\n    days.push(new Date(month.getFullYear(), month.getMonth(), day));\n  }\n\n  while (days.length % 7 !== 0) {\n    days.push(null);\n  }\n\n  return days;\n}\n\nfunction resolveInitialMonth(value: Date | null, minDate: Date | undefined): Date {\n  const base = value ?? minDate ?? new Date();\n  return new Date(base.getFullYear(), base.getMonth(), 1);\n}\n\nfunction canNavigateToMonth(\n  month: Date,\n  minDate: Date | undefined,\n  maxDate: Date | undefined,\n): boolean {\n  const firstDay = new Date(month.getFullYear(), month.getMonth(), 1);\n  const lastDay = new Date(month.getFullYear(), month.getMonth() + 1, 0);\n\n  if (maxDate && isAfterLocalDay(firstDay, maxDate)) {\n    return false;\n  }\n\n  if (minDate && isBeforeLocalDay(lastDay, minDate)) {\n    return false;\n  }\n\n  return true;\n}\n\nfunction DatePickerInner({\n  themeId: _themeId,\n  mode: _mode,\n  value,\n  onValueChange,\n  label,\n  description,\n  error,\n  placeholder = 'Choose date',\n  minDate,\n  maxDate,\n  disabled = false,\n  required = false,\n  formatDate,\n  testID,\n}: DatePickerProps) {\n  const [visible, setVisible] = React.useState(false);\n  const [displayMonth, setDisplayMonth] = React.useState(() => resolveInitialMonth(value, minDate));\n  const monthDays = React.useMemo(() => createMonthDays(displayMonth), [displayMonth]);\n  const previousMonth = new Date(displayMonth.getFullYear(), displayMonth.getMonth() - 1, 1);\n  const nextMonth = new Date(displayMonth.getFullYear(), displayMonth.getMonth() + 1, 1);\n  const displayValue = value\n    ? formatDate\n      ? formatDate(value)\n      : formatDefaultDate(value)\n    : placeholder;\n\n  React.useEffect(() => {\n    if (visible) {\n      setDisplayMonth(resolveInitialMonth(value, minDate));\n    }\n  }, [minDate, value, visible]);\n\n  return (\n    <Field\n      disabled={disabled}\n      errorText={error}\n      invalid={Boolean(error)}\n      label={label ? renderLabel(label, description) : undefined}\n      required={required}\n      testID={testID}\n    >\n      <Button\n        disabled={disabled}\n        onPress={() => setVisible(true)}\n        testID={testID ? `${testID}-trigger` : undefined}\n        trailingIcon={{ name: 'calendar-outline' }}\n        variant=\"outline\"\n      >\n        {displayValue}\n      </Button>\n      <ActionSheet\n        description={description}\n        onDismiss={() => setVisible(false)}\n        testID={testID ? `${testID}-sheet` : undefined}\n        title={label ?? 'Choose date'}\n        visible={visible}\n      >\n        <Stack gap=\"m\">\n          <Stack align=\"center\" direction=\"row\" justify=\"space-between\">\n            <Button\n              disabled={!canNavigateToMonth(previousMonth, minDate, maxDate)}\n              onPress={() => setDisplayMonth(previousMonth)}\n              size=\"s\"\n              variant=\"ghost\"\n            >\n              Previous\n            </Button>\n            <Text align=\"center\" variant=\"label\" weight=\"semiBold\">\n              {formatMonthLabel(displayMonth)}\n            </Text>\n            <Button\n              disabled={!canNavigateToMonth(nextMonth, minDate, maxDate)}\n              onPress={() => setDisplayMonth(nextMonth)}\n              size=\"s\"\n              variant=\"ghost\"\n            >\n              Next\n            </Button>\n          </Stack>\n\n          <Stack direction=\"row\" justify=\"space-between\">\n            {WEEKDAY_LABELS.map((weekday) => (\n              <Box key={weekday} style={{ width: DAY_CELL_WIDTH }}>\n                <Text align=\"center\" emphasis=\"muted\" variant=\"caption\" weight=\"semiBold\">\n                  {weekday}\n                </Text>\n              </Box>\n            ))}\n          </Stack>\n\n          <Stack direction=\"row\" gap=\"xs\" style={{ flexWrap: 'wrap' }}>\n            {monthDays.map((day, index) => {\n              if (!day) {\n                return <Box key={`empty-${index}`} style={{ width: DAY_CELL_WIDTH }} />;\n              }\n\n              const selected = isSameLocalDay(value, day);\n              const dayDisabled = isDateDisabled(day, minDate, maxDate);\n\n              return (\n                <Box key={day.toISOString()} style={{ width: DAY_CELL_WIDTH }}>\n                  <Button\n                    color={selected ? 'primary' : 'neutral'}\n                    disabled={dayDisabled}\n                    onPress={() => {\n                      onValueChange?.(startOfLocalDay(day));\n                      setVisible(false);\n                    }}\n                    size=\"s\"\n                    testID={testID ? `${testID}-day-${day.getDate()}` : undefined}\n                    variant={selected ? 'solid' : 'ghost'}\n                  >\n                    {day.getDate()}\n                  </Button>\n                </Box>\n              );\n            })}\n          </Stack>\n        </Stack>\n      </ActionSheet>\n    </Field>\n  );\n}\n\nexport const DatePicker = withZoraThemeScope(DatePickerInner);\n"]}

package/dist/components/date-picker/index.d.ts

@@ -0,0 +1,3 @@
+export { DatePicker } from './DatePicker';
+export type { DatePickerProps, DatePickerValue } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/date-picker/index.d.ts.map

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

package/dist/components/date-picker/index.js

@@ -0,0 +1,2 @@
+export { DatePicker } from './DatePicker';
+//# sourceMappingURL=index.js.map

package/dist/components/date-picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/date-picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC","sourcesContent":["export { DatePicker } from './DatePicker';\nexport type { DatePickerProps, DatePickerValue } from './types';\n"]}

package/dist/components/date-picker/meta.d.ts

@@ -0,0 +1,9 @@
+export declare const datePickerMeta: {
+    readonly name: "DatePicker";
+    readonly category: "component";
+    readonly directManifestNode: false;
+    readonly allowedChildren: readonly [];
+    readonly note: "Code-facing ActionSheet-backed date picker; not represented as a manifest node in v1.";
+    readonly props: {};
+};
+//# sourceMappingURL=meta.d.ts.map

package/dist/components/date-picker/meta.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/meta.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc;;;;;;;CAOW,CAAC"}

package/dist/components/date-picker/meta.js

@@ -0,0 +1,9 @@
+export const datePickerMeta = {
+    name: 'DatePicker',
+    category: 'component',
+    directManifestNode: false,
+    allowedChildren: [],
+    note: 'Code-facing ActionSheet-backed date picker; not represented as a manifest node in v1.',
+    props: {},
+};
+//# sourceMappingURL=meta.js.map

package/dist/components/date-picker/meta.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.js","sourceRoot":"","sources":["../../../src/components/date-picker/meta.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,IAAI,EAAE,YAAY;IAClB,QAAQ,EAAE,WAAW;IACrB,kBAAkB,EAAE,KAAK;IACzB,eAAe,EAAE,EAAE;IACnB,IAAI,EAAE,uFAAuF;IAC7F,KAAK,EAAE,EAAE;CAC2B,CAAC","sourcesContent":["import type { ZoraComponentMeta } from '../../metadata';\n\nexport const datePickerMeta = {\n  name: 'DatePicker',\n  category: 'component',\n  directManifestNode: false,\n  allowedChildren: [],\n  note: 'Code-facing ActionSheet-backed date picker; not represented as a manifest node in v1.',\n  props: {},\n} as const satisfies ZoraComponentMeta;\n"]}

package/dist/components/date-picker/types.d.ts

@@ -0,0 +1,18 @@
+import type React from 'react';
+import type { ZoraBaseProps } from '../../theme/ZoraBaseProps';
+export type DatePickerValue = Date | null;
+export interface DatePickerProps extends ZoraBaseProps {
+    value: DatePickerValue;
+    onValueChange?: (value: DatePickerValue) => void;
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+    error?: React.ReactNode;
+    placeholder?: React.ReactNode;
+    minDate?: Date;
+    maxDate?: Date;
+    disabled?: boolean;
+    required?: boolean;
+    formatDate?: (value: Date) => React.ReactNode;
+    testID?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/components/date-picker/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/date-picker/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,CAAC;AAE1C,MAAM,WAAW,eAAgB,SAAQ,aAAa;IACpD,KAAK,EAAE,eAAe,CAAC;IACvB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IACjD,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,KAAK,KAAK,CAAC,SAAS,CAAC;IAC9C,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/dist/components/date-picker/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/date-picker/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/date-picker/types.ts"],"names":[],"mappings":"","sourcesContent":["import type React from 'react';\n\nimport type { ZoraBaseProps } from '../../theme/ZoraBaseProps';\n\nexport type DatePickerValue = Date | null;\n\nexport interface DatePickerProps extends ZoraBaseProps {\n  value: DatePickerValue;\n  onValueChange?: (value: DatePickerValue) => void;\n  label?: React.ReactNode;\n  description?: React.ReactNode;\n  error?: React.ReactNode;\n  placeholder?: React.ReactNode;\n  minDate?: Date;\n  maxDate?: Date;\n  disabled?: boolean;\n  required?: boolean;\n  formatDate?: (value: Date) => React.ReactNode;\n  testID?: string;\n}\n"]}

package/dist/components/time-picker/TimePicker.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { TimePickerProps } from './types';
+export declare const TimePicker: (props: TimePickerProps) => React.ReactElement | null;
+//# sourceMappingURL=TimePicker.d.ts.map

package/dist/components/time-picker/TimePicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/time-picker/TimePicker.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AA8I/C,eAAO,MAAM,UAAU,uDAAsC,CAAC"}

package/dist/components/time-picker/TimePicker.js

@@ -0,0 +1,80 @@
+import { Field } from '@ankhorage/surface';
+import React from 'react';
+import { ScrollView } from 'react-native';
+import { Stack } from '../../foundation';
+import { withZoraThemeScope } from '../../theme/withZoraThemeScope';
+import { ActionSheet, ActionSheetItem } from '../action-sheet';
+import { Button } from '../button';
+import { Text } from '../text';
+const MINUTES_PER_DAY = 24 * 60;
+const DEFAULT_STEP_MINUTES = 30;
+function renderLabel(label, description) {
+    return (<Stack gap="xs">
+      <Text variant="label" weight="semiBold">
+        {label}
+      </Text>
+      {description ? (<Text emphasis="muted" variant="bodySmall">
+          {description}
+        </Text>) : null}
+    </Stack>);
+}
+function parseTimeToMinutes(value) {
+    if (!value) {
+        return undefined;
+    }
+    const match = /^(\d{2}):(\d{2})$/.exec(value);
+    if (!match) {
+        return undefined;
+    }
+    const hours = Number(match[1]);
+    const minutes = Number(match[2]);
+    if (hours < 0 || hours > 23 || minutes < 0 || minutes > 59) {
+        return undefined;
+    }
+    return hours * 60 + minutes;
+}
+function formatMinutes(value) {
+    const hours = Math.floor(value / 60);
+    const minutes = value % 60;
+    return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}`;
+}
+function resolveStepMinutes(stepMinutes) {
+    if (stepMinutes === undefined || !Number.isFinite(stepMinutes) || stepMinutes <= 0) {
+        return DEFAULT_STEP_MINUTES;
+    }
+    return Math.max(1, Math.floor(stepMinutes));
+}
+function generateTimeOptions({ minTime, maxTime, stepMinutes, }) {
+    const step = resolveStepMinutes(stepMinutes);
+    const min = parseTimeToMinutes(minTime) ?? 0;
+    const max = parseTimeToMinutes(maxTime) ?? MINUTES_PER_DAY - 1;
+    const options = [];
+    for (let minute = 0; minute < MINUTES_PER_DAY; minute += step) {
+        if (minute >= min && minute <= max) {
+            options.push(formatMinutes(minute));
+        }
+    }
+    return options;
+}
+function TimePickerInner({ themeId: _themeId, mode: _mode, value, onValueChange, label, description, error, placeholder = 'Choose time', minTime, maxTime, stepMinutes, disabled = false, required = false, formatTime, testID, }) {
+    const [visible, setVisible] = React.useState(false);
+    const options = React.useMemo(() => generateTimeOptions({ maxTime, minTime, stepMinutes }), [maxTime, minTime, stepMinutes]);
+    const displayValue = value ? (formatTime ? formatTime(value) : value) : placeholder;
+    return (<Field disabled={disabled} errorText={error} invalid={Boolean(error)} label={label ? renderLabel(label, description) : undefined} required={required} testID={testID}>
+      <Button disabled={disabled} onPress={() => setVisible(true)} testID={testID ? `${testID}-trigger` : undefined} trailingIcon={{ name: 'chevron-down-outline' }} variant="outline">
+        {displayValue}
+      </Button>
+      <ActionSheet description={description} onDismiss={() => setVisible(false)} testID={testID ? `${testID}-sheet` : undefined} title={label ?? 'Choose time'} visible={visible}>
+        <ScrollView style={{ maxHeight: 360 }}>
+          <Stack gap="xxs">
+            {options.map((option) => (<ActionSheetItem key={option} label={formatTime ? formatTime(option) : option} onPress={() => {
+                onValueChange?.(option);
+                setVisible(false);
+            }} selected={option === value} testID={testID ? `${testID}-option-${option}` : undefined}/>))}
+          </Stack>
+        </ScrollView>
+      </ActionSheet>
+    </Field>);
+}
+export const TimePicker = withZoraThemeScope(TimePickerInner);
+//# sourceMappingURL=TimePicker.js.map

package/dist/components/time-picker/TimePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimePicker.js","sourceRoot":"","sources":["../../../src/components/time-picker/TimePicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Field } from '@ankhorage/surface';\nimport React from 'react';\nimport { ScrollView } from 'react-native';\n\nimport { Stack } from '../../foundation';\nimport { withZoraThemeScope } from '../../theme/withZoraThemeScope';\nimport { ActionSheet, ActionSheetItem } from '../action-sheet';\nimport { Button } from '../button';\nimport { Text } from '../text';\nimport type { TimePickerProps } from './types';\n\nconst MINUTES_PER_DAY = 24 * 60;\nconst DEFAULT_STEP_MINUTES = 30;\n\nfunction renderLabel(label: React.ReactNode, description: React.ReactNode | undefined) {\n  return (\n    <Stack gap=\"xs\">\n      <Text variant=\"label\" weight=\"semiBold\">\n        {label}\n      </Text>\n      {description ? (\n        <Text emphasis=\"muted\" variant=\"bodySmall\">\n          {description}\n        </Text>\n      ) : null}\n    </Stack>\n  );\n}\n\nfunction parseTimeToMinutes(value: string | undefined): number | undefined {\n  if (!value) {\n    return undefined;\n  }\n\n  const match = /^(\\d{2}):(\\d{2})$/.exec(value);\n  if (!match) {\n    return undefined;\n  }\n\n  const hours = Number(match[1]);\n  const minutes = Number(match[2]);\n  if (hours < 0 || hours > 23 || minutes < 0 || minutes > 59) {\n    return undefined;\n  }\n\n  return hours * 60 + minutes;\n}\n\nfunction formatMinutes(value: number): string {\n  const hours = Math.floor(value / 60);\n  const minutes = value % 60;\n  return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}`;\n}\n\nfunction resolveStepMinutes(stepMinutes: number | undefined): number {\n  if (stepMinutes === undefined || !Number.isFinite(stepMinutes) || stepMinutes <= 0) {\n    return DEFAULT_STEP_MINUTES;\n  }\n\n  return Math.max(1, Math.floor(stepMinutes));\n}\n\nfunction generateTimeOptions({\n  minTime,\n  maxTime,\n  stepMinutes,\n}: Pick<TimePickerProps, 'maxTime' | 'minTime' | 'stepMinutes'>): string[] {\n  const step = resolveStepMinutes(stepMinutes);\n  const min = parseTimeToMinutes(minTime) ?? 0;\n  const max = parseTimeToMinutes(maxTime) ?? MINUTES_PER_DAY - 1;\n  const options: string[] = [];\n\n  for (let minute = 0; minute < MINUTES_PER_DAY; minute += step) {\n    if (minute >= min && minute <= max) {\n      options.push(formatMinutes(minute));\n    }\n  }\n\n  return options;\n}\n\nfunction TimePickerInner({\n  themeId: _themeId,\n  mode: _mode,\n  value,\n  onValueChange,\n  label,\n  description,\n  error,\n  placeholder = 'Choose time',\n  minTime,\n  maxTime,\n  stepMinutes,\n  disabled = false,\n  required = false,\n  formatTime,\n  testID,\n}: TimePickerProps) {\n  const [visible, setVisible] = React.useState(false);\n  const options = React.useMemo(\n    () => generateTimeOptions({ maxTime, minTime, stepMinutes }),\n    [maxTime, minTime, stepMinutes],\n  );\n  const displayValue = value ? (formatTime ? formatTime(value) : value) : placeholder;\n\n  return (\n    <Field\n      disabled={disabled}\n      errorText={error}\n      invalid={Boolean(error)}\n      label={label ? renderLabel(label, description) : undefined}\n      required={required}\n      testID={testID}\n    >\n      <Button\n        disabled={disabled}\n        onPress={() => setVisible(true)}\n        testID={testID ? `${testID}-trigger` : undefined}\n        trailingIcon={{ name: 'chevron-down-outline' }}\n        variant=\"outline\"\n      >\n        {displayValue}\n      </Button>\n      <ActionSheet\n        description={description}\n        onDismiss={() => setVisible(false)}\n        testID={testID ? `${testID}-sheet` : undefined}\n        title={label ?? 'Choose time'}\n        visible={visible}\n      >\n        <ScrollView style={{ maxHeight: 360 }}>\n          <Stack gap=\"xxs\">\n            {options.map((option) => (\n              <ActionSheetItem\n                key={option}\n                label={formatTime ? formatTime(option) : option}\n                onPress={() => {\n                  onValueChange?.(option);\n                  setVisible(false);\n                }}\n                selected={option === value}\n                testID={testID ? `${testID}-option-${option}` : undefined}\n              />\n            ))}\n          </Stack>\n        </ScrollView>\n      </ActionSheet>\n    </Field>\n  );\n}\n\nexport const TimePicker = withZoraThemeScope(TimePickerInner);\n"]}

package/dist/components/time-picker/index.d.ts

@@ -0,0 +1,3 @@
+export { TimePicker } from './TimePicker';
+export type { TimePickerProps, TimePickerValue } from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/time-picker/index.d.ts.map

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

package/dist/components/time-picker/index.js

@@ -0,0 +1,2 @@
+export { TimePicker } from './TimePicker';
+//# sourceMappingURL=index.js.map

package/dist/components/time-picker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/time-picker/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC","sourcesContent":["export { TimePicker } from './TimePicker';\nexport type { TimePickerProps, TimePickerValue } from './types';\n"]}

package/dist/components/time-picker/meta.d.ts

@@ -0,0 +1,9 @@
+export declare const timePickerMeta: {
+    readonly name: "TimePicker";
+    readonly category: "component";
+    readonly directManifestNode: false;
+    readonly allowedChildren: readonly [];
+    readonly note: "Code-facing ActionSheet-backed time picker; not represented as a manifest node in v1.";
+    readonly props: {};
+};
+//# sourceMappingURL=meta.d.ts.map

package/dist/components/time-picker/meta.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../../src/components/time-picker/meta.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc;;;;;;;CAOW,CAAC"}

package/dist/components/time-picker/meta.js

@@ -0,0 +1,9 @@
+export const timePickerMeta = {
+    name: 'TimePicker',
+    category: 'component',
+    directManifestNode: false,
+    allowedChildren: [],
+    note: 'Code-facing ActionSheet-backed time picker; not represented as a manifest node in v1.',
+    props: {},
+};
+//# sourceMappingURL=meta.js.map