@gunkin/uiify 0.0.17-alpha → 0.0.20-alpha
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/agents/components.md +1 -1
- package/agents/index.md +1 -0
- package/agents/reference/components/breadcrumb.md +11 -1
- package/agents/reference/components/button.md +4 -4
- package/agents/reference/components/candle-chart.md +20 -1
- package/agents/reference/components/carousel.md +3 -2
- package/agents/reference/components/combobox.md +2 -1
- package/agents/reference/components/drawer.md +8 -1
- package/agents/reference/components/dropdown-menu.md +1 -1
- package/agents/reference/components/file-upload.md +12 -1
- package/agents/reference/components/line-chart.md +1 -0
- package/agents/reference/components/modal.md +8 -1
- package/agents/reference/components/number-field.md +14 -3
- package/agents/reference/components/pagination.md +22 -1
- package/agents/reference/components/slider.md +9 -1
- package/agents/reference/components/spinner.md +8 -1
- package/agents/reference/components/toast.md +14 -1
- package/dist/components/behavior.css +9 -9
- package/dist/components/behavior.css.map +1 -1
- package/dist/components/breadcrumb/Breadcrumb.d.ts.map +1 -1
- package/dist/components/breadcrumb/Breadcrumb.js +21 -4
- package/dist/components/breadcrumb/Breadcrumb.js.map +1 -1
- package/dist/components/breadcrumb/index.d.ts +1 -1
- package/dist/components/breadcrumb/index.d.ts.map +1 -1
- package/dist/components/breadcrumb/index.js.map +1 -1
- package/dist/components/breadcrumb/types.d.ts +7 -0
- package/dist/components/breadcrumb/types.d.ts.map +1 -1
- package/dist/components/button/types.d.ts +4 -0
- package/dist/components/button/types.d.ts.map +1 -1
- package/dist/components/candle-chart/CandleChart.d.ts +1 -1
- package/dist/components/candle-chart/CandleChart.d.ts.map +1 -1
- package/dist/components/candle-chart/CandleChart.js +81 -46
- package/dist/components/candle-chart/CandleChart.js.map +1 -1
- package/dist/components/candle-chart/client/CandleChartClient.d.ts.map +1 -1
- package/dist/components/candle-chart/client/CandleChartClient.js +5 -0
- package/dist/components/candle-chart/client/CandleChartClient.js.map +1 -1
- package/dist/components/candle-chart/index.d.ts +1 -1
- package/dist/components/candle-chart/index.d.ts.map +1 -1
- package/dist/components/candle-chart/index.js.map +1 -1
- package/dist/components/candle-chart/types.d.ts +17 -0
- package/dist/components/candle-chart/types.d.ts.map +1 -1
- package/dist/components/carousel/CarouselMarkup.d.ts.map +1 -1
- package/dist/components/carousel/CarouselMarkup.js +20 -3
- package/dist/components/carousel/CarouselMarkup.js.map +1 -1
- package/dist/components/carousel/carousel-markup.js +2 -2
- package/dist/components/carousel/carousel-markup.js.map +1 -1
- package/dist/components/carousel/types.d.ts +3 -2
- package/dist/components/carousel/types.d.ts.map +1 -1
- package/dist/components/combobox/Combobox.d.ts.map +1 -1
- package/dist/components/combobox/Combobox.js +37 -23
- package/dist/components/combobox/Combobox.js.map +1 -1
- package/dist/components/combobox/combobox-store.d.ts.map +1 -1
- package/dist/components/combobox/combobox-store.js +5 -2
- package/dist/components/combobox/combobox-store.js.map +1 -1
- package/dist/components/combobox/types.d.ts +2 -3
- package/dist/components/combobox/types.d.ts.map +1 -1
- package/dist/components/context-menu/ContextMenu.d.ts.map +1 -1
- package/dist/components/context-menu/ContextMenu.js +25 -5
- package/dist/components/context-menu/ContextMenu.js.map +1 -1
- package/dist/components/drawer/DrawerNative.d.ts +1 -1
- package/dist/components/drawer/DrawerNative.d.ts.map +1 -1
- package/dist/components/drawer/DrawerNative.js +5 -2
- package/dist/components/drawer/DrawerNative.js.map +1 -1
- package/dist/components/drawer/index.d.ts +1 -1
- package/dist/components/drawer/index.d.ts.map +1 -1
- package/dist/components/drawer/index.js.map +1 -1
- package/dist/components/drawer/types.d.ts +4 -0
- package/dist/components/drawer/types.d.ts.map +1 -1
- package/dist/components/dropdown-menu/DropdownMenu.d.ts.map +1 -1
- package/dist/components/dropdown-menu/DropdownMenu.js +31 -15
- package/dist/components/dropdown-menu/DropdownMenu.js.map +1 -1
- package/dist/components/dropdown-menu/DropdownMenuBar.d.ts.map +1 -1
- package/dist/components/dropdown-menu/DropdownMenuBar.js +7 -5
- package/dist/components/dropdown-menu/DropdownMenuBar.js.map +1 -1
- package/dist/components/dropdown-menu/types.d.ts +1 -1
- package/dist/components/dropdown-menu/types.d.ts.map +1 -1
- package/dist/components/file-upload/FileUpload.d.ts.map +1 -1
- package/dist/components/file-upload/FileUpload.js +11 -4
- package/dist/components/file-upload/FileUpload.js.map +1 -1
- package/dist/components/file-upload/FileUploadRoot.d.ts +1 -1
- package/dist/components/file-upload/FileUploadRoot.d.ts.map +1 -1
- package/dist/components/file-upload/FileUploadRoot.js +9 -0
- package/dist/components/file-upload/FileUploadRoot.js.map +1 -1
- package/dist/components/file-upload/index.d.ts +1 -1
- package/dist/components/file-upload/index.d.ts.map +1 -1
- package/dist/components/file-upload/index.js.map +1 -1
- package/dist/components/file-upload/types.d.ts +8 -0
- package/dist/components/file-upload/types.d.ts.map +1 -1
- package/dist/components/line-chart/LineChart.d.ts.map +1 -1
- package/dist/components/line-chart/LineChart.js +3 -2
- package/dist/components/line-chart/LineChart.js.map +1 -1
- package/dist/components/line-chart/line-chart-geometry.d.ts +2 -2
- package/dist/components/line-chart/line-chart-geometry.d.ts.map +1 -1
- package/dist/components/line-chart/line-chart-geometry.js +6 -6
- package/dist/components/line-chart/line-chart-geometry.js.map +1 -1
- package/dist/components/line-chart/types.d.ts +2 -0
- package/dist/components/line-chart/types.d.ts.map +1 -1
- package/dist/components/modal/Modal.d.ts +1 -1
- package/dist/components/modal/Modal.d.ts.map +1 -1
- package/dist/components/modal/Modal.js +5 -2
- package/dist/components/modal/Modal.js.map +1 -1
- package/dist/components/modal/index.d.ts +1 -1
- package/dist/components/modal/index.d.ts.map +1 -1
- package/dist/components/modal/index.js.map +1 -1
- package/dist/components/modal/types.d.ts +4 -0
- package/dist/components/modal/types.d.ts.map +1 -1
- package/dist/components/number-field/NumberField.d.ts +1 -1
- package/dist/components/number-field/NumberField.d.ts.map +1 -1
- package/dist/components/number-field/NumberField.js +25 -5
- package/dist/components/number-field/NumberField.js.map +1 -1
- package/dist/components/number-field/format.d.ts +1 -1
- package/dist/components/number-field/format.d.ts.map +1 -1
- package/dist/components/number-field/format.js +32 -7
- package/dist/components/number-field/format.js.map +1 -1
- package/dist/components/number-field/index.d.ts +1 -1
- package/dist/components/number-field/index.d.ts.map +1 -1
- package/dist/components/number-field/index.js.map +1 -1
- package/dist/components/number-field/types.d.ts +11 -2
- package/dist/components/number-field/types.d.ts.map +1 -1
- package/dist/components/otp-input/OtpInput.d.ts.map +1 -1
- package/dist/components/otp-input/OtpInput.js +2 -0
- package/dist/components/otp-input/OtpInput.js.map +1 -1
- package/dist/components/pagination/Pagination.d.ts.map +1 -1
- package/dist/components/pagination/Pagination.js +93 -29
- package/dist/components/pagination/Pagination.js.map +1 -1
- package/dist/components/pagination/PaginationShell.d.ts +2 -1
- package/dist/components/pagination/PaginationShell.d.ts.map +1 -1
- package/dist/components/pagination/PaginationShell.js +44 -9
- package/dist/components/pagination/PaginationShell.js.map +1 -1
- package/dist/components/pagination/index.d.ts +1 -1
- package/dist/components/pagination/index.d.ts.map +1 -1
- package/dist/components/pagination/index.js.map +1 -1
- package/dist/components/pagination/types.d.ts +18 -0
- package/dist/components/pagination/types.d.ts.map +1 -1
- package/dist/components/slider/client/SliderClient.d.ts.map +1 -1
- package/dist/components/slider/client/SliderClient.js +11 -2
- package/dist/components/slider/client/SliderClient.js.map +1 -1
- package/dist/components/slider/index.d.ts +1 -1
- package/dist/components/slider/index.d.ts.map +1 -1
- package/dist/components/slider/index.js.map +1 -1
- package/dist/components/slider/types.d.ts +5 -0
- package/dist/components/slider/types.d.ts.map +1 -1
- package/dist/components/spinner/Spinner.d.ts.map +1 -1
- package/dist/components/spinner/Spinner.js +6 -3
- package/dist/components/spinner/Spinner.js.map +1 -1
- package/dist/components/spinner/index.d.ts +1 -1
- package/dist/components/spinner/index.d.ts.map +1 -1
- package/dist/components/spinner/index.js.map +1 -1
- package/dist/components/spinner/types.d.ts +4 -0
- package/dist/components/spinner/types.d.ts.map +1 -1
- package/dist/components/tags-input/TagsInput.d.ts.map +1 -1
- package/dist/components/tags-input/TagsInput.js +2 -0
- package/dist/components/tags-input/TagsInput.js.map +1 -1
- package/dist/components/toast/Toast.d.ts +1 -1
- package/dist/components/toast/Toast.d.ts.map +1 -1
- package/dist/components/toast/Toast.js +33 -29
- package/dist/components/toast/Toast.js.map +1 -1
- package/dist/components/toast/ToastElements.d.ts.map +1 -1
- package/dist/components/toast/ToastElements.js +24 -12
- package/dist/components/toast/ToastElements.js.map +1 -1
- package/dist/components/toast/index.d.ts +1 -1
- package/dist/components/toast/index.d.ts.map +1 -1
- package/dist/components/toast/index.js.map +1 -1
- package/dist/components/toast/types.d.ts +10 -0
- package/dist/components/toast/types.d.ts.map +1 -1
- package/dist/components/toolbar/Toolbar.d.ts +2 -2
- package/dist/components/toolbar/Toolbar.d.ts.map +1 -1
- package/dist/components/toolbar/Toolbar.js +8 -4
- package/dist/components/toolbar/Toolbar.js.map +1 -1
- package/dist/core/direction.d.ts +2 -0
- package/dist/core/direction.d.ts.map +1 -1
- package/dist/core/direction.js +8 -3
- package/dist/core/direction.js.map +1 -1
- package/dist/core/dismissable-layer-registry.d.ts.map +1 -1
- package/dist/core/dismissable-layer-registry.js +3 -1
- package/dist/core/dismissable-layer-registry.js.map +1 -1
- package/dist/core/format-label.d.ts +2 -0
- package/dist/core/format-label.d.ts.map +1 -0
- package/dist/core/format-label.js +13 -0
- package/dist/core/format-label.js.map +1 -0
- package/dist/core/ime.d.ts +16 -0
- package/dist/core/ime.d.ts.map +1 -0
- package/dist/core/ime.js +7 -0
- package/dist/core/ime.js.map +1 -0
- package/dist/core/index.d.ts +3 -0
- package/dist/core/index.d.ts.map +1 -1
- package/dist/core/index.js +3 -0
- package/dist/core/index.js.map +1 -1
- package/dist/core/roving-focus-store.d.ts +3 -2
- package/dist/core/roving-focus-store.d.ts.map +1 -1
- package/dist/core/roving-focus-store.js +5 -3
- package/dist/core/roving-focus-store.js.map +1 -1
- package/dist/core/roving-focus.d.ts.map +1 -1
- package/dist/core/roving-focus.js +10 -5
- package/dist/core/roving-focus.js.map +1 -1
- package/dist/core/text-direction.d.ts +7 -0
- package/dist/core/text-direction.d.ts.map +1 -0
- package/dist/core/text-direction.js +7 -0
- package/dist/core/text-direction.js.map +1 -0
- package/dist/styles/index.css +1 -1
- package/package.json +2 -1
- package/skills/uiify/SKILL.md +58 -33
- package/skills/uiify/references/compositions/card-rhythm.md +0 -2
- package/skills/uiify/references/compositions/destructive-confirmation.md +1 -3
- package/skills/uiify/references/compositions/form-grouping.md +0 -2
- package/skills/uiify/references/compositions/hero-actions.md +3 -5
- package/skills/uiify/references/compositions/page-frame.md +0 -2
- package/skills/uiify/references/compositions/pricing-actions.md +0 -2
- package/skills/uiify/references/compositions/save-feedback.md +1 -3
- package/skills/uiify/references/compositions/table-controls.md +1 -3
- package/skills/uiify/references/elements/accordion.md +38 -0
- package/skills/uiify/references/elements/alert-modal.md +32 -5
- package/skills/uiify/references/elements/avatar.md +31 -2
- package/skills/uiify/references/elements/badge.md +32 -3
- package/skills/uiify/references/elements/bar-chart.md +39 -7
- package/skills/uiify/references/elements/breadcrumb.md +38 -0
- package/skills/uiify/references/elements/button.md +38 -3
- package/skills/uiify/references/elements/candle-chart.md +40 -0
- package/skills/uiify/references/elements/card.md +38 -1
- package/skills/uiify/references/elements/carousel.md +40 -0
- package/skills/uiify/references/elements/checkbox.md +39 -0
- package/skills/uiify/references/elements/code-block.md +31 -2
- package/skills/uiify/references/elements/collapsible.md +38 -0
- package/skills/uiify/references/elements/color-picker.md +39 -0
- package/skills/uiify/references/elements/combobox.md +37 -0
- package/skills/uiify/references/elements/command-palette.md +33 -12
- package/skills/uiify/references/elements/context-menu.md +38 -0
- package/skills/uiify/references/elements/cookie-banner.md +30 -2
- package/skills/uiify/references/elements/date-picker.md +33 -9
- package/skills/uiify/references/elements/divider.md +30 -2
- package/skills/uiify/references/elements/drawer.md +38 -0
- package/skills/uiify/references/elements/dropdown-menu.md +38 -0
- package/skills/uiify/references/elements/empty-state.md +30 -2
- package/skills/uiify/references/elements/feature-grid.md +41 -1
- package/skills/uiify/references/elements/field.md +33 -3
- package/skills/uiify/references/elements/file-upload.md +40 -0
- package/skills/uiify/references/elements/footer.md +35 -4
- package/skills/uiify/references/elements/form.md +31 -4
- package/skills/uiify/references/elements/header.md +31 -3
- package/skills/uiify/references/elements/hero.md +43 -3
- package/skills/uiify/references/elements/hover-card.md +38 -0
- package/skills/uiify/references/elements/image-gallery.md +36 -4
- package/skills/uiify/references/elements/inline-alert.md +30 -2
- package/skills/uiify/references/elements/input.md +31 -4
- package/skills/uiify/references/elements/line-chart.md +38 -0
- package/skills/uiify/references/elements/logo-wall.md +31 -2
- package/skills/uiify/references/elements/modal.md +38 -0
- package/skills/uiify/references/elements/number-field.md +41 -0
- package/skills/uiify/references/elements/otp-input.md +39 -0
- package/skills/uiify/references/elements/pagination.md +33 -4
- package/skills/uiify/references/elements/password-input.md +33 -9
- package/skills/uiify/references/elements/popup.md +38 -0
- package/skills/uiify/references/elements/pricing-table.md +55 -2
- package/skills/uiify/references/elements/progress-bar.md +32 -4
- package/skills/uiify/references/elements/radio-group.md +39 -0
- package/skills/uiify/references/elements/rating.md +39 -0
- package/skills/uiify/references/elements/search-input.md +35 -4
- package/skills/uiify/references/elements/segmented-control.md +39 -0
- package/skills/uiify/references/elements/select.md +29 -1
- package/skills/uiify/references/elements/sidebar.md +33 -10
- package/skills/uiify/references/elements/skeleton.md +38 -0
- package/skills/uiify/references/elements/slider.md +39 -0
- package/skills/uiify/references/elements/spinner.md +38 -0
- package/skills/uiify/references/elements/stats-bar.md +30 -2
- package/skills/uiify/references/elements/stepper.md +32 -9
- package/skills/uiify/references/elements/switch.md +31 -4
- package/skills/uiify/references/elements/table-of-contents.md +39 -0
- package/skills/uiify/references/elements/table.md +32 -3
- package/skills/uiify/references/elements/tabs.md +38 -0
- package/skills/uiify/references/elements/tags-input.md +39 -0
- package/skills/uiify/references/elements/testimonial.md +35 -4
- package/skills/uiify/references/elements/textarea.md +30 -3
- package/skills/uiify/references/elements/timeline.md +31 -3
- package/skills/uiify/references/elements/toast.md +27 -1
- package/skills/uiify/references/elements/toggle-group.md +39 -0
- package/skills/uiify/references/elements/toggle.md +39 -0
- package/skills/uiify/references/elements/toolbar.md +39 -0
- package/skills/uiify/references/elements/tooltip.md +38 -0
- package/skills/uiify/references/elements/virtual-scroll.md +39 -0
- package/skills/uiify/references/examples/alert-confirmation.md +34 -0
- package/skills/uiify/references/examples/field-validation.md +37 -0
- package/skills/uiify/references/examples/select-basic.md +35 -0
- package/skills/uiify/references/examples/table-controls.md +40 -0
- package/skills/uiify/references/guides/assets.md +14 -0
- package/skills/uiify/references/guides/content.md +11 -0
- package/skills/uiify/references/guides/hierarchy.md +14 -0
- package/skills/uiify/references/guides/i18n.md +21 -0
- package/skills/uiify/references/guides/reference.md +9 -0
- package/skills/uiify/references/guides/states.md +12 -0
- package/skills/uiify/references/guides/surface.md +27 -0
- package/skills/uiify/scripts/lint.mjs +1 -1
- package/skills/uiify/scripts/static.mjs +150 -14
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/number-field/format.ts"],"sourcesContent":["export function clampNumber(value: number, min?: number, max?: number): number {\n let next = value;\n if (min !== undefined && next < min) next = min;\n if (max !== undefined && next > max) next = max;\n return next;\n}\n\nexport function createFormatter(options?: Intl.NumberFormatOptions): Intl.NumberFormat {\n return new Intl.NumberFormat(
|
|
1
|
+
{"version":3,"sources":["../../../src/components/number-field/format.ts"],"sourcesContent":["export function clampNumber(value: number, min?: number, max?: number): number {\n let next = value;\n if (min !== undefined && next < min) next = min;\n if (max !== undefined && next > max) next = max;\n return next;\n}\n\nexport function createFormatter(\n locale: string,\n options?: Intl.NumberFormatOptions,\n): Intl.NumberFormat {\n return new Intl.NumberFormat(locale, options);\n}\n\nexport function formatNumber(value: number, formatter: Intl.NumberFormat): string {\n return formatter.format(value);\n}\n\nconst BIDI_CONTROL = /\\p{Bidi_Control}/gu;\nconst digitMaps = new WeakMap<Intl.NumberFormat, ReadonlyMap<string, string>>();\n\nfunction fold(value: string): string {\n return value.normalize(\"NFKC\").replace(BIDI_CONTROL, \"\");\n}\n\nfunction nativeDigits(formatter: Intl.NumberFormat): ReadonlyMap<string, string> {\n let map = digitMaps.get(formatter);\n if (!map) {\n const { locale, numberingSystem } = formatter.resolvedOptions();\n const digits = new Intl.NumberFormat(locale, { numberingSystem, useGrouping: false });\n const entries = new Map<string, string>();\n for (let digit = 0; digit <= 9; digit += 1) {\n const native = fold(digits.format(digit));\n if (native !== String(digit)) entries.set(native, String(digit));\n }\n map = entries;\n digitMaps.set(formatter, map);\n }\n return map;\n}\n\nfunction normalizeInput(input: string, formatter: Intl.NumberFormat): string {\n const parts = formatter.formatToParts(-12345.6);\n const decimal = fold(parts.find((part) => part.type === \"decimal\")?.value ?? \".\");\n const group = fold(parts.find((part) => part.type === \"group\")?.value ?? \",\");\n let normalized = fold(input.trim());\n for (const [native, ascii] of nativeDigits(formatter)) {\n normalized = normalized.replaceAll(native, ascii);\n }\n normalized = normalized.replaceAll(group, \"\").replace(decimal, \".\");\n for (const part of parts) {\n const value = fold(part.value);\n if (\n part.type === \"currency\" ||\n part.type === \"unit\" ||\n part.type === \"literal\" ||\n part.type === \"percentSign\"\n )\n normalized = normalized.replaceAll(value, \"\");\n if (part.type === \"minusSign\") normalized = normalized.replaceAll(value, \"-\");\n }\n return normalized.replace(/\\s/g, \"\");\n}\n\nexport function isNumberInput(input: string, formatter: Intl.NumberFormat): boolean {\n return /^[+-]?\\d*(?:\\.\\d*)?$/.test(normalizeInput(input, formatter));\n}\n\nexport function parseNumber(input: string, formatter: Intl.NumberFormat): number | undefined {\n const normalized = normalizeInput(input, formatter);\n if (!/^[+-]?(?:\\d+(?:\\.\\d*)?|\\.\\d+)$/.test(normalized)) return undefined;\n const parsed = Number(normalized) / (formatter.resolvedOptions().style === \"percent\" ? 100 : 1);\n return Number.isFinite(parsed) ? parsed : undefined;\n}\n\nexport function stepNumber(\n value: number,\n delta: number,\n step: number,\n min?: number,\n max?: number,\n): number {\n const precision = step.toString().includes(\".\")\n ? (step.toString().split(\".\")[1]?.length ?? 0)\n : 0;\n const next = Number((value + delta * step).toFixed(precision));\n return clampNumber(next, min, max);\n}\n"],"mappings":"AAAO,SAAS,YAAY,OAAe,KAAc,KAAsB;AAC7E,MAAI,OAAO;AACX,MAAI,QAAQ,UAAa,OAAO,IAAK,QAAO;AAC5C,MAAI,QAAQ,UAAa,OAAO,IAAK,QAAO;AAC5C,SAAO;AACT;AAEO,SAAS,gBACd,QACA,SACmB;AACnB,SAAO,IAAI,KAAK,aAAa,QAAQ,OAAO;AAC9C;AAEO,SAAS,aAAa,OAAe,WAAsC;AAChF,SAAO,UAAU,OAAO,KAAK;AAC/B;AAEA,MAAM,eAAe;AACrB,MAAM,YAAY,oBAAI,QAAwD;AAE9E,SAAS,KAAK,OAAuB;AACnC,SAAO,MAAM,UAAU,MAAM,EAAE,QAAQ,cAAc,EAAE;AACzD;AAEA,SAAS,aAAa,WAA2D;AAC/E,MAAI,MAAM,UAAU,IAAI,SAAS;AACjC,MAAI,CAAC,KAAK;AACR,UAAM,EAAE,QAAQ,gBAAgB,IAAI,UAAU,gBAAgB;AAC9D,UAAM,SAAS,IAAI,KAAK,aAAa,QAAQ,EAAE,iBAAiB,aAAa,MAAM,CAAC;AACpF,UAAM,UAAU,oBAAI,IAAoB;AACxC,aAAS,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG;AAC1C,YAAM,SAAS,KAAK,OAAO,OAAO,KAAK,CAAC;AACxC,UAAI,WAAW,OAAO,KAAK,EAAG,SAAQ,IAAI,QAAQ,OAAO,KAAK,CAAC;AAAA,IACjE;AACA,UAAM;AACN,cAAU,IAAI,WAAW,GAAG;AAAA,EAC9B;AACA,SAAO;AACT;AAEA,SAAS,eAAe,OAAe,WAAsC;AAC3E,QAAM,QAAQ,UAAU,cAAc,QAAQ;AAC9C,QAAM,UAAU,KAAK,MAAM,KAAK,CAAC,SAAS,KAAK,SAAS,SAAS,GAAG,SAAS,GAAG;AAChF,QAAM,QAAQ,KAAK,MAAM,KAAK,CAAC,SAAS,KAAK,SAAS,OAAO,GAAG,SAAS,GAAG;AAC5E,MAAI,aAAa,KAAK,MAAM,KAAK,CAAC;AAClC,aAAW,CAAC,QAAQ,KAAK,KAAK,aAAa,SAAS,GAAG;AACrD,iBAAa,WAAW,WAAW,QAAQ,KAAK;AAAA,EAClD;AACA,eAAa,WAAW,WAAW,OAAO,EAAE,EAAE,QAAQ,SAAS,GAAG;AAClE,aAAW,QAAQ,OAAO;AACxB,UAAM,QAAQ,KAAK,KAAK,KAAK;AAC7B,QACE,KAAK,SAAS,cACd,KAAK,SAAS,UACd,KAAK,SAAS,aACd,KAAK,SAAS;AAEd,mBAAa,WAAW,WAAW,OAAO,EAAE;AAC9C,QAAI,KAAK,SAAS,YAAa,cAAa,WAAW,WAAW,OAAO,GAAG;AAAA,EAC9E;AACA,SAAO,WAAW,QAAQ,OAAO,EAAE;AACrC;AAEO,SAAS,cAAc,OAAe,WAAuC;AAClF,SAAO,uBAAuB,KAAK,eAAe,OAAO,SAAS,CAAC;AACrE;AAEO,SAAS,YAAY,OAAe,WAAkD;AAC3F,QAAM,aAAa,eAAe,OAAO,SAAS;AAClD,MAAI,CAAC,iCAAiC,KAAK,UAAU,EAAG,QAAO;AAC/D,QAAM,SAAS,OAAO,UAAU,KAAK,UAAU,gBAAgB,EAAE,UAAU,YAAY,MAAM;AAC7F,SAAO,OAAO,SAAS,MAAM,IAAI,SAAS;AAC5C;AAEO,SAAS,WACd,OACA,OACA,MACA,KACA,KACQ;AACR,QAAM,YAAY,KAAK,SAAS,EAAE,SAAS,GAAG,IACzC,KAAK,SAAS,EAAE,MAAM,GAAG,EAAE,CAAC,GAAG,UAAU,IAC1C;AACJ,QAAM,OAAO,QAAQ,QAAQ,QAAQ,MAAM,QAAQ,SAAS,CAAC;AAC7D,SAAO,YAAY,MAAM,KAAK,GAAG;AACnC;","names":[]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export { NumberField, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldRoot, } from "./NumberField.js";
|
|
2
|
-
export type { NumberFieldDecrementProps, NumberFieldGroupProps, NumberFieldIncrementProps, NumberFieldInputProps, NumberFieldRootOwnProps, NumberFieldRootProps, } from "./types.js";
|
|
2
|
+
export type { NumberFieldDecrementProps, NumberFieldGroupProps, NumberFieldIncrementProps, NumberFieldInputOwnProps, NumberFieldInputProps, NumberFieldRootOwnProps, NumberFieldRootProps, } from "./types.js";
|
|
3
3
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/number-field/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,gBAAgB,EAChB,oBAAoB,EACpB,gBAAgB,EAChB,eAAe,GAChB,MAAM,kBAAkB,CAAC;AAC1B,YAAY,EACV,yBAAyB,EACzB,qBAAqB,EACrB,yBAAyB,EACzB,qBAAqB,EACrB,uBAAuB,EACvB,oBAAoB,GACrB,MAAM,YAAY,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/number-field/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,oBAAoB,EACpB,gBAAgB,EAChB,oBAAoB,EACpB,gBAAgB,EAChB,eAAe,GAChB,MAAM,kBAAkB,CAAC;AAC1B,YAAY,EACV,yBAAyB,EACzB,qBAAqB,EACrB,yBAAyB,EACzB,wBAAwB,EACxB,qBAAqB,EACrB,uBAAuB,EACvB,oBAAoB,GACrB,MAAM,YAAY,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/number-field/index.ts"],"sourcesContent":["export {\n NumberField,\n NumberFieldDecrement,\n NumberFieldGroup,\n NumberFieldIncrement,\n NumberFieldInput,\n NumberFieldRoot,\n} from \"./NumberField.js\";\nexport type {\n NumberFieldDecrementProps,\n NumberFieldGroupProps,\n NumberFieldIncrementProps,\n NumberFieldInputProps,\n NumberFieldRootOwnProps,\n NumberFieldRootProps,\n} from \"./types.js\";\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/number-field/index.ts"],"sourcesContent":["export {\n NumberField,\n NumberFieldDecrement,\n NumberFieldGroup,\n NumberFieldIncrement,\n NumberFieldInput,\n NumberFieldRoot,\n} from \"./NumberField.js\";\nexport type {\n NumberFieldDecrementProps,\n NumberFieldGroupProps,\n NumberFieldIncrementProps,\n NumberFieldInputOwnProps,\n NumberFieldInputProps,\n NumberFieldRootOwnProps,\n NumberFieldRootProps,\n} from \"./types.js\";\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;","names":[]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type { ElementType, ReactNode, RefObject } from "react";
|
|
1
|
+
import type { ChangeEventHandler, ElementType, FocusEventHandler, KeyboardEventHandler, ReactNode, RefObject } from "react";
|
|
2
2
|
import type { RenderableProps } from "@gunkin/uiify/core/render";
|
|
3
3
|
export interface NumberFieldContextValue {
|
|
4
4
|
readonly clampValueOnBlur: boolean;
|
|
@@ -24,6 +24,8 @@ export interface NumberFieldRootOwnProps {
|
|
|
24
24
|
readonly defaultValue?: number;
|
|
25
25
|
readonly disabled?: boolean;
|
|
26
26
|
readonly formatOptions?: Intl.NumberFormatOptions;
|
|
27
|
+
/** BCP 47 locale used to format and parse the value. Defaults to `"en-US"`. */
|
|
28
|
+
readonly locale?: string;
|
|
27
29
|
readonly max?: number;
|
|
28
30
|
readonly min?: number;
|
|
29
31
|
readonly onValueChange?: (value: number | undefined) => void;
|
|
@@ -32,13 +34,20 @@ export interface NumberFieldRootOwnProps {
|
|
|
32
34
|
readonly step?: number;
|
|
33
35
|
readonly value?: number;
|
|
34
36
|
}
|
|
37
|
+
export interface NumberFieldInputOwnProps {
|
|
38
|
+
readonly id?: string;
|
|
39
|
+
readonly onBlur?: FocusEventHandler<HTMLInputElement>;
|
|
40
|
+
readonly onChange?: ChangeEventHandler<HTMLInputElement>;
|
|
41
|
+
readonly onFocus?: FocusEventHandler<HTMLInputElement>;
|
|
42
|
+
readonly onKeyDown?: KeyboardEventHandler<HTMLInputElement>;
|
|
43
|
+
}
|
|
35
44
|
export type NumberFieldRootProps<TAs extends ElementType = "div"> = RenderableProps<TAs, NumberFieldRootOwnProps, NumberFieldRootOwnProps, HTMLElement>;
|
|
36
45
|
export type NumberFieldGroupProps<TAs extends ElementType = "div"> = RenderableProps<TAs, {
|
|
37
46
|
readonly children?: ReactNode;
|
|
38
47
|
}, {
|
|
39
48
|
disabled: boolean;
|
|
40
49
|
}, HTMLElement>;
|
|
41
|
-
export type NumberFieldInputProps<TAs extends ElementType = "input"> = RenderableProps<TAs,
|
|
50
|
+
export type NumberFieldInputProps<TAs extends ElementType = "input"> = RenderableProps<TAs, NumberFieldInputOwnProps, {
|
|
42
51
|
disabled: boolean;
|
|
43
52
|
readOnly: boolean;
|
|
44
53
|
required: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/number-field/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/number-field/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OtpInput.d.ts","sourceRoot":"","sources":["../../../src/components/otp-input/OtpInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EAOL,KAAK,WAAW,EAEhB,KAAK,YAAY,EAElB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"OtpInput.d.ts","sourceRoot":"","sources":["../../../src/components/otp-input/OtpInput.tsx"],"names":[],"mappings":"AAEA,OAAO,EAOL,KAAK,WAAW,EAEhB,KAAK,YAAY,EAElB,MAAM,OAAO,CAAC;AAOf,OAAO,KAAK,EAGV,iBAAiB,EACjB,iBAAiB,EACjB,wBAAwB,EACzB,MAAM,YAAY,CAAC;AASpB,wBAAgB,YAAY,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAC1D,KAAK,EAAE,iBAAiB,CAAC,GAAG,CAAC,GAC5B,YAAY,GAAG,IAAI,CAwErB;yBA1Ee,YAAY;;;AA6E5B,wBAAgB,YAAY,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAC1D,KAAK,EAAE,iBAAiB,CAAC,GAAG,CAAC,GAC5B,YAAY,GAAG,IAAI,CA4BrB;AAED,wBAAgB,mBAAmB,CAAC,GAAG,SAAS,WAAW,GAAG,OAAO,EACnE,KAAK,EAAE,wBAAwB,CAAC,GAAG,CAAC,GACnC,YAAY,GAAG,IAAI,CAuFrB;AAED,eAAO,MAAM,QAAQ;;;;CAIpB,CAAC"}
|
|
@@ -8,6 +8,7 @@ import {
|
|
|
8
8
|
} from "react";
|
|
9
9
|
import { useControllableState, useId } from "@gunkin/uiify/hooks";
|
|
10
10
|
import { createPartContext } from "@gunkin/uiify/core";
|
|
11
|
+
import { isComposingKeyEvent } from "@gunkin/uiify/core/ime";
|
|
11
12
|
import { composeEventHandlers } from "@gunkin/uiify/core/compose-event-handlers";
|
|
12
13
|
import { useRenderElement } from "@gunkin/uiify/core/render";
|
|
13
14
|
const [OtpInputProvider, useOtpInputContext] = createPartContext("OtpInput");
|
|
@@ -139,6 +140,7 @@ function OtpInputHiddenInput(props) {
|
|
|
139
140
|
updateValue(event.currentTarget.value);
|
|
140
141
|
};
|
|
141
142
|
const handleKeyDown = (event) => {
|
|
143
|
+
if (isComposingKeyEvent(event)) return;
|
|
142
144
|
if (event.key === "Backspace" && value.length > 0) {
|
|
143
145
|
event.preventDefault();
|
|
144
146
|
updateValue(value.slice(0, -1));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/otp-input/OtpInput.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n useCallback,\n useMemo,\n useRef,\n useState,\n type ClipboardEvent,\n type CSSProperties,\n type ElementType,\n type KeyboardEvent,\n type ReactElement,\n type SyntheticEvent,\n} from \"react\";\nimport { useControllableState, useId } from \"@gunkin/uiify/hooks\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport type { PolymorphicProps } from \"@gunkin/uiify/core/render\";\nimport type {\n OtpInputType,\n OtpInputContextValue,\n OtpInputRootProps,\n OtpInputSlotProps,\n OtpInputHiddenInputProps,\n} from \"./types.js\";\n\nconst [OtpInputProvider, useOtpInputContext] = createPartContext<OtpInputContextValue>(\"OtpInput\");\n\nfunction sanitizeValue(raw: string, type: OtpInputType, maxLength: number): string {\n const pattern = type === \"numeric\" ? /\\d/g : /[a-zA-Z0-9]/g;\n return (raw.match(pattern) ?? []).join(\"\").slice(0, maxLength);\n}\n\nexport function OtpInputRoot<TAs extends ElementType = \"div\">(\n props: OtpInputRootProps<TAs>,\n): ReactElement | null {\n const {\n as,\n render,\n length = 6,\n value: controlledValue,\n defaultValue = \"\",\n onValueChange,\n onComplete,\n type = \"numeric\",\n mask = false,\n disabled = false,\n autoFocus = false,\n ...consumerProps\n } = props as OtpInputRootProps<ElementType>;\n\n const hiddenInputRef = useRef<HTMLInputElement>(null);\n const [focused, setFocused] = useState(false);\n const [value, setValue] = useControllableState<string>({\n value: controlledValue,\n defaultValue,\n onChange: onValueChange,\n });\n\n const updateValue = useCallback(\n (nextRaw: string) => {\n const next = sanitizeValue(nextRaw, type, length);\n setValue(next);\n if (next.length === length) onComplete?.(next);\n },\n [length, onComplete, setValue, type],\n );\n\n const { onClick: consumerOnClick } = consumerProps as {\n onClick?: (event: SyntheticEvent<HTMLElement>) => void;\n };\n\n const handleClick = () => hiddenInputRef.current?.focus();\n\n const activeIndex = focused ? Math.min(value.length, length - 1) : -1;\n const contextValue = useMemo<OtpInputContextValue>(\n () => ({\n activeIndex,\n autoFocus,\n disabled,\n hiddenInputRef,\n length,\n mask,\n onHiddenBlur: () => setFocused(false),\n onHiddenFocus: () => setFocused(true),\n type,\n updateValue,\n value,\n }),\n [activeIndex, autoFocus, disabled, length, mask, type, updateValue, value],\n );\n\n const element = useRenderElement({\n as,\n defaultTag: \"div\",\n props: {\n ...consumerProps,\n \"data-uiify-otp-input\": \"\",\n \"data-disabled\": disabled ? \"\" : undefined,\n \"data-complete\": value.length === length ? \"\" : undefined,\n onClick: composeEventHandlers(consumerOnClick, handleClick),\n },\n render,\n state: { disabled, mask, type },\n });\n\n return <OtpInputProvider value={contextValue}>{element}</OtpInputProvider>;\n}\nOtpInputRoot.displayName = \"OtpInputRoot\";\n\nexport function OtpInputSlot<TAs extends ElementType = \"div\">(\n props: OtpInputSlotProps<TAs>,\n): ReactElement | null {\n const { as, render, index, ...consumerProps } = props as OtpInputSlotProps<ElementType>;\n const { activeIndex, disabled, length, mask, value } = useOtpInputContext(\"Slot\");\n\n if (index < 0 || index >= length) {\n throw new Error(`OtpInput.Slot index ${index} is out of range for length ${length}`);\n }\n\n const char = value[index] ?? \"\";\n const active = activeIndex === index;\n const filled = char !== \"\";\n\n return useRenderElement({\n as,\n defaultTag: \"div\",\n props: {\n ...consumerProps,\n \"aria-hidden\": true,\n \"data-part\": \"slot\",\n \"data-active\": active ? \"\" : undefined,\n \"data-disabled\": disabled ? \"\" : undefined,\n \"data-filled\": filled ? \"\" : undefined,\n \"data-index\": index,\n children: mask && filled ? \"•\" : char,\n },\n render,\n state: { active, filled },\n });\n}\n\nexport function OtpInputHiddenInput<TAs extends ElementType = \"input\">(\n props: OtpInputHiddenInputProps<TAs>,\n): ReactElement | null {\n const {\n as,\n render,\n autoFocus: autoFocusProp,\n style: consumerStyle,\n ...consumerProps\n } = props as PolymorphicProps<\"input\", { readonly autoFocus?: boolean }>;\n\n const {\n autoFocus: rootAutoFocus,\n disabled,\n hiddenInputRef,\n length,\n mask,\n onHiddenBlur,\n onHiddenFocus,\n type,\n updateValue,\n value,\n } = useOtpInputContext(\"HiddenInput\");\n const inputId = useId();\n const autoFocus = autoFocusProp ?? rootAutoFocus;\n const {\n onBlur: consumerOnBlur,\n onChange: consumerOnChange,\n onFocus: consumerOnFocus,\n onKeyDown: consumerOnKeyDown,\n onPaste: consumerOnPaste,\n } = consumerProps as {\n onBlur?: (event: SyntheticEvent<HTMLInputElement>) => void;\n onChange?: (event: SyntheticEvent<HTMLInputElement>) => void;\n onFocus?: (event: SyntheticEvent<HTMLInputElement>) => void;\n onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;\n onPaste?: (event: ClipboardEvent<HTMLInputElement>) => void;\n };\n\n const handleChange = (event: SyntheticEvent<HTMLInputElement>) => {\n updateValue(event.currentTarget.value);\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"Backspace\" && value.length > 0) {\n event.preventDefault();\n updateValue(value.slice(0, -1));\n }\n };\n\n const handlePaste = (event: ClipboardEvent<HTMLInputElement>) => {\n event.preventDefault();\n updateValue(event.clipboardData.getData(\"text\"));\n };\n\n return useRenderElement({\n as,\n defaultTag: \"input\",\n props: {\n ...consumerProps,\n \"data-part\": \"control\",\n id: inputId,\n ref: hiddenInputRef,\n type: mask ? \"password\" : \"text\",\n inputMode: type === \"numeric\" ? \"numeric\" : \"text\",\n autoComplete: \"one-time-code\",\n autoFocus: autoFocus || undefined,\n disabled: disabled || undefined,\n \"aria-label\": \"One-time code\",\n value,\n maxLength: length,\n onChange: composeEventHandlers(consumerOnChange, handleChange),\n onFocus: composeEventHandlers(consumerOnFocus, onHiddenFocus),\n onBlur: composeEventHandlers(consumerOnBlur, onHiddenBlur),\n onKeyDown: composeEventHandlers(consumerOnKeyDown, handleKeyDown),\n onPaste: composeEventHandlers(consumerOnPaste, handlePaste),\n style: {\n ...consumerStyle,\n position: \"absolute\",\n opacity: 0,\n pointerEvents: \"none\",\n width: 1,\n height: 1,\n } as CSSProperties,\n },\n render,\n state: { disabled },\n });\n}\n\nexport const OtpInput = {\n Root: OtpInputRoot,\n Slot: OtpInputSlot,\n HiddenInput: OtpInputHiddenInput,\n};\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/otp-input/OtpInput.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n useCallback,\n useMemo,\n useRef,\n useState,\n type ClipboardEvent,\n type CSSProperties,\n type ElementType,\n type KeyboardEvent,\n type ReactElement,\n type SyntheticEvent,\n} from \"react\";\nimport { useControllableState, useId } from \"@gunkin/uiify/hooks\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport { isComposingKeyEvent } from \"@gunkin/uiify/core/ime\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport type { PolymorphicProps } from \"@gunkin/uiify/core/render\";\nimport type {\n OtpInputType,\n OtpInputContextValue,\n OtpInputRootProps,\n OtpInputSlotProps,\n OtpInputHiddenInputProps,\n} from \"./types.js\";\n\nconst [OtpInputProvider, useOtpInputContext] = createPartContext<OtpInputContextValue>(\"OtpInput\");\n\nfunction sanitizeValue(raw: string, type: OtpInputType, maxLength: number): string {\n const pattern = type === \"numeric\" ? /\\d/g : /[a-zA-Z0-9]/g;\n return (raw.match(pattern) ?? []).join(\"\").slice(0, maxLength);\n}\n\nexport function OtpInputRoot<TAs extends ElementType = \"div\">(\n props: OtpInputRootProps<TAs>,\n): ReactElement | null {\n const {\n as,\n render,\n length = 6,\n value: controlledValue,\n defaultValue = \"\",\n onValueChange,\n onComplete,\n type = \"numeric\",\n mask = false,\n disabled = false,\n autoFocus = false,\n ...consumerProps\n } = props as OtpInputRootProps<ElementType>;\n\n const hiddenInputRef = useRef<HTMLInputElement>(null);\n const [focused, setFocused] = useState(false);\n const [value, setValue] = useControllableState<string>({\n value: controlledValue,\n defaultValue,\n onChange: onValueChange,\n });\n\n const updateValue = useCallback(\n (nextRaw: string) => {\n const next = sanitizeValue(nextRaw, type, length);\n setValue(next);\n if (next.length === length) onComplete?.(next);\n },\n [length, onComplete, setValue, type],\n );\n\n const { onClick: consumerOnClick } = consumerProps as {\n onClick?: (event: SyntheticEvent<HTMLElement>) => void;\n };\n\n const handleClick = () => hiddenInputRef.current?.focus();\n\n const activeIndex = focused ? Math.min(value.length, length - 1) : -1;\n const contextValue = useMemo<OtpInputContextValue>(\n () => ({\n activeIndex,\n autoFocus,\n disabled,\n hiddenInputRef,\n length,\n mask,\n onHiddenBlur: () => setFocused(false),\n onHiddenFocus: () => setFocused(true),\n type,\n updateValue,\n value,\n }),\n [activeIndex, autoFocus, disabled, length, mask, type, updateValue, value],\n );\n\n const element = useRenderElement({\n as,\n defaultTag: \"div\",\n props: {\n ...consumerProps,\n \"data-uiify-otp-input\": \"\",\n \"data-disabled\": disabled ? \"\" : undefined,\n \"data-complete\": value.length === length ? \"\" : undefined,\n onClick: composeEventHandlers(consumerOnClick, handleClick),\n },\n render,\n state: { disabled, mask, type },\n });\n\n return <OtpInputProvider value={contextValue}>{element}</OtpInputProvider>;\n}\nOtpInputRoot.displayName = \"OtpInputRoot\";\n\nexport function OtpInputSlot<TAs extends ElementType = \"div\">(\n props: OtpInputSlotProps<TAs>,\n): ReactElement | null {\n const { as, render, index, ...consumerProps } = props as OtpInputSlotProps<ElementType>;\n const { activeIndex, disabled, length, mask, value } = useOtpInputContext(\"Slot\");\n\n if (index < 0 || index >= length) {\n throw new Error(`OtpInput.Slot index ${index} is out of range for length ${length}`);\n }\n\n const char = value[index] ?? \"\";\n const active = activeIndex === index;\n const filled = char !== \"\";\n\n return useRenderElement({\n as,\n defaultTag: \"div\",\n props: {\n ...consumerProps,\n \"aria-hidden\": true,\n \"data-part\": \"slot\",\n \"data-active\": active ? \"\" : undefined,\n \"data-disabled\": disabled ? \"\" : undefined,\n \"data-filled\": filled ? \"\" : undefined,\n \"data-index\": index,\n children: mask && filled ? \"•\" : char,\n },\n render,\n state: { active, filled },\n });\n}\n\nexport function OtpInputHiddenInput<TAs extends ElementType = \"input\">(\n props: OtpInputHiddenInputProps<TAs>,\n): ReactElement | null {\n const {\n as,\n render,\n autoFocus: autoFocusProp,\n style: consumerStyle,\n ...consumerProps\n } = props as PolymorphicProps<\"input\", { readonly autoFocus?: boolean }>;\n\n const {\n autoFocus: rootAutoFocus,\n disabled,\n hiddenInputRef,\n length,\n mask,\n onHiddenBlur,\n onHiddenFocus,\n type,\n updateValue,\n value,\n } = useOtpInputContext(\"HiddenInput\");\n const inputId = useId();\n const autoFocus = autoFocusProp ?? rootAutoFocus;\n const {\n onBlur: consumerOnBlur,\n onChange: consumerOnChange,\n onFocus: consumerOnFocus,\n onKeyDown: consumerOnKeyDown,\n onPaste: consumerOnPaste,\n } = consumerProps as {\n onBlur?: (event: SyntheticEvent<HTMLInputElement>) => void;\n onChange?: (event: SyntheticEvent<HTMLInputElement>) => void;\n onFocus?: (event: SyntheticEvent<HTMLInputElement>) => void;\n onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;\n onPaste?: (event: ClipboardEvent<HTMLInputElement>) => void;\n };\n\n const handleChange = (event: SyntheticEvent<HTMLInputElement>) => {\n updateValue(event.currentTarget.value);\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\n if (isComposingKeyEvent(event)) return;\n if (event.key === \"Backspace\" && value.length > 0) {\n event.preventDefault();\n updateValue(value.slice(0, -1));\n }\n };\n\n const handlePaste = (event: ClipboardEvent<HTMLInputElement>) => {\n event.preventDefault();\n updateValue(event.clipboardData.getData(\"text\"));\n };\n\n return useRenderElement({\n as,\n defaultTag: \"input\",\n props: {\n ...consumerProps,\n \"data-part\": \"control\",\n id: inputId,\n ref: hiddenInputRef,\n type: mask ? \"password\" : \"text\",\n inputMode: type === \"numeric\" ? \"numeric\" : \"text\",\n autoComplete: \"one-time-code\",\n autoFocus: autoFocus || undefined,\n disabled: disabled || undefined,\n \"aria-label\": \"One-time code\",\n value,\n maxLength: length,\n onChange: composeEventHandlers(consumerOnChange, handleChange),\n onFocus: composeEventHandlers(consumerOnFocus, onHiddenFocus),\n onBlur: composeEventHandlers(consumerOnBlur, onHiddenBlur),\n onKeyDown: composeEventHandlers(consumerOnKeyDown, handleKeyDown),\n onPaste: composeEventHandlers(consumerOnPaste, handlePaste),\n style: {\n ...consumerStyle,\n position: \"absolute\",\n opacity: 0,\n pointerEvents: \"none\",\n width: 1,\n height: 1,\n } as CSSProperties,\n },\n render,\n state: { disabled },\n });\n}\n\nexport const OtpInput = {\n Root: OtpInputRoot,\n Slot: OtpInputSlot,\n HiddenInput: OtpInputHiddenInput,\n};\n"],"mappings":"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","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/pagination/Pagination.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAc,YAAY,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/pagination/Pagination.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAc,YAAY,EAAE,MAAM,OAAO,CAAC;AAKnE,OAAO,EACL,kBAAkB,IAAI,yBAAyB,EAE/C,kBAAkB,EAEnB,MAAM,sBAAsB,CAAC;AAE9B,OAAO,KAAK,EAGV,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,YAAY,CAAC;AAEpB,YAAY,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAEjD,OAAO,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAK9E,wBAAgB,cAAc,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAC5D,KAAK,EAAE,mBAAmB,CAAC,GAAG,CAAC,GAC9B,YAAY,GAAG,IAAI,CAiErB;yBAnEe,cAAc;;;AA2H9B,wBAAgB,cAAc,IAAI,YAAY,GAAG,IAAI,CAepD;yBAfe,cAAc;;;AAkB9B,wBAAgB,cAAc,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EAC/D,KAAK,EAAE,mBAAmB,CAAC,GAAG,CAAC,GAC9B,YAAY,GAAG,IAAI,CAsCrB;AAkHD,eAAO,MAAM,UAAU;;;;;;CAMtB,CAAC"}
|
|
@@ -3,9 +3,11 @@ import { Fragment, jsx } from "react/jsx-runtime";
|
|
|
3
3
|
import { useMemo } from "react";
|
|
4
4
|
import { createPartContext } from "@gunkin/uiify/core";
|
|
5
5
|
import { composeEventHandlers } from "@gunkin/uiify/core/compose-event-handlers";
|
|
6
|
+
import { formatLabel } from "@gunkin/uiify/core/format-label";
|
|
6
7
|
import { useRenderElement } from "@gunkin/uiify/core/render";
|
|
7
8
|
import {
|
|
8
9
|
PaginationEllipsis as PaginationEllipsisElement,
|
|
10
|
+
DEFAULT_PAGINATION_LABELS,
|
|
9
11
|
PaginationItemPart,
|
|
10
12
|
PaginationList as PaginationListElement
|
|
11
13
|
} from "./PaginationShell.js";
|
|
@@ -16,18 +18,21 @@ function PaginationRoot(props) {
|
|
|
16
18
|
const {
|
|
17
19
|
as,
|
|
18
20
|
render,
|
|
19
|
-
"aria-label": ariaLabel
|
|
21
|
+
"aria-label": ariaLabel,
|
|
20
22
|
boundaryCount,
|
|
21
23
|
count,
|
|
22
24
|
defaultPage,
|
|
23
25
|
disabled,
|
|
24
26
|
onPageChange,
|
|
25
27
|
page,
|
|
28
|
+
labels,
|
|
29
|
+
locale,
|
|
26
30
|
showFirstLast,
|
|
27
31
|
siblingCount,
|
|
28
32
|
children,
|
|
29
33
|
...consumerProps
|
|
30
34
|
} = props;
|
|
35
|
+
const mergedLabels = { ...DEFAULT_PAGINATION_LABELS, ...labels };
|
|
31
36
|
const {
|
|
32
37
|
items,
|
|
33
38
|
page: currentPage,
|
|
@@ -43,15 +48,22 @@ function PaginationRoot(props) {
|
|
|
43
48
|
...siblingCount !== void 0 ? { siblingCount } : {}
|
|
44
49
|
});
|
|
45
50
|
const contextValue = useMemo(
|
|
46
|
-
() => ({
|
|
47
|
-
|
|
51
|
+
() => ({
|
|
52
|
+
count,
|
|
53
|
+
items,
|
|
54
|
+
labels: mergedLabels,
|
|
55
|
+
...locale !== void 0 ? { locale } : {},
|
|
56
|
+
page: currentPage,
|
|
57
|
+
setPage
|
|
58
|
+
}),
|
|
59
|
+
[count, currentPage, items, labels, locale, setPage]
|
|
48
60
|
);
|
|
49
61
|
const element = useRenderElement({
|
|
50
62
|
as,
|
|
51
63
|
defaultTag: "nav",
|
|
52
64
|
props: {
|
|
53
65
|
...consumerProps,
|
|
54
|
-
"aria-label": ariaLabel,
|
|
66
|
+
"aria-label": ariaLabel ?? mergedLabels.root,
|
|
55
67
|
children: children ?? /* @__PURE__ */ jsx("ol", { children: /* @__PURE__ */ jsx(PaginationListItems, {}) }),
|
|
56
68
|
"data-uiify-pagination": ""
|
|
57
69
|
},
|
|
@@ -62,30 +74,59 @@ function PaginationRoot(props) {
|
|
|
62
74
|
}
|
|
63
75
|
PaginationRoot.displayName = "PaginationRoot";
|
|
64
76
|
function PaginationListItems() {
|
|
65
|
-
const { items } = usePaginationContext("List");
|
|
66
|
-
return /* @__PURE__ */ jsx(Fragment, { children: items.map((item, index) => /* @__PURE__ */ jsx(
|
|
77
|
+
const { items, labels, locale } = usePaginationContext("List");
|
|
78
|
+
return /* @__PURE__ */ jsx(Fragment, { children: items.map((item, index) => /* @__PURE__ */ jsx(
|
|
79
|
+
PaginationItemRenderer,
|
|
80
|
+
{
|
|
81
|
+
item,
|
|
82
|
+
labels,
|
|
83
|
+
...locale !== void 0 ? { locale } : {}
|
|
84
|
+
},
|
|
85
|
+
`${item.type}-${item.page ?? index}`
|
|
86
|
+
)) });
|
|
67
87
|
}
|
|
68
88
|
PaginationListItems.displayName = "PaginationListItems";
|
|
69
|
-
function PaginationItemRenderer({
|
|
89
|
+
function PaginationItemRenderer({
|
|
90
|
+
item,
|
|
91
|
+
labels,
|
|
92
|
+
locale
|
|
93
|
+
}) {
|
|
70
94
|
switch (item.type) {
|
|
71
95
|
case "ellipsis":
|
|
72
96
|
return /* @__PURE__ */ jsx(PaginationEllipsisElement, {});
|
|
73
97
|
case "previous":
|
|
74
|
-
return /* @__PURE__ */ jsx(PaginationPrevious, { disabled: item.disabled });
|
|
98
|
+
return /* @__PURE__ */ jsx(PaginationPrevious, { disabled: item.disabled, labels });
|
|
75
99
|
case "next":
|
|
76
|
-
return /* @__PURE__ */ jsx(PaginationNext, { disabled: item.disabled });
|
|
100
|
+
return /* @__PURE__ */ jsx(PaginationNext, { disabled: item.disabled, labels });
|
|
77
101
|
case "first":
|
|
78
|
-
return /* @__PURE__ */ jsx(PaginationFirst, { disabled: item.disabled });
|
|
102
|
+
return /* @__PURE__ */ jsx(PaginationFirst, { disabled: item.disabled, labels });
|
|
79
103
|
case "last":
|
|
80
|
-
return /* @__PURE__ */ jsx(PaginationLast, { disabled: item.disabled });
|
|
104
|
+
return /* @__PURE__ */ jsx(PaginationLast, { disabled: item.disabled, labels });
|
|
81
105
|
default:
|
|
82
|
-
return /* @__PURE__ */ jsx(PaginationItemPart, { children: /* @__PURE__ */ jsx(
|
|
106
|
+
return /* @__PURE__ */ jsx(PaginationItemPart, { children: /* @__PURE__ */ jsx(
|
|
107
|
+
PaginationLink,
|
|
108
|
+
{
|
|
109
|
+
disabled: item.disabled,
|
|
110
|
+
...locale !== void 0 ? { locale } : {},
|
|
111
|
+
pageLabelTemplate: labels.page,
|
|
112
|
+
page: item.page ?? 1,
|
|
113
|
+
selected: item.selected
|
|
114
|
+
}
|
|
115
|
+
) });
|
|
83
116
|
}
|
|
84
117
|
}
|
|
85
118
|
PaginationItemRenderer.displayName = "PaginationItemRenderer";
|
|
86
119
|
function PaginationList() {
|
|
87
|
-
const { items } = usePaginationContext("List");
|
|
88
|
-
return /* @__PURE__ */ jsx(PaginationListElement, { children: items.map((item, index) => /* @__PURE__ */ jsx(
|
|
120
|
+
const { items, labels, locale } = usePaginationContext("List");
|
|
121
|
+
return /* @__PURE__ */ jsx(PaginationListElement, { children: items.map((item, index) => /* @__PURE__ */ jsx(
|
|
122
|
+
PaginationItemRenderer,
|
|
123
|
+
{
|
|
124
|
+
item,
|
|
125
|
+
labels,
|
|
126
|
+
...locale !== void 0 ? { locale } : {}
|
|
127
|
+
},
|
|
128
|
+
`${item.type}-${item.page ?? index}`
|
|
129
|
+
)) });
|
|
89
130
|
}
|
|
90
131
|
PaginationList.displayName = "PaginationList";
|
|
91
132
|
function PaginationLink(props) {
|
|
@@ -93,11 +134,16 @@ function PaginationLink(props) {
|
|
|
93
134
|
as,
|
|
94
135
|
render,
|
|
95
136
|
disabled = false,
|
|
137
|
+
locale,
|
|
138
|
+
pageLabelTemplate,
|
|
96
139
|
page,
|
|
97
140
|
selected = false,
|
|
98
141
|
...consumerProps
|
|
99
142
|
} = props;
|
|
100
|
-
const
|
|
143
|
+
const context = usePaginationContext("Link");
|
|
144
|
+
const { setPage } = context;
|
|
145
|
+
const activeLocale = locale ?? context.locale;
|
|
146
|
+
const activePageLabelTemplate = pageLabelTemplate ?? context.labels.page;
|
|
101
147
|
const onClick = consumerProps.onClick;
|
|
102
148
|
return useRenderElement({
|
|
103
149
|
as,
|
|
@@ -105,7 +151,7 @@ function PaginationLink(props) {
|
|
|
105
151
|
props: {
|
|
106
152
|
...consumerProps,
|
|
107
153
|
"aria-current": selected ? "page" : void 0,
|
|
108
|
-
"aria-label":
|
|
154
|
+
"aria-label": formatPageLabel(activePageLabelTemplate, page, activeLocale),
|
|
109
155
|
"data-selected": selected ? "" : void 0,
|
|
110
156
|
"data-size": "icon",
|
|
111
157
|
"data-type": "page",
|
|
@@ -114,80 +160,98 @@ function PaginationLink(props) {
|
|
|
114
160
|
disabled: disabled || void 0,
|
|
115
161
|
onClick: composeEventHandlers(onClick, () => setPage(page)),
|
|
116
162
|
type: "button",
|
|
117
|
-
children: page
|
|
163
|
+
children: formatPageNumber(page, activeLocale)
|
|
118
164
|
},
|
|
119
165
|
render,
|
|
120
166
|
state: { selected }
|
|
121
167
|
});
|
|
122
168
|
}
|
|
123
|
-
function PaginationPrevious({
|
|
169
|
+
function PaginationPrevious({
|
|
170
|
+
disabled,
|
|
171
|
+
labels
|
|
172
|
+
}) {
|
|
124
173
|
const { page, setPage } = usePaginationContext("Previous");
|
|
125
174
|
return /* @__PURE__ */ jsx(PaginationItemPart, { children: /* @__PURE__ */ jsx(
|
|
126
175
|
"button",
|
|
127
176
|
{
|
|
128
|
-
"aria-label":
|
|
177
|
+
"aria-label": labels.previous,
|
|
129
178
|
"data-type": "previous",
|
|
130
179
|
"data-uiify-button": "",
|
|
131
180
|
"data-variant": "ghost",
|
|
132
181
|
disabled,
|
|
133
182
|
onClick: () => setPage(page - 1),
|
|
134
183
|
type: "button",
|
|
135
|
-
children:
|
|
184
|
+
children: labels.previousText
|
|
136
185
|
}
|
|
137
186
|
) });
|
|
138
187
|
}
|
|
139
188
|
PaginationPrevious.displayName = "PaginationPrevious";
|
|
140
|
-
function PaginationNext({
|
|
189
|
+
function PaginationNext({
|
|
190
|
+
disabled,
|
|
191
|
+
labels
|
|
192
|
+
}) {
|
|
141
193
|
const { page, setPage } = usePaginationContext("Next");
|
|
142
194
|
return /* @__PURE__ */ jsx(PaginationItemPart, { children: /* @__PURE__ */ jsx(
|
|
143
195
|
"button",
|
|
144
196
|
{
|
|
145
|
-
"aria-label":
|
|
197
|
+
"aria-label": labels.next,
|
|
146
198
|
"data-type": "next",
|
|
147
199
|
"data-uiify-button": "",
|
|
148
200
|
"data-variant": "ghost",
|
|
149
201
|
disabled,
|
|
150
202
|
onClick: () => setPage(page + 1),
|
|
151
203
|
type: "button",
|
|
152
|
-
children:
|
|
204
|
+
children: labels.nextText
|
|
153
205
|
}
|
|
154
206
|
) });
|
|
155
207
|
}
|
|
156
208
|
PaginationNext.displayName = "PaginationNext";
|
|
157
|
-
function PaginationFirst({
|
|
209
|
+
function PaginationFirst({
|
|
210
|
+
disabled,
|
|
211
|
+
labels
|
|
212
|
+
}) {
|
|
158
213
|
const { setPage } = usePaginationContext("First");
|
|
159
214
|
return /* @__PURE__ */ jsx(PaginationItemPart, { children: /* @__PURE__ */ jsx(
|
|
160
215
|
"button",
|
|
161
216
|
{
|
|
162
|
-
"aria-label":
|
|
217
|
+
"aria-label": labels.first,
|
|
163
218
|
"data-type": "first",
|
|
164
219
|
"data-uiify-button": "",
|
|
165
220
|
"data-variant": "ghost",
|
|
166
221
|
disabled,
|
|
167
222
|
onClick: () => setPage(1),
|
|
168
223
|
type: "button",
|
|
169
|
-
children:
|
|
224
|
+
children: labels.firstText
|
|
170
225
|
}
|
|
171
226
|
) });
|
|
172
227
|
}
|
|
173
228
|
PaginationFirst.displayName = "PaginationFirst";
|
|
174
|
-
function PaginationLast({
|
|
229
|
+
function PaginationLast({
|
|
230
|
+
disabled,
|
|
231
|
+
labels
|
|
232
|
+
}) {
|
|
175
233
|
const { count, setPage } = usePaginationContext("Last");
|
|
176
234
|
return /* @__PURE__ */ jsx(PaginationItemPart, { children: /* @__PURE__ */ jsx(
|
|
177
235
|
"button",
|
|
178
236
|
{
|
|
179
|
-
"aria-label":
|
|
237
|
+
"aria-label": labels.last,
|
|
180
238
|
"data-type": "last",
|
|
181
239
|
"data-uiify-button": "",
|
|
182
240
|
"data-variant": "ghost",
|
|
183
241
|
disabled,
|
|
184
242
|
onClick: () => setPage(count),
|
|
185
243
|
type: "button",
|
|
186
|
-
children:
|
|
244
|
+
children: labels.lastText
|
|
187
245
|
}
|
|
188
246
|
) });
|
|
189
247
|
}
|
|
190
248
|
PaginationLast.displayName = "PaginationLast";
|
|
249
|
+
function formatPageNumber(page, locale) {
|
|
250
|
+
return locale ? new Intl.NumberFormat(locale).format(page) : String(page);
|
|
251
|
+
}
|
|
252
|
+
function formatPageLabel(template, page, locale) {
|
|
253
|
+
return formatLabel(template, { page: locale === void 0 ? String(page) : page }, locale);
|
|
254
|
+
}
|
|
191
255
|
const Pagination = {
|
|
192
256
|
Ellipsis: PaginationEllipsisElement,
|
|
193
257
|
Item: PaginationItemPart,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/pagination/Pagination.tsx"],"sourcesContent":["\"use client\";\n\nimport { useMemo } from \"react\";\nimport type { ElementType, MouseEvent, ReactElement } from \"react\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport {\n PaginationEllipsis as PaginationEllipsisElement,\n PaginationItemPart,\n PaginationList as PaginationListElement,\n} from \"./PaginationShell.js\";\nimport { usePagination } from \"./use-pagination.js\";\nimport type {\n PaginationContextValue,\n PaginationItem,\n PaginationLinkProps,\n PaginationRootProps,\n} from \"./types.js\";\n\nexport type { PaginationItem } from \"./types.js\";\n\nexport { PaginationEllipsis, PaginationItemPart } from \"./PaginationShell.js\";\n\nconst [PaginationProvider, usePaginationContext] =\n createPartContext<PaginationContextValue>(\"Pagination\");\n\nexport function PaginationRoot<TAs extends ElementType = \"nav\">(\n props: PaginationRootProps<TAs>,\n): ReactElement | null {\n const {\n as,\n render,\n \"aria-label\": ariaLabel = \"Pagination\",\n boundaryCount,\n count,\n defaultPage,\n disabled,\n onPageChange,\n page,\n showFirstLast,\n siblingCount,\n children,\n ...consumerProps\n } = props as PaginationRootProps<\"nav\">;\n\n const {\n items,\n page: currentPage,\n setPage,\n } = usePagination({\n count,\n ...(boundaryCount !== undefined ? { boundaryCount } : {}),\n ...(defaultPage !== undefined ? { defaultPage } : {}),\n ...(disabled !== undefined ? { disabled } : {}),\n ...(onPageChange !== undefined ? { onPageChange } : {}),\n ...(page !== undefined ? { page } : {}),\n ...(showFirstLast !== undefined ? { showFirstLast } : {}),\n ...(siblingCount !== undefined ? { siblingCount } : {}),\n });\n\n const contextValue = useMemo(\n () => ({ count, items, page: currentPage, setPage }),\n [count, currentPage, items, setPage],\n );\n\n const element = useRenderElement({\n as,\n defaultTag: \"nav\",\n props: {\n ...consumerProps,\n \"aria-label\": ariaLabel,\n children: children ?? (\n <ol>\n <PaginationListItems />\n </ol>\n ),\n \"data-uiify-pagination\": \"\",\n },\n render,\n state: { page: currentPage },\n });\n\n return <PaginationProvider value={contextValue}>{element}</PaginationProvider>;\n}\nPaginationRoot.displayName = \"PaginationRoot\";\n\nfunction PaginationListItems(): ReactElement {\n const { items } = usePaginationContext(\"List\");\n return (\n <>\n {items.map((item, index) => (\n <PaginationItemRenderer item={item} key={`${item.type}-${item.page ?? index}`} />\n ))}\n </>\n );\n}\nPaginationListItems.displayName = \"PaginationListItems\";\n\nfunction PaginationItemRenderer({ item }: { readonly item: PaginationItem }): ReactElement {\n switch (item.type) {\n case \"ellipsis\":\n return <PaginationEllipsisElement />;\n case \"previous\":\n return <PaginationPrevious disabled={item.disabled} />;\n case \"next\":\n return <PaginationNext disabled={item.disabled} />;\n case \"first\":\n return <PaginationFirst disabled={item.disabled} />;\n case \"last\":\n return <PaginationLast disabled={item.disabled} />;\n default:\n return (\n <PaginationItemPart>\n <PaginationLink disabled={item.disabled} page={item.page ?? 1} selected={item.selected} />\n </PaginationItemPart>\n );\n }\n}\nPaginationItemRenderer.displayName = \"PaginationItemRenderer\";\n\nexport function PaginationList(): ReactElement | null {\n const { items } = usePaginationContext(\"List\");\n\n return (\n <PaginationListElement>\n {items.map((item, index) => (\n <PaginationItemRenderer item={item} key={`${item.type}-${item.page ?? index}`} />\n ))}\n </PaginationListElement>\n );\n}\nPaginationList.displayName = \"PaginationList\";\n\nexport function PaginationLink<TAs extends ElementType = \"button\">(\n props: PaginationLinkProps<TAs>,\n): ReactElement | null {\n const {\n as,\n render,\n disabled = false,\n page,\n selected = false,\n ...consumerProps\n } = props as PaginationLinkProps<\"button\">;\n const { setPage } = usePaginationContext(\"Link\");\n const onClick = (consumerProps as { onClick?: (event: MouseEvent<HTMLButtonElement>) => void })\n .onClick;\n\n return useRenderElement({\n as,\n defaultTag: \"button\",\n props: {\n ...consumerProps,\n \"aria-current\": selected ? \"page\" : undefined,\n \"aria-label\": `Page ${page}`,\n \"data-selected\": selected ? \"\" : undefined,\n \"data-size\": \"icon\",\n \"data-type\": \"page\",\n \"data-uiify-button\": \"\",\n \"data-variant\": \"ghost\",\n disabled: disabled || undefined,\n onClick: composeEventHandlers(onClick, () => setPage(page)),\n type: \"button\",\n children: page,\n },\n render,\n state: { selected },\n });\n}\n\nfunction PaginationPrevious({ disabled }: { readonly disabled: boolean }): ReactElement {\n const { page, setPage } = usePaginationContext(\"Previous\");\n return (\n <PaginationItemPart>\n <button\n aria-label=\"Previous page\"\n data-type=\"previous\"\n data-uiify-button=\"\"\n data-variant=\"ghost\"\n disabled={disabled}\n onClick={() => setPage(page - 1)}\n type=\"button\"\n >\n Previous\n </button>\n </PaginationItemPart>\n );\n}\nPaginationPrevious.displayName = \"PaginationPrevious\";\n\nfunction PaginationNext({ disabled }: { readonly disabled: boolean }): ReactElement {\n const { page, setPage } = usePaginationContext(\"Next\");\n return (\n <PaginationItemPart>\n <button\n aria-label=\"Next page\"\n data-type=\"next\"\n data-uiify-button=\"\"\n data-variant=\"ghost\"\n disabled={disabled}\n onClick={() => setPage(page + 1)}\n type=\"button\"\n >\n Next\n </button>\n </PaginationItemPart>\n );\n}\nPaginationNext.displayName = \"PaginationNext\";\n\nfunction PaginationFirst({ disabled }: { readonly disabled: boolean }): ReactElement {\n const { setPage } = usePaginationContext(\"First\");\n return (\n <PaginationItemPart>\n <button\n aria-label=\"First page\"\n data-type=\"first\"\n data-uiify-button=\"\"\n data-variant=\"ghost\"\n disabled={disabled}\n onClick={() => setPage(1)}\n type=\"button\"\n >\n First\n </button>\n </PaginationItemPart>\n );\n}\nPaginationFirst.displayName = \"PaginationFirst\";\n\nfunction PaginationLast({ disabled }: { readonly disabled: boolean }): ReactElement {\n const { count, setPage } = usePaginationContext(\"Last\");\n return (\n <PaginationItemPart>\n <button\n aria-label=\"Last page\"\n data-type=\"last\"\n data-uiify-button=\"\"\n data-variant=\"ghost\"\n disabled={disabled}\n onClick={() => setPage(count)}\n type=\"button\"\n >\n Last\n </button>\n </PaginationItemPart>\n );\n}\nPaginationLast.displayName = \"PaginationLast\";\n\nexport const Pagination = {\n Ellipsis: PaginationEllipsisElement,\n Item: PaginationItemPart,\n Link: PaginationLink,\n List: PaginationList,\n Root: PaginationRoot,\n};\n"],"mappings":"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","names":["PaginationItemPart"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/pagination/Pagination.tsx"],"sourcesContent":["\"use client\";\n\nimport { useMemo } from \"react\";\nimport type { ElementType, MouseEvent, ReactElement } from \"react\";\nimport { createPartContext } from \"@gunkin/uiify/core\";\nimport { composeEventHandlers } from \"@gunkin/uiify/core/compose-event-handlers\";\nimport { formatLabel } from \"@gunkin/uiify/core/format-label\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport {\n PaginationEllipsis as PaginationEllipsisElement,\n DEFAULT_PAGINATION_LABELS,\n PaginationItemPart,\n PaginationList as PaginationListElement,\n} from \"./PaginationShell.js\";\nimport { usePagination } from \"./use-pagination.js\";\nimport type {\n PaginationContextValue,\n PaginationItem,\n PaginationLinkProps,\n PaginationRootProps,\n} from \"./types.js\";\n\nexport type { PaginationItem } from \"./types.js\";\n\nexport { PaginationEllipsis, PaginationItemPart } from \"./PaginationShell.js\";\n\nconst [PaginationProvider, usePaginationContext] =\n createPartContext<PaginationContextValue>(\"Pagination\");\n\nexport function PaginationRoot<TAs extends ElementType = \"nav\">(\n props: PaginationRootProps<TAs>,\n): ReactElement | null {\n const {\n as,\n render,\n \"aria-label\": ariaLabel,\n boundaryCount,\n count,\n defaultPage,\n disabled,\n onPageChange,\n page,\n labels,\n locale,\n showFirstLast,\n siblingCount,\n children,\n ...consumerProps\n } = props as PaginationRootProps<\"nav\">;\n const mergedLabels = { ...DEFAULT_PAGINATION_LABELS, ...labels };\n\n const {\n items,\n page: currentPage,\n setPage,\n } = usePagination({\n count,\n ...(boundaryCount !== undefined ? { boundaryCount } : {}),\n ...(defaultPage !== undefined ? { defaultPage } : {}),\n ...(disabled !== undefined ? { disabled } : {}),\n ...(onPageChange !== undefined ? { onPageChange } : {}),\n ...(page !== undefined ? { page } : {}),\n ...(showFirstLast !== undefined ? { showFirstLast } : {}),\n ...(siblingCount !== undefined ? { siblingCount } : {}),\n });\n\n const contextValue = useMemo(\n () => ({\n count,\n items,\n labels: mergedLabels,\n ...(locale !== undefined ? { locale } : {}),\n page: currentPage,\n setPage,\n }),\n [count, currentPage, items, labels, locale, setPage],\n );\n\n const element = useRenderElement({\n as,\n defaultTag: \"nav\",\n props: {\n ...consumerProps,\n \"aria-label\": ariaLabel ?? mergedLabels.root,\n children: children ?? (\n <ol>\n <PaginationListItems />\n </ol>\n ),\n \"data-uiify-pagination\": \"\",\n },\n render,\n state: { page: currentPage },\n });\n\n return <PaginationProvider value={contextValue}>{element}</PaginationProvider>;\n}\nPaginationRoot.displayName = \"PaginationRoot\";\n\nfunction PaginationListItems(): ReactElement {\n const { items, labels, locale } = usePaginationContext(\"List\");\n return (\n <>\n {items.map((item, index) => (\n <PaginationItemRenderer\n item={item}\n key={`${item.type}-${item.page ?? index}`}\n labels={labels}\n {...(locale !== undefined ? { locale } : {})}\n />\n ))}\n </>\n );\n}\nPaginationListItems.displayName = \"PaginationListItems\";\n\nfunction PaginationItemRenderer({\n item,\n labels,\n locale,\n}: {\n readonly item: PaginationItem;\n readonly labels: PaginationContextValue[\"labels\"];\n readonly locale?: string;\n}): ReactElement {\n switch (item.type) {\n case \"ellipsis\":\n return <PaginationEllipsisElement />;\n case \"previous\":\n return <PaginationPrevious disabled={item.disabled} labels={labels} />;\n case \"next\":\n return <PaginationNext disabled={item.disabled} labels={labels} />;\n case \"first\":\n return <PaginationFirst disabled={item.disabled} labels={labels} />;\n case \"last\":\n return <PaginationLast disabled={item.disabled} labels={labels} />;\n default:\n return (\n <PaginationItemPart>\n <PaginationLink\n disabled={item.disabled}\n {...(locale !== undefined ? { locale } : {})}\n pageLabelTemplate={labels.page}\n page={item.page ?? 1}\n selected={item.selected}\n />\n </PaginationItemPart>\n );\n }\n}\nPaginationItemRenderer.displayName = \"PaginationItemRenderer\";\n\nexport function PaginationList(): ReactElement | null {\n const { items, labels, locale } = usePaginationContext(\"List\");\n\n return (\n <PaginationListElement>\n {items.map((item, index) => (\n <PaginationItemRenderer\n item={item}\n key={`${item.type}-${item.page ?? index}`}\n labels={labels}\n {...(locale !== undefined ? { locale } : {})}\n />\n ))}\n </PaginationListElement>\n );\n}\nPaginationList.displayName = \"PaginationList\";\n\nexport function PaginationLink<TAs extends ElementType = \"button\">(\n props: PaginationLinkProps<TAs>,\n): ReactElement | null {\n const {\n as,\n render,\n disabled = false,\n locale,\n pageLabelTemplate,\n page,\n selected = false,\n ...consumerProps\n } = props as PaginationLinkProps<\"button\">;\n const context = usePaginationContext(\"Link\");\n const { setPage } = context;\n const activeLocale = locale ?? context.locale;\n const activePageLabelTemplate = pageLabelTemplate ?? context.labels.page;\n const onClick = (consumerProps as { onClick?: (event: MouseEvent<HTMLButtonElement>) => void })\n .onClick;\n\n return useRenderElement({\n as,\n defaultTag: \"button\",\n props: {\n ...consumerProps,\n \"aria-current\": selected ? \"page\" : undefined,\n \"aria-label\": formatPageLabel(activePageLabelTemplate, page, activeLocale),\n \"data-selected\": selected ? \"\" : undefined,\n \"data-size\": \"icon\",\n \"data-type\": \"page\",\n \"data-uiify-button\": \"\",\n \"data-variant\": \"ghost\",\n disabled: disabled || undefined,\n onClick: composeEventHandlers(onClick, () => setPage(page)),\n type: \"button\",\n children: formatPageNumber(page, activeLocale),\n },\n render,\n state: { selected },\n });\n}\n\nfunction PaginationPrevious({\n disabled,\n labels,\n}: {\n readonly disabled: boolean;\n readonly labels: PaginationContextValue[\"labels\"];\n}): ReactElement {\n const { page, setPage } = usePaginationContext(\"Previous\");\n return (\n <PaginationItemPart>\n <button\n aria-label={labels.previous}\n data-type=\"previous\"\n data-uiify-button=\"\"\n data-variant=\"ghost\"\n disabled={disabled}\n onClick={() => setPage(page - 1)}\n type=\"button\"\n >\n {labels.previousText}\n </button>\n </PaginationItemPart>\n );\n}\nPaginationPrevious.displayName = \"PaginationPrevious\";\n\nfunction PaginationNext({\n disabled,\n labels,\n}: {\n readonly disabled: boolean;\n readonly labels: PaginationContextValue[\"labels\"];\n}): ReactElement {\n const { page, setPage } = usePaginationContext(\"Next\");\n return (\n <PaginationItemPart>\n <button\n aria-label={labels.next}\n data-type=\"next\"\n data-uiify-button=\"\"\n data-variant=\"ghost\"\n disabled={disabled}\n onClick={() => setPage(page + 1)}\n type=\"button\"\n >\n {labels.nextText}\n </button>\n </PaginationItemPart>\n );\n}\nPaginationNext.displayName = \"PaginationNext\";\n\nfunction PaginationFirst({\n disabled,\n labels,\n}: {\n readonly disabled: boolean;\n readonly labels: PaginationContextValue[\"labels\"];\n}): ReactElement {\n const { setPage } = usePaginationContext(\"First\");\n return (\n <PaginationItemPart>\n <button\n aria-label={labels.first}\n data-type=\"first\"\n data-uiify-button=\"\"\n data-variant=\"ghost\"\n disabled={disabled}\n onClick={() => setPage(1)}\n type=\"button\"\n >\n {labels.firstText}\n </button>\n </PaginationItemPart>\n );\n}\nPaginationFirst.displayName = \"PaginationFirst\";\n\nfunction PaginationLast({\n disabled,\n labels,\n}: {\n readonly disabled: boolean;\n readonly labels: PaginationContextValue[\"labels\"];\n}): ReactElement {\n const { count, setPage } = usePaginationContext(\"Last\");\n return (\n <PaginationItemPart>\n <button\n aria-label={labels.last}\n data-type=\"last\"\n data-uiify-button=\"\"\n data-variant=\"ghost\"\n disabled={disabled}\n onClick={() => setPage(count)}\n type=\"button\"\n >\n {labels.lastText}\n </button>\n </PaginationItemPart>\n );\n}\nPaginationLast.displayName = \"PaginationLast\";\n\nfunction formatPageNumber(page: number, locale?: string): string {\n return locale ? new Intl.NumberFormat(locale).format(page) : String(page);\n}\n\nfunction formatPageLabel(template: string, page: number, locale?: string): string {\n return formatLabel(template, { page: locale === undefined ? String(page) : page }, locale);\n}\n\nexport const Pagination = {\n Ellipsis: PaginationEllipsisElement,\n Item: PaginationItemPart,\n Link: PaginationLink,\n List: PaginationList,\n Root: PaginationRoot,\n};\n"],"mappings":"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","names":["PaginationItemPart"]}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { ElementType, ReactElement } from "react";
|
|
2
|
-
import type { PaginationRootProps, PaginationListProps, PaginationItemProps, PaginationLinkProps, PaginationEllipsisProps } from "./types.js";
|
|
2
|
+
import type { PaginationLabels, PaginationRootProps, PaginationListProps, PaginationItemProps, PaginationLinkProps, PaginationEllipsisProps } from "./types.js";
|
|
3
3
|
export { buildPaginationItems } from "./pagination-engine.js";
|
|
4
|
+
export declare const DEFAULT_PAGINATION_LABELS: PaginationLabels;
|
|
4
5
|
export declare function PaginationRoot<TAs extends ElementType = "nav">(props: PaginationRootProps<TAs>): ReactElement | null;
|
|
5
6
|
export declare namespace PaginationRoot {
|
|
6
7
|
var displayName: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PaginationShell.d.ts","sourceRoot":"","sources":["../../../src/components/pagination/PaginationShell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"PaginationShell.d.ts","sourceRoot":"","sources":["../../../src/components/pagination/PaginationShell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAKvD,OAAO,KAAK,EAEV,gBAAgB,EAChB,mBAAmB,EACnB,mBAAmB,EACnB,mBAAmB,EACnB,mBAAmB,EACnB,uBAAuB,EACxB,MAAM,YAAY,CAAC;AAEpB,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAE9D,eAAO,MAAM,yBAAyB,EAAE,gBAWvC,CAAC;AAEF,wBAAgB,cAAc,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAC5D,KAAK,EAAE,mBAAmB,CAAC,GAAG,CAAC,GAC9B,YAAY,GAAG,IAAI,CAyDrB;yBA3De,cAAc;;;AAiJ9B,wBAAgB,cAAc,CAAC,GAAG,SAAS,WAAW,GAAG,IAAI,EAC3D,KAAK,EAAE,mBAAmB,CAAC,GAAG,CAAC,GAC9B,YAAY,GAAG,IAAI,CAUrB;AAED,wBAAgB,kBAAkB,CAAC,GAAG,SAAS,WAAW,GAAG,IAAI,EAC/D,KAAK,EAAE,mBAAmB,CAAC,GAAG,CAAC,GAC9B,YAAY,GAAG,IAAI,CAUrB;AAED,wBAAgB,cAAc,CAAC,GAAG,SAAS,WAAW,GAAG,GAAG,EAC1D,KAAK,EAAE,mBAAmB,CAAC,GAAG,CAAC,GAC9B,YAAY,GAAG,IAAI,CAoCrB;AAuDD,wBAAgB,kBAAkB,CAAC,GAAG,SAAS,WAAW,GAAG,MAAM,EACjE,KAAK,EAAE,uBAAuB,CAAC,GAAG,CAAC,GAClC,YAAY,GAAG,IAAI,CAgBrB;yBAlBe,kBAAkB;;;AAqBlC,eAAO,MAAM,UAAU;;;;;;CAMtB,CAAC"}
|