@gunkin/uiify 0.0.19-alpha → 0.0.22-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 +14 -1
- package/agents/index.md +32 -1
- package/agents/reference/components/alert.md +44 -0
- package/agents/reference/components/aspect-ratio.md +26 -0
- package/agents/reference/components/avatar.md +32 -0
- package/agents/reference/components/badge.md +31 -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/card.md +24 -0
- package/agents/reference/components/carousel.md +3 -2
- package/agents/reference/components/checkbox.md +2 -0
- package/agents/reference/components/combobox.md +2 -1
- package/agents/reference/components/date-picker.md +23 -0
- package/agents/reference/components/description-list.md +38 -0
- package/agents/reference/components/drawer.md +8 -1
- package/agents/reference/components/dropdown-menu.md +1 -1
- package/agents/reference/components/empty.md +45 -0
- package/agents/reference/components/fieldset.md +31 -0
- package/agents/reference/components/file-upload.md +12 -1
- package/agents/reference/components/form-error-summary.md +33 -0
- package/agents/reference/components/input-group.md +33 -0
- package/agents/reference/components/item.md +52 -0
- 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/progress.md +16 -0
- 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/alert/Alert.d.ts +15 -0
- package/dist/components/alert/Alert.d.ts.map +1 -0
- package/dist/components/alert/Alert.js +61 -0
- package/dist/components/alert/Alert.js.map +1 -0
- package/dist/components/alert/index.d.ts +3 -0
- package/dist/components/alert/index.d.ts.map +1 -0
- package/dist/components/alert/index.js +7 -0
- package/dist/components/alert/index.js.map +1 -0
- package/dist/components/alert/types.d.ts +20 -0
- package/dist/components/alert/types.d.ts.map +1 -0
- package/dist/components/alert/types.js +1 -0
- package/dist/components/alert/types.js.map +1 -0
- package/dist/components/alert.d.ts +1 -0
- package/dist/components/alert.js +1 -0
- package/dist/components/aspect-ratio/AspectRatio.d.ts +7 -0
- package/dist/components/aspect-ratio/AspectRatio.d.ts.map +1 -0
- package/dist/components/aspect-ratio/AspectRatio.js +26 -0
- package/dist/components/aspect-ratio/AspectRatio.js.map +1 -0
- package/dist/components/aspect-ratio/index.d.ts +3 -0
- package/dist/components/aspect-ratio/index.d.ts.map +1 -0
- package/dist/components/aspect-ratio/index.js +5 -0
- package/dist/components/aspect-ratio/index.js.map +1 -0
- package/dist/components/aspect-ratio/types.d.ts +9 -0
- package/dist/components/aspect-ratio/types.d.ts.map +1 -0
- package/dist/components/aspect-ratio/types.js +1 -0
- package/dist/components/aspect-ratio/types.js.map +1 -0
- package/dist/components/aspect-ratio.d.ts +1 -0
- package/dist/components/aspect-ratio.js +1 -0
- package/dist/components/avatar/Avatar.d.ts +7 -0
- package/dist/components/avatar/Avatar.d.ts.map +1 -0
- package/dist/components/avatar/Avatar.js +24 -0
- package/dist/components/avatar/Avatar.js.map +1 -0
- package/dist/components/avatar/index.d.ts +3 -0
- package/dist/components/avatar/index.d.ts.map +1 -0
- package/dist/components/avatar/index.js +5 -0
- package/dist/components/avatar/index.js.map +1 -0
- package/dist/components/avatar/types.d.ts +12 -0
- package/dist/components/avatar/types.d.ts.map +1 -0
- package/dist/components/avatar/types.js +1 -0
- package/dist/components/avatar/types.js.map +1 -0
- package/dist/components/avatar.d.ts +1 -0
- package/dist/components/avatar.js +1 -0
- package/dist/components/badge/Badge.d.ts +7 -0
- package/dist/components/badge/Badge.d.ts.map +1 -0
- package/dist/components/badge/Badge.js +21 -0
- package/dist/components/badge/Badge.js.map +1 -0
- package/dist/components/badge/index.d.ts +3 -0
- package/dist/components/badge/index.d.ts.map +1 -0
- package/dist/components/badge/index.js +5 -0
- package/dist/components/badge/index.js.map +1 -0
- package/dist/components/badge/types.d.ts +11 -0
- package/dist/components/badge/types.d.ts.map +1 -0
- package/dist/components/badge/types.js +1 -0
- package/dist/components/badge/types.js.map +1 -0
- package/dist/components/badge.d.ts +1 -0
- package/dist/components/badge.js +1 -0
- package/dist/components/behavior.css +21 -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/card/Card.d.ts +7 -0
- package/dist/components/card/Card.d.ts.map +1 -0
- package/dist/components/card/Card.js +16 -0
- package/dist/components/card/Card.js.map +1 -0
- package/dist/components/card/index.d.ts +3 -0
- package/dist/components/card/index.d.ts.map +1 -0
- package/dist/components/card/index.js +5 -0
- package/dist/components/card/index.js.map +1 -0
- package/dist/components/card/types.d.ts +7 -0
- package/dist/components/card/types.d.ts.map +1 -0
- package/dist/components/card/types.js +1 -0
- package/dist/components/card/types.js.map +1 -0
- package/dist/components/card.d.ts +1 -0
- package/dist/components/card.js +1 -0
- 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/checkbox/types.d.ts +2 -0
- package/dist/components/checkbox/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/date-picker/DatePicker.d.ts +7 -0
- package/dist/components/date-picker/DatePicker.d.ts.map +1 -0
- package/dist/components/date-picker/DatePicker.js +19 -0
- package/dist/components/date-picker/DatePicker.js.map +1 -0
- package/dist/components/date-picker/index.d.ts +3 -0
- package/dist/components/date-picker/index.d.ts.map +1 -0
- package/dist/components/date-picker/index.js +5 -0
- package/dist/components/date-picker/index.js.map +1 -0
- package/dist/components/date-picker/types.d.ts +5 -0
- package/dist/components/date-picker/types.d.ts.map +1 -0
- package/dist/components/date-picker/types.js +1 -0
- package/dist/components/date-picker/types.js.map +1 -0
- package/dist/components/date-picker.d.ts +1 -0
- package/dist/components/date-picker.js +1 -0
- package/dist/components/description-list/DescriptionList.d.ts +15 -0
- package/dist/components/description-list/DescriptionList.d.ts.map +1 -0
- package/dist/components/description-list/DescriptionList.js +48 -0
- package/dist/components/description-list/DescriptionList.js.map +1 -0
- package/dist/components/description-list/index.d.ts +3 -0
- package/dist/components/description-list/index.d.ts.map +1 -0
- package/dist/components/description-list/index.js +7 -0
- package/dist/components/description-list/index.js.map +1 -0
- package/dist/components/description-list/types.d.ts +15 -0
- package/dist/components/description-list/types.d.ts.map +1 -0
- package/dist/components/description-list/types.js +1 -0
- package/dist/components/description-list/types.js.map +1 -0
- package/dist/components/description-list.d.ts +1 -0
- package/dist/components/description-list.js +1 -0
- 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/empty/Empty.d.ts +19 -0
- package/dist/components/empty/Empty.d.ts.map +1 -0
- package/dist/components/empty/Empty.js +56 -0
- package/dist/components/empty/Empty.js.map +1 -0
- package/dist/components/empty/index.d.ts +3 -0
- package/dist/components/empty/index.d.ts.map +1 -0
- package/dist/components/empty/index.js +8 -0
- package/dist/components/empty/index.js.map +1 -0
- package/dist/components/empty/types.d.ts +19 -0
- package/dist/components/empty/types.d.ts.map +1 -0
- package/dist/components/empty/types.js +1 -0
- package/dist/components/empty/types.js.map +1 -0
- package/dist/components/empty.d.ts +1 -0
- package/dist/components/empty.js +1 -0
- package/dist/components/fieldset/Fieldset.d.ts +11 -0
- package/dist/components/fieldset/Fieldset.d.ts.map +1 -0
- package/dist/components/fieldset/Fieldset.js +38 -0
- package/dist/components/fieldset/Fieldset.js.map +1 -0
- package/dist/components/fieldset/index.d.ts +3 -0
- package/dist/components/fieldset/index.d.ts.map +1 -0
- package/dist/components/fieldset/index.js +6 -0
- package/dist/components/fieldset/index.js.map +1 -0
- package/dist/components/fieldset/types.d.ts +11 -0
- package/dist/components/fieldset/types.d.ts.map +1 -0
- package/dist/components/fieldset/types.js +1 -0
- package/dist/components/fieldset/types.js.map +1 -0
- package/dist/components/fieldset.d.ts +1 -0
- package/dist/components/fieldset.js +1 -0
- 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/form-error-summary/FormErrorSummary.d.ts +7 -0
- package/dist/components/form-error-summary/FormErrorSummary.d.ts.map +1 -0
- package/dist/components/form-error-summary/FormErrorSummary.js +25 -0
- package/dist/components/form-error-summary/FormErrorSummary.js.map +1 -0
- package/dist/components/form-error-summary/index.d.ts +3 -0
- package/dist/components/form-error-summary/index.d.ts.map +1 -0
- package/dist/components/form-error-summary/index.js +5 -0
- package/dist/components/form-error-summary/index.js.map +1 -0
- package/dist/components/form-error-summary/types.d.ts +12 -0
- package/dist/components/form-error-summary/types.d.ts.map +1 -0
- package/dist/components/form-error-summary/types.js +1 -0
- package/dist/components/form-error-summary/types.js.map +1 -0
- package/dist/components/form-error-summary.d.ts +1 -0
- package/dist/components/form-error-summary.js +1 -0
- package/dist/components/index.d.ts +13 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +13 -0
- package/dist/components/index.js.map +1 -1
- package/dist/components/input-group/InputGroup.d.ts +5 -0
- package/dist/components/input-group/InputGroup.d.ts.map +1 -0
- package/dist/components/input-group/InputGroup.js +37 -0
- package/dist/components/input-group/InputGroup.js.map +1 -0
- package/dist/components/input-group/index.d.ts +3 -0
- package/dist/components/input-group/index.d.ts.map +1 -0
- package/dist/components/input-group/index.js +6 -0
- package/dist/components/input-group/index.js.map +1 -0
- package/dist/components/input-group/types.d.ts +12 -0
- package/dist/components/input-group/types.d.ts.map +1 -0
- package/dist/components/input-group/types.js +1 -0
- package/dist/components/input-group/types.js.map +1 -0
- package/dist/components/input-group.d.ts +1 -0
- package/dist/components/input-group.js +1 -0
- package/dist/components/internal/native-check-control/NativeCheckControl.d.ts.map +1 -1
- package/dist/components/internal/native-check-control/NativeCheckControl.js +4 -0
- package/dist/components/internal/native-check-control/NativeCheckControl.js.map +1 -1
- package/dist/components/internal/native-check-control/types.d.ts +2 -0
- package/dist/components/internal/native-check-control/types.d.ts.map +1 -1
- package/dist/components/item/Item.d.ts +23 -0
- package/dist/components/item/Item.d.ts.map +1 -0
- package/dist/components/item/Item.js +64 -0
- package/dist/components/item/Item.js.map +1 -0
- package/dist/components/item/index.d.ts +3 -0
- package/dist/components/item/index.d.ts.map +1 -0
- package/dist/components/item/index.js +9 -0
- package/dist/components/item/index.js.map +1 -0
- package/dist/components/item/types.d.ts +23 -0
- package/dist/components/item/types.d.ts.map +1 -0
- package/dist/components/item/types.js +1 -0
- package/dist/components/item/types.js.map +1 -0
- package/dist/components/item.d.ts +1 -0
- package/dist/components/item.js +1 -0
- 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/progress/Progress.d.ts +7 -0
- package/dist/components/progress/Progress.d.ts.map +1 -0
- package/dist/components/progress/Progress.js +9 -0
- package/dist/components/progress/Progress.js.map +1 -0
- package/dist/components/progress/index.d.ts +3 -0
- package/dist/components/progress/index.d.ts.map +1 -0
- package/dist/components/progress/index.js +5 -0
- package/dist/components/progress/index.js.map +1 -0
- package/dist/components/progress/types.d.ts +3 -0
- package/dist/components/progress/types.d.ts.map +1 -0
- package/dist/components/progress/types.js +1 -0
- package/dist/components/progress/types.js.map +1 -0
- package/dist/components/progress.d.ts +1 -0
- package/dist/components/progress.js +1 -0
- 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 +43 -34
- package/skills/uiify/references/elements/alert-modal.md +5 -5
- package/skills/uiify/references/elements/aspect-ratio.md +59 -0
- package/skills/uiify/references/elements/avatar.md +10 -19
- package/skills/uiify/references/elements/badge.md +11 -19
- package/skills/uiify/references/elements/button.md +5 -5
- package/skills/uiify/references/elements/candle-chart.md +2 -0
- package/skills/uiify/references/elements/card.md +10 -21
- package/skills/uiify/references/elements/carousel.md +2 -0
- package/skills/uiify/references/elements/checkbox.md +1 -1
- package/skills/uiify/references/elements/date-picker.md +11 -15
- package/skills/uiify/references/elements/description-list.md +38 -0
- package/skills/uiify/references/elements/empty-state.md +12 -23
- package/skills/uiify/references/elements/field.md +2 -2
- package/skills/uiify/references/elements/fieldset.md +39 -0
- package/skills/uiify/references/elements/form-error-summary.md +39 -0
- package/skills/uiify/references/elements/inline-alert.md +11 -19
- package/skills/uiify/references/elements/input-group.md +39 -0
- package/skills/uiify/references/elements/item.md +39 -0
- package/skills/uiify/references/elements/modal.md +1 -1
- package/skills/uiify/references/elements/number-field.md +2 -0
- package/skills/uiify/references/elements/pagination.md +2 -0
- package/skills/uiify/references/elements/progress-bar.md +11 -20
- package/skills/uiify/references/elements/select.md +1 -1
- package/skills/uiify/references/examples/alert-confirmation.md +21 -9
- package/skills/uiify/references/examples/field-validation.md +2 -2
- package/skills/uiify/references/examples/select-basic.md +1 -1
- package/skills/uiify/references/examples/table-controls.md +3 -2
- package/skills/uiify/references/guides/i18n.md +21 -0
- package/skills/uiify/references/guides/verification.md +9 -0
- package/skills/uiify/scripts/static.mjs +79 -0
|
@@ -1,5 +1,19 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useRenderElement } from "@gunkin/uiify/core/render";
|
|
3
|
+
import { formatLabel } from "@gunkin/uiify/core/format-label";
|
|
4
|
+
const DEFAULT_CANDLE_CHART_LABELS = {
|
|
5
|
+
chart: "Candlestick chart",
|
|
6
|
+
candle: "Candle {time}",
|
|
7
|
+
candles: "candles",
|
|
8
|
+
months: "months",
|
|
9
|
+
prices: "prices",
|
|
10
|
+
data: "data",
|
|
11
|
+
time: "Time",
|
|
12
|
+
open: "Open",
|
|
13
|
+
high: "High",
|
|
14
|
+
low: "Low",
|
|
15
|
+
close: "Close"
|
|
16
|
+
};
|
|
3
17
|
function percent(value) {
|
|
4
18
|
const rounded = Math.round(value * 1e4) / 1e4;
|
|
5
19
|
return `${rounded}%`;
|
|
@@ -28,16 +42,16 @@ function monthKey(time) {
|
|
|
28
42
|
if (Number.isNaN(date.getTime())) return String(time);
|
|
29
43
|
return `${date.getUTCFullYear()}-${date.getUTCMonth()}`;
|
|
30
44
|
}
|
|
31
|
-
function monthLabel(time) {
|
|
45
|
+
function monthLabel(time, locale) {
|
|
32
46
|
const date = new Date(time);
|
|
33
47
|
if (Number.isNaN(date.getTime())) return String(time);
|
|
34
|
-
return new Intl.DateTimeFormat(
|
|
48
|
+
return new Intl.DateTimeFormat(locale, {
|
|
35
49
|
month: "short",
|
|
36
50
|
timeZone: "UTC",
|
|
37
51
|
year: "2-digit"
|
|
38
52
|
}).format(date);
|
|
39
53
|
}
|
|
40
|
-
function monthLabelsFor(data) {
|
|
54
|
+
function monthLabelsFor(data, locale) {
|
|
41
55
|
const labels = [];
|
|
42
56
|
const seen = /* @__PURE__ */ new Set();
|
|
43
57
|
data.forEach((candle, index) => {
|
|
@@ -45,20 +59,20 @@ function monthLabelsFor(data) {
|
|
|
45
59
|
if (seen.has(key)) return;
|
|
46
60
|
seen.add(key);
|
|
47
61
|
labels.push({
|
|
48
|
-
label: monthLabel(candle.time),
|
|
62
|
+
label: monthLabel(candle.time, locale),
|
|
49
63
|
position: index / Math.max(data.length, 1) * 100
|
|
50
64
|
});
|
|
51
65
|
});
|
|
52
66
|
return labels;
|
|
53
67
|
}
|
|
54
|
-
function priceLabelsFor(min, max) {
|
|
68
|
+
function priceLabelsFor(min, max, locale) {
|
|
55
69
|
const tickCount = 6;
|
|
56
70
|
const range = max - min;
|
|
57
71
|
return Array.from({ length: tickCount }, (_, index) => {
|
|
58
72
|
const ratio = index / (tickCount - 1);
|
|
59
73
|
const value = max - range * ratio;
|
|
60
74
|
return {
|
|
61
|
-
label: new Intl.NumberFormat(
|
|
75
|
+
label: new Intl.NumberFormat(locale, { maximumFractionDigits: 2 }).format(value),
|
|
62
76
|
position: ratio * 100
|
|
63
77
|
};
|
|
64
78
|
});
|
|
@@ -113,6 +127,7 @@ function axisLabelsFor(overrides, fallback) {
|
|
|
113
127
|
function CandleChartCandle({
|
|
114
128
|
as: Tag,
|
|
115
129
|
candle,
|
|
130
|
+
hitLabel,
|
|
116
131
|
index,
|
|
117
132
|
x,
|
|
118
133
|
slot,
|
|
@@ -146,7 +161,7 @@ function CandleChartCandle({
|
|
|
146
161
|
{
|
|
147
162
|
"data-part": "candle-hit",
|
|
148
163
|
type: "button",
|
|
149
|
-
"aria-label":
|
|
164
|
+
"aria-label": hitLabel,
|
|
150
165
|
"aria-pressed": isSelected,
|
|
151
166
|
onClick: () => onCandleClick?.(index),
|
|
152
167
|
onKeyDown: handleKeyDown,
|
|
@@ -166,9 +181,11 @@ function CandleChart(props) {
|
|
|
166
181
|
xAxis,
|
|
167
182
|
yAxis,
|
|
168
183
|
"aria-label": ariaLabel,
|
|
184
|
+
labels,
|
|
169
185
|
activeCandleIndex,
|
|
170
186
|
cursorY,
|
|
171
187
|
interactive = false,
|
|
188
|
+
locale = "en-US",
|
|
172
189
|
onCandleClick,
|
|
173
190
|
onCandlePointerLeave,
|
|
174
191
|
onCandlePointerMove,
|
|
@@ -179,18 +196,20 @@ function CandleChart(props) {
|
|
|
179
196
|
slotOffset = 0,
|
|
180
197
|
...consumerProps
|
|
181
198
|
} = props;
|
|
199
|
+
const accessibleLabels = { ...DEFAULT_CANDLE_CHART_LABELS, ...labels };
|
|
182
200
|
const { min, max } = getPriceBounds(data);
|
|
183
|
-
const label = ariaLabel ??
|
|
184
|
-
const monthLabels = axisLabelsFor(xAxis, monthLabelsFor(data));
|
|
185
|
-
const priceLabels = axisLabelsFor(yAxis, priceLabelsFor(min, max));
|
|
201
|
+
const label = ariaLabel ?? accessibleLabels.chart;
|
|
202
|
+
const monthLabels = axisLabelsFor(xAxis, monthLabelsFor(data, locale));
|
|
203
|
+
const priceLabels = axisLabelsFor(yAxis, priceLabelsFor(min, max, locale));
|
|
186
204
|
const readoutIndex = activeCandleIndex ?? selectedCandleIndex ?? (data.length > 0 ? data.length - 1 : void 0);
|
|
187
205
|
const readoutCandle = readoutIndex === void 0 ? void 0 : data[readoutIndex];
|
|
188
206
|
const crosshairCandle = activeCandleIndex === void 0 ? void 0 : data[activeCandleIndex];
|
|
189
|
-
const candles = candleLayer ?? /* @__PURE__ */ jsx("ol", { "data-part": "candles", "aria-label": `${label} candles`, children: data.map((candle, index) => /* @__PURE__ */ jsx(
|
|
207
|
+
const candles = candleLayer ?? /* @__PURE__ */ jsx("ol", { "data-part": "candles", "aria-label": `${label} ${accessibleLabels.candles}`, children: data.map((candle, index) => /* @__PURE__ */ jsx(
|
|
190
208
|
CandleChartCandle,
|
|
191
209
|
{
|
|
192
210
|
as: "li",
|
|
193
211
|
candle,
|
|
212
|
+
hitLabel: formatLabel(accessibleLabels.candle, { time: String(candle.time) }, locale),
|
|
194
213
|
index,
|
|
195
214
|
x: index / data.length * 100,
|
|
196
215
|
slot: 100 / data.length,
|
|
@@ -249,44 +268,60 @@ function CandleChart(props) {
|
|
|
249
268
|
}
|
|
250
269
|
) : null
|
|
251
270
|
] }),
|
|
252
|
-
/* @__PURE__ */ jsx("div", { "data-part": "time-viewport", children: /* @__PURE__ */ jsxs(
|
|
253
|
-
|
|
254
|
-
"li",
|
|
255
|
-
{
|
|
256
|
-
style: axisStyle("x", axisLabel.position),
|
|
257
|
-
children: axisLabel.label
|
|
258
|
-
},
|
|
259
|
-
`${axisLabel.position}-${index}`
|
|
260
|
-
)),
|
|
261
|
-
interactive && crosshairCandle && activeCandleIndex !== void 0 ? /* @__PURE__ */ jsx(
|
|
262
|
-
"li",
|
|
263
|
-
{
|
|
264
|
-
"data-part": "crosshair-time",
|
|
265
|
-
style: crosshairStyle(slotOffset + activeCandleIndex, slotCount, void 0),
|
|
266
|
-
children: String(crosshairCandle.time)
|
|
267
|
-
}
|
|
268
|
-
) : null
|
|
269
|
-
] }) })
|
|
270
|
-
] }) }),
|
|
271
|
-
/* @__PURE__ */ jsxs("ol", { "data-part": "price-axis", "data-axis": "price", "aria-label": `${label} prices`, children: [
|
|
272
|
-
priceLabels.map((axisLabel, index) => /* @__PURE__ */ jsx(
|
|
273
|
-
"li",
|
|
271
|
+
/* @__PURE__ */ jsx("div", { "data-part": "time-viewport", children: /* @__PURE__ */ jsxs(
|
|
272
|
+
"ol",
|
|
274
273
|
{
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
274
|
+
"data-part": "time-axis",
|
|
275
|
+
"data-axis": "time",
|
|
276
|
+
"aria-label": `${label} ${accessibleLabels.months}`,
|
|
277
|
+
children: [
|
|
278
|
+
monthLabels.map((axisLabel, index) => /* @__PURE__ */ jsx(
|
|
279
|
+
"li",
|
|
280
|
+
{
|
|
281
|
+
style: axisStyle("x", axisLabel.position),
|
|
282
|
+
children: axisLabel.label
|
|
283
|
+
},
|
|
284
|
+
`${axisLabel.position}-${index}`
|
|
285
|
+
)),
|
|
286
|
+
interactive && crosshairCandle && activeCandleIndex !== void 0 ? /* @__PURE__ */ jsx(
|
|
287
|
+
"li",
|
|
288
|
+
{
|
|
289
|
+
"data-part": "crosshair-time",
|
|
290
|
+
style: crosshairStyle(slotOffset + activeCandleIndex, slotCount, void 0),
|
|
291
|
+
children: String(crosshairCandle.time)
|
|
292
|
+
}
|
|
293
|
+
) : null
|
|
294
|
+
]
|
|
295
|
+
}
|
|
296
|
+
) })
|
|
297
|
+
] }) }),
|
|
298
|
+
/* @__PURE__ */ jsxs(
|
|
299
|
+
"ol",
|
|
300
|
+
{
|
|
301
|
+
"data-part": "price-axis",
|
|
302
|
+
"data-axis": "price",
|
|
303
|
+
"aria-label": `${label} ${accessibleLabels.prices}`,
|
|
304
|
+
children: [
|
|
305
|
+
priceLabels.map((axisLabel, index) => /* @__PURE__ */ jsx(
|
|
306
|
+
"li",
|
|
307
|
+
{
|
|
308
|
+
style: axisStyle("y", axisLabel.position),
|
|
309
|
+
children: axisLabel.label
|
|
310
|
+
},
|
|
311
|
+
`${axisLabel.position}-${index}`
|
|
312
|
+
)),
|
|
313
|
+
interactive && crosshairCandle && activeCandleIndex !== void 0 ? /* @__PURE__ */ jsx("li", { "data-part": "crosshair-price", style: cursorStyle(cursorY), children: crosshairCandle.close }) : null
|
|
314
|
+
]
|
|
315
|
+
}
|
|
316
|
+
)
|
|
282
317
|
] }),
|
|
283
|
-
/* @__PURE__ */ jsxs("table", { "data-part": "data", "aria-label": `${label} data`, children: [
|
|
318
|
+
/* @__PURE__ */ jsxs("table", { "data-part": "data", "aria-label": `${label} ${accessibleLabels.data}`, children: [
|
|
284
319
|
/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
|
|
285
|
-
/* @__PURE__ */ jsx("th", { scope: "col", children:
|
|
286
|
-
/* @__PURE__ */ jsx("th", { scope: "col", children:
|
|
287
|
-
/* @__PURE__ */ jsx("th", { scope: "col", children:
|
|
288
|
-
/* @__PURE__ */ jsx("th", { scope: "col", children:
|
|
289
|
-
/* @__PURE__ */ jsx("th", { scope: "col", children:
|
|
320
|
+
/* @__PURE__ */ jsx("th", { scope: "col", children: accessibleLabels.time }),
|
|
321
|
+
/* @__PURE__ */ jsx("th", { scope: "col", children: accessibleLabels.open }),
|
|
322
|
+
/* @__PURE__ */ jsx("th", { scope: "col", children: accessibleLabels.high }),
|
|
323
|
+
/* @__PURE__ */ jsx("th", { scope: "col", children: accessibleLabels.low }),
|
|
324
|
+
/* @__PURE__ */ jsx("th", { scope: "col", children: accessibleLabels.close })
|
|
290
325
|
] }) }),
|
|
291
326
|
/* @__PURE__ */ jsx("tbody", { children: data.map((candle, index) => /* @__PURE__ */ jsxs("tr", { children: [
|
|
292
327
|
/* @__PURE__ */ jsx("th", { scope: "row", children: String(candle.time) }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/candle-chart/CandleChart.tsx"],"sourcesContent":["import type {\n CSSProperties,\n ElementType,\n KeyboardEvent,\n PointerEvent,\n ReactElement,\n ReactNode,\n} from \"react\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport type {\n CandleChartAxisLabel,\n CandleChartCandleProps,\n CandleChartData,\n CandleChartProps,\n CandleChartViewProps,\n} from \"./types.js\";\n\ninterface CandleStyle extends CSSProperties {\n \"--candle-body-height\": string;\n \"--candle-body-top\": string;\n \"--candle-slot\": string;\n \"--candle-wick-height\": string;\n \"--candle-wick-top\": string;\n \"--candle-x\": string;\n \"--candle-cursor-y\"?: string;\n}\n\ninterface CrosshairStyle extends CSSProperties {\n \"--candle-crosshair-x\": string;\n \"--candle-cursor-y\"?: string;\n}\n\ninterface CursorStyle extends CSSProperties {\n \"--candle-cursor-y\"?: string;\n}\n\ninterface AxisStyle extends CSSProperties {\n \"--candle-axis-x\"?: string;\n \"--candle-axis-y\"?: string;\n}\n\ntype CandleDirection = \"down\" | \"flat\" | \"up\";\n\ninterface CandleGeometry {\n readonly bodyHeight: string;\n readonly bodyTop: string;\n readonly direction: CandleDirection;\n readonly slot: string;\n readonly wickHeight: string;\n readonly wickTop: string;\n readonly x: string;\n}\n\nfunction percent(value: number): string {\n const rounded = Math.round(value * 10000) / 10000;\n return `${rounded}%`;\n}\n\nfunction valueToPercent(value: number, min: number, range: number): number {\n if (range === 0) return 50;\n return Math.min(100, Math.max(0, ((min + range - value) / range) * 100));\n}\n\nfunction directionFor(candle: CandleChartData): CandleDirection {\n if (candle.close > candle.open) return \"up\";\n if (candle.close < candle.open) return \"down\";\n return \"flat\";\n}\n\nexport function getPriceBounds(data: readonly CandleChartData[]): { max: number; min: number } {\n let min = Number.POSITIVE_INFINITY;\n let max = Number.NEGATIVE_INFINITY;\n\n for (const candle of data) {\n min = Math.min(min, candle.low);\n max = Math.max(max, candle.high);\n }\n\n if (data.length === 0) return { max: 1, min: 0 };\n return { max, min };\n}\n\ninterface AxisLabel {\n readonly label: ReactNode;\n readonly position: number;\n}\n\nfunction monthKey(time: string | number): string {\n const date = new Date(time);\n if (Number.isNaN(date.getTime())) return String(time);\n return `${date.getUTCFullYear()}-${date.getUTCMonth()}`;\n}\n\nfunction monthLabel(time: string | number): string {\n const date = new Date(time);\n if (Number.isNaN(date.getTime())) return String(time);\n return new Intl.DateTimeFormat(\"en-US\", {\n month: \"short\",\n timeZone: \"UTC\",\n year: \"2-digit\",\n }).format(date);\n}\n\nfunction monthLabelsFor(data: readonly CandleChartData[]): AxisLabel[] {\n const labels: AxisLabel[] = [];\n const seen = new Set<string>();\n\n data.forEach((candle, index) => {\n const key = monthKey(candle.time);\n if (seen.has(key)) return;\n seen.add(key);\n labels.push({\n label: monthLabel(candle.time),\n position: (index / Math.max(data.length, 1)) * 100,\n });\n });\n\n return labels;\n}\n\nfunction priceLabelsFor(min: number, max: number): AxisLabel[] {\n const tickCount = 6;\n const range = max - min;\n\n return Array.from({ length: tickCount }, (_, index) => {\n const ratio = index / (tickCount - 1);\n const value = max - range * ratio;\n return {\n label: new Intl.NumberFormat(\"en-US\", { maximumFractionDigits: 2 }).format(value),\n position: ratio * 100,\n };\n });\n}\n\nfunction geometryFor(\n candle: CandleChartData,\n x: number,\n slot: number,\n min: number,\n max: number,\n): CandleGeometry {\n const range = max - min;\n const open = valueToPercent(candle.open, min, range);\n const close = valueToPercent(candle.close, min, range);\n const high = valueToPercent(candle.high, min, range);\n const low = valueToPercent(candle.low, min, range);\n\n return {\n bodyHeight: percent(Math.abs(close - open)),\n bodyTop: percent(Math.min(open, close)),\n direction: directionFor(candle),\n slot: percent(slot),\n wickHeight: percent(Math.max(0, low - high)),\n wickTop: percent(high),\n x: percent(x),\n };\n}\n\nfunction candleStyle(geometry: CandleGeometry, cursorY: number | undefined): CandleStyle {\n return {\n \"--candle-body-height\": geometry.bodyHeight,\n \"--candle-body-top\": geometry.bodyTop,\n \"--candle-slot\": geometry.slot,\n \"--candle-wick-height\": geometry.wickHeight,\n \"--candle-wick-top\": geometry.wickTop,\n \"--candle-x\": geometry.x,\n ...(cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` }),\n };\n}\n\nfunction crosshairStyle(index: number, count: number, cursorY: number | undefined): CrosshairStyle {\n return {\n \"--candle-crosshair-x\": percent(((index + 0.5) / Math.max(count, 1)) * 100),\n ...(cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` }),\n };\n}\n\nfunction cursorStyle(cursorY: number | undefined): CursorStyle {\n return cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` };\n}\n\nfunction clampAxisPosition(position: number): number {\n return Math.min(100, Math.max(0, position));\n}\n\nfunction axisStyle(axis: \"x\" | \"y\", position: number): AxisStyle {\n const value = percent(clampAxisPosition(position));\n if (axis === \"x\") return { \"--candle-axis-x\": value };\n return { \"--candle-axis-y\": value };\n}\n\nfunction axisLabelsFor(\n overrides: readonly CandleChartAxisLabel[] | undefined,\n fallback: readonly AxisLabel[],\n): readonly AxisLabel[] {\n return overrides ?? fallback;\n}\n\n/** One candle glyph with its optional hit target; shared by the static list and virtual rows. */\nexport function CandleChartCandle({\n as: Tag,\n candle,\n index,\n x,\n slot,\n min,\n max,\n interactive,\n isActive,\n isSelected,\n cursorY,\n onCandleClick,\n onCandlePointerLeave,\n onCandlePointerMove,\n}: CandleChartCandleProps): ReactElement {\n const geometry = geometryFor(candle, x, slot, min, max);\n const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (event.key !== \"Enter\" && event.key !== \" \") return;\n event.preventDefault();\n onCandleClick?.(index);\n };\n\n return (\n <Tag\n aria-hidden={interactive ? undefined : true}\n data-part=\"candle\"\n data-direction={geometry.direction}\n data-crosshair-active={interactive && isActive ? \"\" : undefined}\n data-time={String(candle.time)}\n style={candleStyle(geometry, isActive ? cursorY : undefined)}\n >\n {interactive ? (\n <button\n data-part=\"candle-hit\"\n type=\"button\"\n aria-label={`Candle ${String(candle.time)}`}\n aria-pressed={isSelected}\n onClick={() => onCandleClick?.(index)}\n onKeyDown={handleKeyDown}\n onPointerLeave={onCandlePointerLeave}\n onPointerMove={(event: PointerEvent<HTMLButtonElement>) =>\n onCandlePointerMove?.({ index, offsetY: event.nativeEvent.offsetY })\n }\n />\n ) : null}\n </Tag>\n );\n}\nCandleChartCandle.displayName = \"CandleChartCandle\";\n\nexport function CandleChart<TAs extends ElementType = \"figure\">(\n props: CandleChartProps<TAs>,\n): ReactElement | null {\n const {\n as,\n render,\n data,\n xAxis,\n yAxis,\n \"aria-label\": ariaLabel,\n activeCandleIndex,\n cursorY,\n interactive = false,\n onCandleClick,\n onCandlePointerLeave,\n onCandlePointerMove,\n selectedCandleIndex,\n candleLayer,\n announceReadout = true,\n slotCount = data.length,\n slotOffset = 0,\n ...consumerProps\n } = props as CandleChartProps<\"figure\"> & CandleChartViewProps;\n const { min, max } = getPriceBounds(data);\n const label = ariaLabel ?? \"Candlestick chart\";\n const monthLabels = axisLabelsFor(xAxis, monthLabelsFor(data));\n const priceLabels = axisLabelsFor(yAxis, priceLabelsFor(min, max));\n const readoutIndex =\n activeCandleIndex ?? selectedCandleIndex ?? (data.length > 0 ? data.length - 1 : undefined);\n const readoutCandle = readoutIndex === undefined ? undefined : data[readoutIndex];\n const crosshairCandle = activeCandleIndex === undefined ? undefined : data[activeCandleIndex];\n const candles = candleLayer ?? (\n <ol data-part=\"candles\" aria-label={`${label} candles`}>\n {data.map((candle, index) => (\n <CandleChartCandle\n key={`${candle.time}-${index}`}\n as=\"li\"\n candle={candle}\n index={index}\n x={(index / data.length) * 100}\n slot={100 / data.length}\n min={min}\n max={max}\n interactive={interactive}\n isActive={activeCandleIndex === index}\n isSelected={selectedCandleIndex === index}\n cursorY={cursorY}\n onCandleClick={onCandleClick}\n onCandlePointerLeave={onCandlePointerLeave}\n onCandlePointerMove={onCandlePointerMove}\n />\n ))}\n </ol>\n );\n\n return useRenderElement({\n as,\n defaultTag: \"figure\",\n props: {\n ...consumerProps,\n \"aria-label\": label,\n \"data-uiify-candle-chart\": \"\",\n \"data-interactive\": interactive ? \"\" : undefined,\n children: (\n <>\n <figcaption>{label}</figcaption>\n {interactive && readoutCandle ? (\n <div data-part=\"readout\" aria-live={announceReadout ? \"polite\" : \"off\"}>\n <span data-part=\"readout-time\">{String(readoutCandle.time)}</span>\n <span>O {readoutCandle.open}</span>\n <span>H {readoutCandle.high}</span>\n <span>L {readoutCandle.low}</span>\n <span>C {readoutCandle.close}</span>\n </div>\n ) : null}\n <div data-part=\"plot\" aria-hidden={interactive ? undefined : true}>\n <div data-part=\"scroll-viewport\">\n <div data-part=\"canvas\">\n <div data-part=\"viewport\">\n {candles}\n {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n <div\n data-part=\"crosshair\"\n aria-hidden=\"true\"\n style={crosshairStyle(slotOffset + activeCandleIndex, slotCount, cursorY)}\n >\n <span data-part=\"crosshair-marker\">+</span>\n </div>\n ) : null}\n </div>\n <div data-part=\"time-viewport\">\n <ol data-part=\"time-axis\" data-axis=\"time\" aria-label={`${label} months`}>\n {monthLabels.map((axisLabel, index) => (\n <li\n key={`${axisLabel.position}-${index}`}\n style={axisStyle(\"x\", axisLabel.position)}\n >\n {axisLabel.label}\n </li>\n ))}\n {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n <li\n data-part=\"crosshair-time\"\n style={crosshairStyle(slotOffset + activeCandleIndex, slotCount, undefined)}\n >\n {String(crosshairCandle.time)}\n </li>\n ) : null}\n </ol>\n </div>\n </div>\n </div>\n <ol data-part=\"price-axis\" data-axis=\"price\" aria-label={`${label} prices`}>\n {priceLabels.map((axisLabel, index) => (\n <li\n key={`${axisLabel.position}-${index}`}\n style={axisStyle(\"y\", axisLabel.position)}\n >\n {axisLabel.label}\n </li>\n ))}\n {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n <li data-part=\"crosshair-price\" style={cursorStyle(cursorY)}>\n {crosshairCandle.close}\n </li>\n ) : null}\n </ol>\n </div>\n <table data-part=\"data\" aria-label={`${label} data`}>\n <thead>\n <tr>\n <th scope=\"col\">Time</th>\n <th scope=\"col\">Open</th>\n <th scope=\"col\">High</th>\n <th scope=\"col\">Low</th>\n <th scope=\"col\">Close</th>\n </tr>\n </thead>\n <tbody>\n {data.map((candle, index) => (\n <tr key={`${candle.time}-${index}`}>\n <th scope=\"row\">{String(candle.time)}</th>\n <td>{candle.open}</td>\n <td>{candle.high}</td>\n <td>{candle.low}</td>\n <td>{candle.close}</td>\n </tr>\n ))}\n </tbody>\n </table>\n </>\n ),\n },\n render,\n state: {},\n });\n}\nCandleChart.displayName = \"CandleChart\";\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/candle-chart/CandleChart.tsx"],"sourcesContent":["import type {\n CSSProperties,\n ElementType,\n KeyboardEvent,\n PointerEvent,\n ReactElement,\n ReactNode,\n} from \"react\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport { formatLabel } from \"@gunkin/uiify/core/format-label\";\nimport type {\n CandleChartAxisLabel,\n CandleChartCandleProps,\n CandleChartData,\n CandleChartProps,\n CandleChartViewProps,\n} from \"./types.js\";\n\nconst DEFAULT_CANDLE_CHART_LABELS = {\n chart: \"Candlestick chart\",\n candle: \"Candle {time}\",\n candles: \"candles\",\n months: \"months\",\n prices: \"prices\",\n data: \"data\",\n time: \"Time\",\n open: \"Open\",\n high: \"High\",\n low: \"Low\",\n close: \"Close\",\n} as const;\n\ninterface CandleStyle extends CSSProperties {\n \"--candle-body-height\": string;\n \"--candle-body-top\": string;\n \"--candle-slot\": string;\n \"--candle-wick-height\": string;\n \"--candle-wick-top\": string;\n \"--candle-x\": string;\n \"--candle-cursor-y\"?: string;\n}\n\ninterface CrosshairStyle extends CSSProperties {\n \"--candle-crosshair-x\": string;\n \"--candle-cursor-y\"?: string;\n}\n\ninterface CursorStyle extends CSSProperties {\n \"--candle-cursor-y\"?: string;\n}\n\ninterface AxisStyle extends CSSProperties {\n \"--candle-axis-x\"?: string;\n \"--candle-axis-y\"?: string;\n}\n\ntype CandleDirection = \"down\" | \"flat\" | \"up\";\n\ninterface CandleGeometry {\n readonly bodyHeight: string;\n readonly bodyTop: string;\n readonly direction: CandleDirection;\n readonly slot: string;\n readonly wickHeight: string;\n readonly wickTop: string;\n readonly x: string;\n}\n\nfunction percent(value: number): string {\n const rounded = Math.round(value * 10000) / 10000;\n return `${rounded}%`;\n}\n\nfunction valueToPercent(value: number, min: number, range: number): number {\n if (range === 0) return 50;\n return Math.min(100, Math.max(0, ((min + range - value) / range) * 100));\n}\n\nfunction directionFor(candle: CandleChartData): CandleDirection {\n if (candle.close > candle.open) return \"up\";\n if (candle.close < candle.open) return \"down\";\n return \"flat\";\n}\n\nexport function getPriceBounds(data: readonly CandleChartData[]): { max: number; min: number } {\n let min = Number.POSITIVE_INFINITY;\n let max = Number.NEGATIVE_INFINITY;\n\n for (const candle of data) {\n min = Math.min(min, candle.low);\n max = Math.max(max, candle.high);\n }\n\n if (data.length === 0) return { max: 1, min: 0 };\n return { max, min };\n}\n\ninterface AxisLabel {\n readonly label: ReactNode;\n readonly position: number;\n}\n\nfunction monthKey(time: string | number): string {\n const date = new Date(time);\n if (Number.isNaN(date.getTime())) return String(time);\n return `${date.getUTCFullYear()}-${date.getUTCMonth()}`;\n}\n\nfunction monthLabel(time: string | number, locale: string): string {\n const date = new Date(time);\n if (Number.isNaN(date.getTime())) return String(time);\n return new Intl.DateTimeFormat(locale, {\n month: \"short\",\n timeZone: \"UTC\",\n year: \"2-digit\",\n }).format(date);\n}\n\nfunction monthLabelsFor(data: readonly CandleChartData[], locale: string): AxisLabel[] {\n const labels: AxisLabel[] = [];\n const seen = new Set<string>();\n\n data.forEach((candle, index) => {\n const key = monthKey(candle.time);\n if (seen.has(key)) return;\n seen.add(key);\n labels.push({\n label: monthLabel(candle.time, locale),\n position: (index / Math.max(data.length, 1)) * 100,\n });\n });\n\n return labels;\n}\n\nfunction priceLabelsFor(min: number, max: number, locale: string): AxisLabel[] {\n const tickCount = 6;\n const range = max - min;\n\n return Array.from({ length: tickCount }, (_, index) => {\n const ratio = index / (tickCount - 1);\n const value = max - range * ratio;\n return {\n label: new Intl.NumberFormat(locale, { maximumFractionDigits: 2 }).format(value),\n position: ratio * 100,\n };\n });\n}\n\nfunction geometryFor(\n candle: CandleChartData,\n x: number,\n slot: number,\n min: number,\n max: number,\n): CandleGeometry {\n const range = max - min;\n const open = valueToPercent(candle.open, min, range);\n const close = valueToPercent(candle.close, min, range);\n const high = valueToPercent(candle.high, min, range);\n const low = valueToPercent(candle.low, min, range);\n\n return {\n bodyHeight: percent(Math.abs(close - open)),\n bodyTop: percent(Math.min(open, close)),\n direction: directionFor(candle),\n slot: percent(slot),\n wickHeight: percent(Math.max(0, low - high)),\n wickTop: percent(high),\n x: percent(x),\n };\n}\n\nfunction candleStyle(geometry: CandleGeometry, cursorY: number | undefined): CandleStyle {\n return {\n \"--candle-body-height\": geometry.bodyHeight,\n \"--candle-body-top\": geometry.bodyTop,\n \"--candle-slot\": geometry.slot,\n \"--candle-wick-height\": geometry.wickHeight,\n \"--candle-wick-top\": geometry.wickTop,\n \"--candle-x\": geometry.x,\n ...(cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` }),\n };\n}\n\nfunction crosshairStyle(index: number, count: number, cursorY: number | undefined): CrosshairStyle {\n return {\n \"--candle-crosshair-x\": percent(((index + 0.5) / Math.max(count, 1)) * 100),\n ...(cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` }),\n };\n}\n\nfunction cursorStyle(cursorY: number | undefined): CursorStyle {\n return cursorY === undefined ? {} : { \"--candle-cursor-y\": `${Math.max(0, cursorY)}px` };\n}\n\nfunction clampAxisPosition(position: number): number {\n return Math.min(100, Math.max(0, position));\n}\n\nfunction axisStyle(axis: \"x\" | \"y\", position: number): AxisStyle {\n const value = percent(clampAxisPosition(position));\n if (axis === \"x\") return { \"--candle-axis-x\": value };\n return { \"--candle-axis-y\": value };\n}\n\nfunction axisLabelsFor(\n overrides: readonly CandleChartAxisLabel[] | undefined,\n fallback: readonly AxisLabel[],\n): readonly AxisLabel[] {\n return overrides ?? fallback;\n}\n\n/** One candle glyph with its optional hit target; shared by the static list and virtual rows. */\nexport function CandleChartCandle({\n as: Tag,\n candle,\n hitLabel,\n index,\n x,\n slot,\n min,\n max,\n interactive,\n isActive,\n isSelected,\n cursorY,\n onCandleClick,\n onCandlePointerLeave,\n onCandlePointerMove,\n}: CandleChartCandleProps): ReactElement {\n const geometry = geometryFor(candle, x, slot, min, max);\n const handleKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {\n if (event.key !== \"Enter\" && event.key !== \" \") return;\n event.preventDefault();\n onCandleClick?.(index);\n };\n\n return (\n <Tag\n aria-hidden={interactive ? undefined : true}\n data-part=\"candle\"\n data-direction={geometry.direction}\n data-crosshair-active={interactive && isActive ? \"\" : undefined}\n data-time={String(candle.time)}\n style={candleStyle(geometry, isActive ? cursorY : undefined)}\n >\n {interactive ? (\n <button\n data-part=\"candle-hit\"\n type=\"button\"\n aria-label={hitLabel}\n aria-pressed={isSelected}\n onClick={() => onCandleClick?.(index)}\n onKeyDown={handleKeyDown}\n onPointerLeave={onCandlePointerLeave}\n onPointerMove={(event: PointerEvent<HTMLButtonElement>) =>\n onCandlePointerMove?.({ index, offsetY: event.nativeEvent.offsetY })\n }\n />\n ) : null}\n </Tag>\n );\n}\nCandleChartCandle.displayName = \"CandleChartCandle\";\n\nexport function CandleChart<TAs extends ElementType = \"figure\">(\n props: CandleChartProps<TAs>,\n): ReactElement | null {\n const {\n as,\n render,\n data,\n xAxis,\n yAxis,\n \"aria-label\": ariaLabel,\n labels,\n activeCandleIndex,\n cursorY,\n interactive = false,\n locale = \"en-US\",\n onCandleClick,\n onCandlePointerLeave,\n onCandlePointerMove,\n selectedCandleIndex,\n candleLayer,\n announceReadout = true,\n slotCount = data.length,\n slotOffset = 0,\n ...consumerProps\n } = props as CandleChartProps<\"figure\"> & CandleChartViewProps;\n const accessibleLabels = { ...DEFAULT_CANDLE_CHART_LABELS, ...labels };\n const { min, max } = getPriceBounds(data);\n const label = ariaLabel ?? accessibleLabels.chart;\n const monthLabels = axisLabelsFor(xAxis, monthLabelsFor(data, locale));\n const priceLabels = axisLabelsFor(yAxis, priceLabelsFor(min, max, locale));\n const readoutIndex =\n activeCandleIndex ?? selectedCandleIndex ?? (data.length > 0 ? data.length - 1 : undefined);\n const readoutCandle = readoutIndex === undefined ? undefined : data[readoutIndex];\n const crosshairCandle = activeCandleIndex === undefined ? undefined : data[activeCandleIndex];\n const candles = candleLayer ?? (\n <ol data-part=\"candles\" aria-label={`${label} ${accessibleLabels.candles}`}>\n {data.map((candle, index) => (\n <CandleChartCandle\n key={`${candle.time}-${index}`}\n as=\"li\"\n candle={candle}\n hitLabel={formatLabel(accessibleLabels.candle, { time: String(candle.time) }, locale)}\n index={index}\n x={(index / data.length) * 100}\n slot={100 / data.length}\n min={min}\n max={max}\n interactive={interactive}\n isActive={activeCandleIndex === index}\n isSelected={selectedCandleIndex === index}\n cursorY={cursorY}\n onCandleClick={onCandleClick}\n onCandlePointerLeave={onCandlePointerLeave}\n onCandlePointerMove={onCandlePointerMove}\n />\n ))}\n </ol>\n );\n\n return useRenderElement({\n as,\n defaultTag: \"figure\",\n props: {\n ...consumerProps,\n \"aria-label\": label,\n \"data-uiify-candle-chart\": \"\",\n \"data-interactive\": interactive ? \"\" : undefined,\n children: (\n <>\n <figcaption>{label}</figcaption>\n {interactive && readoutCandle ? (\n <div data-part=\"readout\" aria-live={announceReadout ? \"polite\" : \"off\"}>\n <span data-part=\"readout-time\">{String(readoutCandle.time)}</span>\n <span>O {readoutCandle.open}</span>\n <span>H {readoutCandle.high}</span>\n <span>L {readoutCandle.low}</span>\n <span>C {readoutCandle.close}</span>\n </div>\n ) : null}\n <div data-part=\"plot\" aria-hidden={interactive ? undefined : true}>\n <div data-part=\"scroll-viewport\">\n <div data-part=\"canvas\">\n <div data-part=\"viewport\">\n {candles}\n {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n <div\n data-part=\"crosshair\"\n aria-hidden=\"true\"\n style={crosshairStyle(slotOffset + activeCandleIndex, slotCount, cursorY)}\n >\n <span data-part=\"crosshair-marker\">+</span>\n </div>\n ) : null}\n </div>\n <div data-part=\"time-viewport\">\n <ol\n data-part=\"time-axis\"\n data-axis=\"time\"\n aria-label={`${label} ${accessibleLabels.months}`}\n >\n {monthLabels.map((axisLabel, index) => (\n <li\n key={`${axisLabel.position}-${index}`}\n style={axisStyle(\"x\", axisLabel.position)}\n >\n {axisLabel.label}\n </li>\n ))}\n {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n <li\n data-part=\"crosshair-time\"\n style={crosshairStyle(slotOffset + activeCandleIndex, slotCount, undefined)}\n >\n {String(crosshairCandle.time)}\n </li>\n ) : null}\n </ol>\n </div>\n </div>\n </div>\n <ol\n data-part=\"price-axis\"\n data-axis=\"price\"\n aria-label={`${label} ${accessibleLabels.prices}`}\n >\n {priceLabels.map((axisLabel, index) => (\n <li\n key={`${axisLabel.position}-${index}`}\n style={axisStyle(\"y\", axisLabel.position)}\n >\n {axisLabel.label}\n </li>\n ))}\n {interactive && crosshairCandle && activeCandleIndex !== undefined ? (\n <li data-part=\"crosshair-price\" style={cursorStyle(cursorY)}>\n {crosshairCandle.close}\n </li>\n ) : null}\n </ol>\n </div>\n <table data-part=\"data\" aria-label={`${label} ${accessibleLabels.data}`}>\n <thead>\n <tr>\n <th scope=\"col\">{accessibleLabels.time}</th>\n <th scope=\"col\">{accessibleLabels.open}</th>\n <th scope=\"col\">{accessibleLabels.high}</th>\n <th scope=\"col\">{accessibleLabels.low}</th>\n <th scope=\"col\">{accessibleLabels.close}</th>\n </tr>\n </thead>\n <tbody>\n {data.map((candle, index) => (\n <tr key={`${candle.time}-${index}`}>\n <th scope=\"row\">{String(candle.time)}</th>\n <td>{candle.open}</td>\n <td>{candle.high}</td>\n <td>{candle.low}</td>\n <td>{candle.close}</td>\n </tr>\n ))}\n </tbody>\n </table>\n </>\n ),\n },\n render,\n state: {},\n });\n}\nCandleChart.displayName = \"CandleChart\";\n"],"mappings":"AAwPQ,SAsFA,UAtFA,KA2FM,YA3FN;AAhPR,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAS5B,MAAM,8BAA8B;AAAA,EAClC,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,OAAO;AACT;AAsCA,SAAS,QAAQ,OAAuB;AACtC,QAAM,UAAU,KAAK,MAAM,QAAQ,GAAK,IAAI;AAC5C,SAAO,GAAG,OAAO;AACnB;AAEA,SAAS,eAAe,OAAe,KAAa,OAAuB;AACzE,MAAI,UAAU,EAAG,QAAO;AACxB,SAAO,KAAK,IAAI,KAAK,KAAK,IAAI,IAAK,MAAM,QAAQ,SAAS,QAAS,GAAG,CAAC;AACzE;AAEA,SAAS,aAAa,QAA0C;AAC9D,MAAI,OAAO,QAAQ,OAAO,KAAM,QAAO;AACvC,MAAI,OAAO,QAAQ,OAAO,KAAM,QAAO;AACvC,SAAO;AACT;AAEO,SAAS,eAAe,MAAgE;AAC7F,MAAI,MAAM,OAAO;AACjB,MAAI,MAAM,OAAO;AAEjB,aAAW,UAAU,MAAM;AACzB,UAAM,KAAK,IAAI,KAAK,OAAO,GAAG;AAC9B,UAAM,KAAK,IAAI,KAAK,OAAO,IAAI;AAAA,EACjC;AAEA,MAAI,KAAK,WAAW,EAAG,QAAO,EAAE,KAAK,GAAG,KAAK,EAAE;AAC/C,SAAO,EAAE,KAAK,IAAI;AACpB;AAOA,SAAS,SAAS,MAA+B;AAC/C,QAAM,OAAO,IAAI,KAAK,IAAI;AAC1B,MAAI,OAAO,MAAM,KAAK,QAAQ,CAAC,EAAG,QAAO,OAAO,IAAI;AACpD,SAAO,GAAG,KAAK,eAAe,CAAC,IAAI,KAAK,YAAY,CAAC;AACvD;AAEA,SAAS,WAAW,MAAuB,QAAwB;AACjE,QAAM,OAAO,IAAI,KAAK,IAAI;AAC1B,MAAI,OAAO,MAAM,KAAK,QAAQ,CAAC,EAAG,QAAO,OAAO,IAAI;AACpD,SAAO,IAAI,KAAK,eAAe,QAAQ;AAAA,IACrC,OAAO;AAAA,IACP,UAAU;AAAA,IACV,MAAM;AAAA,EACR,CAAC,EAAE,OAAO,IAAI;AAChB;AAEA,SAAS,eAAe,MAAkC,QAA6B;AACrF,QAAM,SAAsB,CAAC;AAC7B,QAAM,OAAO,oBAAI,IAAY;AAE7B,OAAK,QAAQ,CAAC,QAAQ,UAAU;AAC9B,UAAM,MAAM,SAAS,OAAO,IAAI;AAChC,QAAI,KAAK,IAAI,GAAG,EAAG;AACnB,SAAK,IAAI,GAAG;AACZ,WAAO,KAAK;AAAA,MACV,OAAO,WAAW,OAAO,MAAM,MAAM;AAAA,MACrC,UAAW,QAAQ,KAAK,IAAI,KAAK,QAAQ,CAAC,IAAK;AAAA,IACjD,CAAC;AAAA,EACH,CAAC;AAED,SAAO;AACT;AAEA,SAAS,eAAe,KAAa,KAAa,QAA6B;AAC7E,QAAM,YAAY;AAClB,QAAM,QAAQ,MAAM;AAEpB,SAAO,MAAM,KAAK,EAAE,QAAQ,UAAU,GAAG,CAAC,GAAG,UAAU;AACrD,UAAM,QAAQ,SAAS,YAAY;AACnC,UAAM,QAAQ,MAAM,QAAQ;AAC5B,WAAO;AAAA,MACL,OAAO,IAAI,KAAK,aAAa,QAAQ,EAAE,uBAAuB,EAAE,CAAC,EAAE,OAAO,KAAK;AAAA,MAC/E,UAAU,QAAQ;AAAA,IACpB;AAAA,EACF,CAAC;AACH;AAEA,SAAS,YACP,QACA,GACA,MACA,KACA,KACgB;AAChB,QAAM,QAAQ,MAAM;AACpB,QAAM,OAAO,eAAe,OAAO,MAAM,KAAK,KAAK;AACnD,QAAM,QAAQ,eAAe,OAAO,OAAO,KAAK,KAAK;AACrD,QAAM,OAAO,eAAe,OAAO,MAAM,KAAK,KAAK;AACnD,QAAM,MAAM,eAAe,OAAO,KAAK,KAAK,KAAK;AAEjD,SAAO;AAAA,IACL,YAAY,QAAQ,KAAK,IAAI,QAAQ,IAAI,CAAC;AAAA,IAC1C,SAAS,QAAQ,KAAK,IAAI,MAAM,KAAK,CAAC;AAAA,IACtC,WAAW,aAAa,MAAM;AAAA,IAC9B,MAAM,QAAQ,IAAI;AAAA,IAClB,YAAY,QAAQ,KAAK,IAAI,GAAG,MAAM,IAAI,CAAC;AAAA,IAC3C,SAAS,QAAQ,IAAI;AAAA,IACrB,GAAG,QAAQ,CAAC;AAAA,EACd;AACF;AAEA,SAAS,YAAY,UAA0B,SAA0C;AACvF,SAAO;AAAA,IACL,wBAAwB,SAAS;AAAA,IACjC,qBAAqB,SAAS;AAAA,IAC9B,iBAAiB,SAAS;AAAA,IAC1B,wBAAwB,SAAS;AAAA,IACjC,qBAAqB,SAAS;AAAA,IAC9B,cAAc,SAAS;AAAA,IACvB,GAAI,YAAY,SAAY,CAAC,IAAI,EAAE,qBAAqB,GAAG,KAAK,IAAI,GAAG,OAAO,CAAC,KAAK;AAAA,EACtF;AACF;AAEA,SAAS,eAAe,OAAe,OAAe,SAA6C;AACjG,SAAO;AAAA,IACL,wBAAwB,SAAU,QAAQ,OAAO,KAAK,IAAI,OAAO,CAAC,IAAK,GAAG;AAAA,IAC1E,GAAI,YAAY,SAAY,CAAC,IAAI,EAAE,qBAAqB,GAAG,KAAK,IAAI,GAAG,OAAO,CAAC,KAAK;AAAA,EACtF;AACF;AAEA,SAAS,YAAY,SAA0C;AAC7D,SAAO,YAAY,SAAY,CAAC,IAAI,EAAE,qBAAqB,GAAG,KAAK,IAAI,GAAG,OAAO,CAAC,KAAK;AACzF;AAEA,SAAS,kBAAkB,UAA0B;AACnD,SAAO,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,QAAQ,CAAC;AAC5C;AAEA,SAAS,UAAU,MAAiB,UAA6B;AAC/D,QAAM,QAAQ,QAAQ,kBAAkB,QAAQ,CAAC;AACjD,MAAI,SAAS,IAAK,QAAO,EAAE,mBAAmB,MAAM;AACpD,SAAO,EAAE,mBAAmB,MAAM;AACpC;AAEA,SAAS,cACP,WACA,UACsB;AACtB,SAAO,aAAa;AACtB;AAGO,SAAS,kBAAkB;AAAA,EAChC,IAAI;AAAA,EACJ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAyC;AACvC,QAAM,WAAW,YAAY,QAAQ,GAAG,MAAM,KAAK,GAAG;AACtD,QAAM,gBAAgB,CAAC,UAA4C;AACjE,QAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,IAAK;AAChD,UAAM,eAAe;AACrB,oBAAgB,KAAK;AAAA,EACvB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,cAAc,SAAY;AAAA,MACvC,aAAU;AAAA,MACV,kBAAgB,SAAS;AAAA,MACzB,yBAAuB,eAAe,WAAW,KAAK;AAAA,MACtD,aAAW,OAAO,OAAO,IAAI;AAAA,MAC7B,OAAO,YAAY,UAAU,WAAW,UAAU,MAAS;AAAA,MAE1D,wBACC;AAAA,QAAC;AAAA;AAAA,UACC,aAAU;AAAA,UACV,MAAK;AAAA,UACL,cAAY;AAAA,UACZ,gBAAc;AAAA,UACd,SAAS,MAAM,gBAAgB,KAAK;AAAA,UACpC,WAAW;AAAA,UACX,gBAAgB;AAAA,UAChB,eAAe,CAAC,UACd,sBAAsB,EAAE,OAAO,SAAS,MAAM,YAAY,QAAQ,CAAC;AAAA;AAAA,MAEvE,IACE;AAAA;AAAA,EACN;AAEJ;AACA,kBAAkB,cAAc;AAEzB,SAAS,YACd,OACqB;AACrB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB,YAAY,KAAK;AAAA,IACjB,aAAa;AAAA,IACb,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,mBAAmB,EAAE,GAAG,6BAA6B,GAAG,OAAO;AACrE,QAAM,EAAE,KAAK,IAAI,IAAI,eAAe,IAAI;AACxC,QAAM,QAAQ,aAAa,iBAAiB;AAC5C,QAAM,cAAc,cAAc,OAAO,eAAe,MAAM,MAAM,CAAC;AACrE,QAAM,cAAc,cAAc,OAAO,eAAe,KAAK,KAAK,MAAM,CAAC;AACzE,QAAM,eACJ,qBAAqB,wBAAwB,KAAK,SAAS,IAAI,KAAK,SAAS,IAAI;AACnF,QAAM,gBAAgB,iBAAiB,SAAY,SAAY,KAAK,YAAY;AAChF,QAAM,kBAAkB,sBAAsB,SAAY,SAAY,KAAK,iBAAiB;AAC5F,QAAM,UAAU,eACd,oBAAC,QAAG,aAAU,WAAU,cAAY,GAAG,KAAK,IAAI,iBAAiB,OAAO,IACrE,eAAK,IAAI,CAAC,QAAQ,UACjB;AAAA,IAAC;AAAA;AAAA,MAEC,IAAG;AAAA,MACH;AAAA,MACA,UAAU,YAAY,iBAAiB,QAAQ,EAAE,MAAM,OAAO,OAAO,IAAI,EAAE,GAAG,MAAM;AAAA,MACpF;AAAA,MACA,GAAI,QAAQ,KAAK,SAAU;AAAA,MAC3B,MAAM,MAAM,KAAK;AAAA,MACjB;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU,sBAAsB;AAAA,MAChC,YAAY,wBAAwB;AAAA,MACpC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAfK,GAAG,OAAO,IAAI,IAAI,KAAK;AAAA,EAgB9B,CACD,GACH;AAGF,SAAO,iBAAiB;AAAA,IACtB;AAAA,IACA,YAAY;AAAA,IACZ,OAAO;AAAA,MACL,GAAG;AAAA,MACH,cAAc;AAAA,MACd,2BAA2B;AAAA,MAC3B,oBAAoB,cAAc,KAAK;AAAA,MACvC,UACE,iCACE;AAAA,4BAAC,gBAAY,iBAAM;AAAA,QAClB,eAAe,gBACd,qBAAC,SAAI,aAAU,WAAU,aAAW,kBAAkB,WAAW,OAC/D;AAAA,8BAAC,UAAK,aAAU,gBAAgB,iBAAO,cAAc,IAAI,GAAE;AAAA,UAC3D,qBAAC,UAAK;AAAA;AAAA,YAAG,cAAc;AAAA,aAAK;AAAA,UAC5B,qBAAC,UAAK;AAAA;AAAA,YAAG,cAAc;AAAA,aAAK;AAAA,UAC5B,qBAAC,UAAK;AAAA;AAAA,YAAG,cAAc;AAAA,aAAI;AAAA,UAC3B,qBAAC,UAAK;AAAA;AAAA,YAAG,cAAc;AAAA,aAAM;AAAA,WAC/B,IACE;AAAA,QACJ,qBAAC,SAAI,aAAU,QAAO,eAAa,cAAc,SAAY,MAC3D;AAAA,8BAAC,SAAI,aAAU,mBACb,+BAAC,SAAI,aAAU,UACb;AAAA,iCAAC,SAAI,aAAU,YACZ;AAAA;AAAA,cACA,eAAe,mBAAmB,sBAAsB,SACvD;AAAA,gBAAC;AAAA;AAAA,kBACC,aAAU;AAAA,kBACV,eAAY;AAAA,kBACZ,OAAO,eAAe,aAAa,mBAAmB,WAAW,OAAO;AAAA,kBAExE,8BAAC,UAAK,aAAU,oBAAmB,eAAC;AAAA;AAAA,cACtC,IACE;AAAA,eACN;AAAA,YACA,oBAAC,SAAI,aAAU,iBACb;AAAA,cAAC;AAAA;AAAA,gBACC,aAAU;AAAA,gBACV,aAAU;AAAA,gBACV,cAAY,GAAG,KAAK,IAAI,iBAAiB,MAAM;AAAA,gBAE9C;AAAA,8BAAY,IAAI,CAAC,WAAW,UAC3B;AAAA,oBAAC;AAAA;AAAA,sBAEC,OAAO,UAAU,KAAK,UAAU,QAAQ;AAAA,sBAEvC,oBAAU;AAAA;AAAA,oBAHN,GAAG,UAAU,QAAQ,IAAI,KAAK;AAAA,kBAIrC,CACD;AAAA,kBACA,eAAe,mBAAmB,sBAAsB,SACvD;AAAA,oBAAC;AAAA;AAAA,sBACC,aAAU;AAAA,sBACV,OAAO,eAAe,aAAa,mBAAmB,WAAW,MAAS;AAAA,sBAEzE,iBAAO,gBAAgB,IAAI;AAAA;AAAA,kBAC9B,IACE;AAAA;AAAA;AAAA,YACN,GACF;AAAA,aACF,GACF;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,aAAU;AAAA,cACV,aAAU;AAAA,cACV,cAAY,GAAG,KAAK,IAAI,iBAAiB,MAAM;AAAA,cAE9C;AAAA,4BAAY,IAAI,CAAC,WAAW,UAC3B;AAAA,kBAAC;AAAA;AAAA,oBAEC,OAAO,UAAU,KAAK,UAAU,QAAQ;AAAA,oBAEvC,oBAAU;AAAA;AAAA,kBAHN,GAAG,UAAU,QAAQ,IAAI,KAAK;AAAA,gBAIrC,CACD;AAAA,gBACA,eAAe,mBAAmB,sBAAsB,SACvD,oBAAC,QAAG,aAAU,mBAAkB,OAAO,YAAY,OAAO,GACvD,0BAAgB,OACnB,IACE;AAAA;AAAA;AAAA,UACN;AAAA,WACF;AAAA,QACA,qBAAC,WAAM,aAAU,QAAO,cAAY,GAAG,KAAK,IAAI,iBAAiB,IAAI,IACnE;AAAA,8BAAC,WACC,+BAAC,QACC;AAAA,gCAAC,QAAG,OAAM,OAAO,2BAAiB,MAAK;AAAA,YACvC,oBAAC,QAAG,OAAM,OAAO,2BAAiB,MAAK;AAAA,YACvC,oBAAC,QAAG,OAAM,OAAO,2BAAiB,MAAK;AAAA,YACvC,oBAAC,QAAG,OAAM,OAAO,2BAAiB,KAAI;AAAA,YACtC,oBAAC,QAAG,OAAM,OAAO,2BAAiB,OAAM;AAAA,aAC1C,GACF;AAAA,UACA,oBAAC,WACE,eAAK,IAAI,CAAC,QAAQ,UACjB,qBAAC,QACC;AAAA,gCAAC,QAAG,OAAM,OAAO,iBAAO,OAAO,IAAI,GAAE;AAAA,YACrC,oBAAC,QAAI,iBAAO,MAAK;AAAA,YACjB,oBAAC,QAAI,iBAAO,MAAK;AAAA,YACjB,oBAAC,QAAI,iBAAO,KAAI;AAAA,YAChB,oBAAC,QAAI,iBAAO,OAAM;AAAA,eALX,GAAG,OAAO,IAAI,IAAI,KAAK,EAMhC,CACD,GACH;AAAA,WACF;AAAA,SACF;AAAA,IAEJ;AAAA,IACA;AAAA,IACA,OAAO,CAAC;AAAA,EACV,CAAC;AACH;AACA,YAAY,cAAc;","names":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CandleChartClient.d.ts","sourceRoot":"","sources":["../../../../src/components/candle-chart/client/CandleChartClient.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAiB,WAAW,EAAE,YAAY,EAAO,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CandleChartClient.d.ts","sourceRoot":"","sources":["../../../../src/components/candle-chart/client/CandleChartClient.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAiB,WAAW,EAAE,YAAY,EAAO,MAAM,OAAO,CAAC;AAG3E,OAAO,KAAK,EACV,sBAAsB,EAKvB,MAAM,aAAa,CAAC;AA+BrB,wBAAgB,iBAAiB,CAAC,GAAG,SAAS,WAAW,GAAG,QAAQ,EAClE,KAAK,EAAE,sBAAsB,CAAC,GAAG,CAAC,GACjC,YAAY,GAAG,IAAI,CAsJrB;yBAxJe,iBAAiB"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import { useCallback, useMemo, useState } from "react";
|
|
4
|
+
import { formatLabel } from "@gunkin/uiify/core/format-label";
|
|
4
5
|
import { CandleChart, CandleChartCandle, getPriceBounds } from "../CandleChart.js";
|
|
5
6
|
import { VirtualScroll } from "../../virtual-scroll/VirtualScroll.js";
|
|
6
7
|
import {
|
|
@@ -17,6 +18,7 @@ function CandleChartClient(props) {
|
|
|
17
18
|
data,
|
|
18
19
|
visibleCount,
|
|
19
20
|
xAxis,
|
|
21
|
+
labels,
|
|
20
22
|
ref: consumerRef,
|
|
21
23
|
style: consumerStyle,
|
|
22
24
|
onCandleClick: consumerOnCandleClick,
|
|
@@ -76,6 +78,7 @@ function CandleChartClient(props) {
|
|
|
76
78
|
...consumerProps,
|
|
77
79
|
...xAxis ? { xAxis } : {},
|
|
78
80
|
data,
|
|
81
|
+
labels,
|
|
79
82
|
activeCandleIndex: cursor?.index,
|
|
80
83
|
cursorY: cursor?.offsetY,
|
|
81
84
|
interactive: true,
|
|
@@ -110,6 +113,7 @@ function CandleChartClient(props) {
|
|
|
110
113
|
{
|
|
111
114
|
as: "div",
|
|
112
115
|
candle,
|
|
116
|
+
hitLabel: formatLabel(labels?.candle ?? "Candle {time}", { time: String(candle.time) }),
|
|
113
117
|
index,
|
|
114
118
|
x: 0,
|
|
115
119
|
slot: 100,
|
|
@@ -135,6 +139,7 @@ function CandleChartClient(props) {
|
|
|
135
139
|
const chartProps = {
|
|
136
140
|
...consumerProps,
|
|
137
141
|
data: slice,
|
|
142
|
+
labels,
|
|
138
143
|
xAxis: xAxis ?? liveTimeAxis(data, sliceStart, sliceEnd, visibleCount),
|
|
139
144
|
activeCandleIndex: toSliceIndex(cursor?.index),
|
|
140
145
|
announceReadout: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/candle-chart/client/CandleChartClient.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useMemo, useState } from \"react\";\nimport type { CSSProperties, ElementType, ReactElement, Ref } from \"react\";\nimport { CandleChart, CandleChartCandle, getPriceBounds } from \"../CandleChart.js\";\nimport type {\n CandleChartClientProps,\n CandleChartData,\n CandleChartPointerPosition,\n CandleChartProps,\n CandleChartViewProps,\n} from \"../types.js\";\nimport { VirtualScroll } from \"../../virtual-scroll/VirtualScroll.js\";\nimport {\n liveTimeAxis,\n useLiveChartWindow,\n} from \"../../internal/live-chart/use-live-chart-window.js\";\nimport { useScrollbarReserve } from \"../../internal/chart-scrollbar/use-scrollbar-reserve.js\";\nimport { useChartViewport } from \"../../../hooks/use-chart-viewport.js\";\nimport { useMergedRefs } from \"../../../hooks/use-merged-refs.js\";\nimport { useResizeObserver } from \"../../../hooks/use-resize-observer.js\";\n\ninterface InteractiveCandleStyle extends CSSProperties {\n \"--candle-scale\": string;\n \"--candle-content-size\"?: string;\n \"--candle-plot-height\"?: string;\n}\n\ninterface CursorState extends CandleChartPointerPosition {}\n\ninterface LiveCandle {\n readonly id: string;\n readonly candle: CandleChartData;\n}\n\n/**\n * `[data-part=\"plot\"]`'s fixed price-axis column (4.5rem) plus its grid gap\n * (0.75rem) — see candle-chart.css. `useChartViewport` measures the whole\n * `<figure>`, but candles only ever get the width left over after this\n * column, so it must be subtracted before sizing `minItemWidth`.\n */\nconst Y_AXIS_COLUMN_WIDTH = 72 + 12;\nexport function CandleChartClient<TAs extends ElementType = \"figure\">(\n props: CandleChartClientProps<TAs>,\n): ReactElement | null {\n const {\n data,\n visibleCount,\n xAxis,\n ref: consumerRef,\n style: consumerStyle,\n onCandleClick: consumerOnCandleClick,\n onCandlePointerLeave: consumerOnCandlePointerLeave,\n onCandlePointerMove: consumerOnCandlePointerMove,\n ...consumerProps\n } = props as CandleChartClientProps<\"figure\"> & {\n ref?: Ref<HTMLElement>;\n style?: CSSProperties;\n };\n const live = visibleCount !== undefined && visibleCount > 0;\n const viewport = useChartViewport(\n live\n ? {\n enabled: false,\n initialScale: 1,\n itemCount: visibleCount,\n measuredWidthOffset: Y_AXIS_COLUMN_WIDTH,\n }\n : { itemCount: data.length, measuredWidthOffset: Y_AXIS_COLUMN_WIDTH, minItemWidth: 24 },\n );\n const figureSize = useResizeObserver(viewport.ref);\n const liveWindow = useLiveChartWindow({\n count: data.length,\n visibleCount,\n itemWidth: viewport.itemWidth,\n figureHeight: figureSize?.height,\n scrollVariable: \"--candle-scroll-x\",\n });\n useScrollbarReserve(liveWindow.chartRef, \"--candle-scrollbar-size\");\n // Cursor and selection hold absolute indices so they survive scrolling and appends.\n const [cursor, setCursor] = useState<CursorState | null>(null);\n const [selectedCandleIndex, setSelectedCandleIndex] = useState<number | undefined>();\n const chartRef = useMergedRefs<HTMLElement>(viewport.ref, consumerRef, liveWindow.chartRef);\n const handleCandleClick = useCallback(\n (index: number) => {\n setSelectedCandleIndex(index);\n consumerOnCandleClick?.(index);\n },\n [consumerOnCandleClick],\n );\n const handleCandlePointerLeave = useCallback(() => {\n setCursor(null);\n consumerOnCandlePointerLeave?.();\n }, [consumerOnCandlePointerLeave]);\n const handleCandlePointerMove = useCallback(\n (position: CandleChartPointerPosition) => {\n setCursor(position);\n consumerOnCandlePointerMove?.(position);\n },\n [consumerOnCandlePointerMove],\n );\n const liveItems = useMemo<readonly LiveCandle[]>(\n () => (live ? data.map((candle, index) => ({ id: String(index), candle })) : []),\n [data, live],\n );\n const style: InteractiveCandleStyle = {\n ...consumerStyle,\n \"--candle-scale\": String(viewport.scale),\n };\n\n if (!live) {\n const chartProps = {\n ...consumerProps,\n ...(xAxis ? { xAxis } : {}),\n data,\n activeCandleIndex: cursor?.index,\n cursorY: cursor?.offsetY,\n interactive: true,\n onCandleClick: handleCandleClick,\n onCandlePointerLeave: handleCandlePointerLeave,\n onCandlePointerMove: handleCandlePointerMove,\n ref: chartRef,\n selectedCandleIndex,\n style,\n } as CandleChartProps<\"figure\">;\n return <CandleChart {...chartProps} />;\n }\n\n const { sliceStart, sliceEnd, contentSize, plotHeight } = liveWindow;\n const slice = data.slice(sliceStart, sliceEnd);\n const { min, max } = getPriceBounds(slice);\n const toSliceIndex = (index: number | undefined): number | undefined =>\n index !== undefined && index >= sliceStart && index < sliceEnd ? index - sliceStart : undefined;\n const candleLayer = (\n <VirtualScroll\n height={plotHeight}\n items={liveItems}\n orientation=\"horizontal\"\n overscan={2}\n rowHeight={viewport.itemWidth}\n scrollRef={liveWindow.scrollRef}\n onRangeChange={liveWindow.onRangeChange}\n renderRow={({ candle }, index) => {\n // Overscan candles stay inert, so focus never scrolls hidden candles into view.\n const inSlice = index >= sliceStart && index < sliceEnd;\n const isActive = cursor?.index === index;\n return (\n <CandleChartCandle\n as=\"div\"\n candle={candle}\n index={index}\n x={0}\n slot={100}\n min={min}\n max={max}\n interactive={inSlice}\n isActive={isActive}\n isSelected={selectedCandleIndex === index}\n cursorY={isActive ? cursor?.offsetY : undefined}\n onCandleClick={handleCandleClick}\n onCandlePointerLeave={handleCandlePointerLeave}\n onCandlePointerMove={handleCandlePointerMove}\n />\n );\n }}\n />\n );\n\n const liveStyle: InteractiveCandleStyle = {\n ...style,\n \"--candle-content-size\": `${contentSize}px`,\n \"--candle-plot-height\": `${plotHeight}px`,\n };\n const chartProps = {\n ...consumerProps,\n data: slice,\n xAxis: xAxis ?? liveTimeAxis(data, sliceStart, sliceEnd, visibleCount),\n activeCandleIndex: toSliceIndex(cursor?.index),\n announceReadout: false,\n candleLayer,\n cursorY: cursor?.offsetY,\n interactive: true,\n ref: chartRef,\n selectedCandleIndex: toSliceIndex(selectedCandleIndex),\n slotCount: data.length,\n slotOffset: sliceStart,\n style: liveStyle,\n } as CandleChartProps<\"figure\"> & CandleChartViewProps;\n\n return <CandleChart {...chartProps} />;\n}\nCandleChartClient.displayName = \"CandleChartClient\";\n"],"mappings":"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","names":["chartProps"]}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/candle-chart/client/CandleChartClient.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallback, useMemo, useState } from \"react\";\nimport type { CSSProperties, ElementType, ReactElement, Ref } from \"react\";\nimport { formatLabel } from \"@gunkin/uiify/core/format-label\";\nimport { CandleChart, CandleChartCandle, getPriceBounds } from \"../CandleChart.js\";\nimport type {\n CandleChartClientProps,\n CandleChartData,\n CandleChartPointerPosition,\n CandleChartProps,\n CandleChartViewProps,\n} from \"../types.js\";\nimport { VirtualScroll } from \"../../virtual-scroll/VirtualScroll.js\";\nimport {\n liveTimeAxis,\n useLiveChartWindow,\n} from \"../../internal/live-chart/use-live-chart-window.js\";\nimport { useScrollbarReserve } from \"../../internal/chart-scrollbar/use-scrollbar-reserve.js\";\nimport { useChartViewport } from \"../../../hooks/use-chart-viewport.js\";\nimport { useMergedRefs } from \"../../../hooks/use-merged-refs.js\";\nimport { useResizeObserver } from \"../../../hooks/use-resize-observer.js\";\n\ninterface InteractiveCandleStyle extends CSSProperties {\n \"--candle-scale\": string;\n \"--candle-content-size\"?: string;\n \"--candle-plot-height\"?: string;\n}\n\ninterface CursorState extends CandleChartPointerPosition {}\n\ninterface LiveCandle {\n readonly id: string;\n readonly candle: CandleChartData;\n}\n\n/**\n * `[data-part=\"plot\"]`'s fixed price-axis column (4.5rem) plus its grid gap\n * (0.75rem) — see candle-chart.css. `useChartViewport` measures the whole\n * `<figure>`, but candles only ever get the width left over after this\n * column, so it must be subtracted before sizing `minItemWidth`.\n */\nconst Y_AXIS_COLUMN_WIDTH = 72 + 12;\nexport function CandleChartClient<TAs extends ElementType = \"figure\">(\n props: CandleChartClientProps<TAs>,\n): ReactElement | null {\n const {\n data,\n visibleCount,\n xAxis,\n labels,\n ref: consumerRef,\n style: consumerStyle,\n onCandleClick: consumerOnCandleClick,\n onCandlePointerLeave: consumerOnCandlePointerLeave,\n onCandlePointerMove: consumerOnCandlePointerMove,\n ...consumerProps\n } = props as CandleChartClientProps<\"figure\"> & {\n ref?: Ref<HTMLElement>;\n style?: CSSProperties;\n };\n const live = visibleCount !== undefined && visibleCount > 0;\n const viewport = useChartViewport(\n live\n ? {\n enabled: false,\n initialScale: 1,\n itemCount: visibleCount,\n measuredWidthOffset: Y_AXIS_COLUMN_WIDTH,\n }\n : { itemCount: data.length, measuredWidthOffset: Y_AXIS_COLUMN_WIDTH, minItemWidth: 24 },\n );\n const figureSize = useResizeObserver(viewport.ref);\n const liveWindow = useLiveChartWindow({\n count: data.length,\n visibleCount,\n itemWidth: viewport.itemWidth,\n figureHeight: figureSize?.height,\n scrollVariable: \"--candle-scroll-x\",\n });\n useScrollbarReserve(liveWindow.chartRef, \"--candle-scrollbar-size\");\n // Cursor and selection hold absolute indices so they survive scrolling and appends.\n const [cursor, setCursor] = useState<CursorState | null>(null);\n const [selectedCandleIndex, setSelectedCandleIndex] = useState<number | undefined>();\n const chartRef = useMergedRefs<HTMLElement>(viewport.ref, consumerRef, liveWindow.chartRef);\n const handleCandleClick = useCallback(\n (index: number) => {\n setSelectedCandleIndex(index);\n consumerOnCandleClick?.(index);\n },\n [consumerOnCandleClick],\n );\n const handleCandlePointerLeave = useCallback(() => {\n setCursor(null);\n consumerOnCandlePointerLeave?.();\n }, [consumerOnCandlePointerLeave]);\n const handleCandlePointerMove = useCallback(\n (position: CandleChartPointerPosition) => {\n setCursor(position);\n consumerOnCandlePointerMove?.(position);\n },\n [consumerOnCandlePointerMove],\n );\n const liveItems = useMemo<readonly LiveCandle[]>(\n () => (live ? data.map((candle, index) => ({ id: String(index), candle })) : []),\n [data, live],\n );\n const style: InteractiveCandleStyle = {\n ...consumerStyle,\n \"--candle-scale\": String(viewport.scale),\n };\n\n if (!live) {\n const chartProps = {\n ...consumerProps,\n ...(xAxis ? { xAxis } : {}),\n data,\n labels,\n activeCandleIndex: cursor?.index,\n cursorY: cursor?.offsetY,\n interactive: true,\n onCandleClick: handleCandleClick,\n onCandlePointerLeave: handleCandlePointerLeave,\n onCandlePointerMove: handleCandlePointerMove,\n ref: chartRef,\n selectedCandleIndex,\n style,\n } as CandleChartProps<\"figure\">;\n return <CandleChart {...chartProps} />;\n }\n\n const { sliceStart, sliceEnd, contentSize, plotHeight } = liveWindow;\n const slice = data.slice(sliceStart, sliceEnd);\n const { min, max } = getPriceBounds(slice);\n const toSliceIndex = (index: number | undefined): number | undefined =>\n index !== undefined && index >= sliceStart && index < sliceEnd ? index - sliceStart : undefined;\n const candleLayer = (\n <VirtualScroll\n height={plotHeight}\n items={liveItems}\n orientation=\"horizontal\"\n overscan={2}\n rowHeight={viewport.itemWidth}\n scrollRef={liveWindow.scrollRef}\n onRangeChange={liveWindow.onRangeChange}\n renderRow={({ candle }, index) => {\n // Overscan candles stay inert, so focus never scrolls hidden candles into view.\n const inSlice = index >= sliceStart && index < sliceEnd;\n const isActive = cursor?.index === index;\n return (\n <CandleChartCandle\n as=\"div\"\n candle={candle}\n hitLabel={formatLabel(labels?.candle ?? \"Candle {time}\", { time: String(candle.time) })}\n index={index}\n x={0}\n slot={100}\n min={min}\n max={max}\n interactive={inSlice}\n isActive={isActive}\n isSelected={selectedCandleIndex === index}\n cursorY={isActive ? cursor?.offsetY : undefined}\n onCandleClick={handleCandleClick}\n onCandlePointerLeave={handleCandlePointerLeave}\n onCandlePointerMove={handleCandlePointerMove}\n />\n );\n }}\n />\n );\n\n const liveStyle: InteractiveCandleStyle = {\n ...style,\n \"--candle-content-size\": `${contentSize}px`,\n \"--candle-plot-height\": `${plotHeight}px`,\n };\n const chartProps = {\n ...consumerProps,\n data: slice,\n labels,\n xAxis: xAxis ?? liveTimeAxis(data, sliceStart, sliceEnd, visibleCount),\n activeCandleIndex: toSliceIndex(cursor?.index),\n announceReadout: false,\n candleLayer,\n cursorY: cursor?.offsetY,\n interactive: true,\n ref: chartRef,\n selectedCandleIndex: toSliceIndex(selectedCandleIndex),\n slotCount: data.length,\n slotOffset: sliceStart,\n style: liveStyle,\n } as CandleChartProps<\"figure\"> & CandleChartViewProps;\n\n return <CandleChart {...chartProps} />;\n}\nCandleChartClient.displayName = \"CandleChartClient\";\n"],"mappings":"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","names":["chartProps"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export { CandleChart } from "./CandleChart.js";
|
|
2
|
-
export type { CandleChartAxisLabel, CandleChartData, CandleChartOwnProps, CandleChartPointerPosition, CandleChartProps, } from "./types.js";
|
|
2
|
+
export type { CandleChartAxisLabel, CandleChartLabels, CandleChartData, CandleChartOwnProps, CandleChartPointerPosition, CandleChartProps, } from "./types.js";
|
|
3
3
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/candle-chart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,YAAY,EACV,oBAAoB,EACpB,eAAe,EACf,mBAAmB,EACnB,0BAA0B,EAC1B,gBAAgB,GACjB,MAAM,YAAY,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/candle-chart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,YAAY,EACV,oBAAoB,EACpB,iBAAiB,EACjB,eAAe,EACf,mBAAmB,EACnB,0BAA0B,EAC1B,gBAAgB,GACjB,MAAM,YAAY,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/candle-chart/index.ts"],"sourcesContent":["export { CandleChart } from \"./CandleChart.js\";\nexport type {\n CandleChartAxisLabel,\n CandleChartData,\n CandleChartOwnProps,\n CandleChartPointerPosition,\n CandleChartProps,\n} from \"./types.js\";\n"],"mappings":"AAAA,SAAS,mBAAmB;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/candle-chart/index.ts"],"sourcesContent":["export { CandleChart } from \"./CandleChart.js\";\nexport type {\n CandleChartAxisLabel,\n CandleChartLabels,\n CandleChartData,\n CandleChartOwnProps,\n CandleChartPointerPosition,\n CandleChartProps,\n} from \"./types.js\";\n"],"mappings":"AAAA,SAAS,mBAAmB;","names":[]}
|
|
@@ -19,10 +19,13 @@ export interface CandleChartPointerPosition {
|
|
|
19
19
|
}
|
|
20
20
|
export interface CandleChartOwnProps {
|
|
21
21
|
readonly "aria-label"?: string;
|
|
22
|
+
readonly labels?: Partial<CandleChartLabels>;
|
|
22
23
|
readonly activeCandleIndex?: number;
|
|
23
24
|
readonly cursorY?: number;
|
|
24
25
|
readonly data: readonly CandleChartData[];
|
|
25
26
|
readonly interactive?: boolean;
|
|
27
|
+
/** BCP 47 locale for default axis labels. Defaults to `"en-US"`. */
|
|
28
|
+
readonly locale?: string;
|
|
26
29
|
readonly onCandleClick?: (index: number) => void;
|
|
27
30
|
readonly onCandlePointerLeave?: () => void;
|
|
28
31
|
readonly onCandlePointerMove?: (position: CandleChartPointerPosition) => void;
|
|
@@ -30,6 +33,19 @@ export interface CandleChartOwnProps {
|
|
|
30
33
|
readonly xAxis?: readonly CandleChartAxisLabel[];
|
|
31
34
|
readonly yAxis?: readonly CandleChartAxisLabel[];
|
|
32
35
|
}
|
|
36
|
+
export interface CandleChartLabels {
|
|
37
|
+
readonly chart: string;
|
|
38
|
+
readonly candle: string;
|
|
39
|
+
readonly candles: string;
|
|
40
|
+
readonly months: string;
|
|
41
|
+
readonly prices: string;
|
|
42
|
+
readonly data: string;
|
|
43
|
+
readonly time: string;
|
|
44
|
+
readonly open: string;
|
|
45
|
+
readonly high: string;
|
|
46
|
+
readonly low: string;
|
|
47
|
+
readonly close: string;
|
|
48
|
+
}
|
|
33
49
|
export type CandleChartProps<TAs extends ElementType = "figure"> = RenderableProps<TAs, CandleChartOwnProps, Record<string, never>, HTMLElement>;
|
|
34
50
|
export interface CandleChartClientOwnProps extends CandleChartOwnProps {
|
|
35
51
|
/**
|
|
@@ -55,6 +71,7 @@ export interface CandleChartViewProps extends CandleChartOwnProps {
|
|
|
55
71
|
export interface CandleChartCandleProps {
|
|
56
72
|
readonly as: "div" | "li";
|
|
57
73
|
readonly candle: CandleChartData;
|
|
74
|
+
readonly hitLabel: string;
|
|
58
75
|
/** Index reported to the pointer and click callbacks. */
|
|
59
76
|
readonly index: number;
|
|
60
77
|
/** Candle position and width, as percentages of the candle layer. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/candle-chart/types.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/candle-chart/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { ElementType, ReactElement } from "react";
|
|
2
|
+
import type { CardProps } from "./types.js";
|
|
3
|
+
export declare function Card<TAs extends ElementType = "div">(props: CardProps<TAs>): ReactElement | null;
|
|
4
|
+
export declare namespace Card {
|
|
5
|
+
var displayName: string;
|
|
6
|
+
}
|
|
7
|
+
//# sourceMappingURL=Card.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/components/card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAEvD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE5C,wBAAgB,IAAI,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,SAAS,CAAC,GAAG,CAAC,GAAG,YAAY,GAAG,IAAI,CAShG;yBATe,IAAI"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { useRenderElement } from "@gunkin/uiify/core/render";
|
|
2
|
+
function Card(props) {
|
|
3
|
+
const { as, render, ...consumerProps } = props;
|
|
4
|
+
return useRenderElement({
|
|
5
|
+
as,
|
|
6
|
+
defaultTag: "div",
|
|
7
|
+
props: { ...consumerProps, "data-uiify-card": "" },
|
|
8
|
+
render,
|
|
9
|
+
state: {}
|
|
10
|
+
});
|
|
11
|
+
}
|
|
12
|
+
Card.displayName = "Card";
|
|
13
|
+
export {
|
|
14
|
+
Card
|
|
15
|
+
};
|
|
16
|
+
//# sourceMappingURL=Card.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/card/Card.tsx"],"sourcesContent":["import type { ElementType, ReactElement } from \"react\";\nimport { useRenderElement } from \"@gunkin/uiify/core/render\";\nimport type { CardProps } from \"./types.js\";\n\nexport function Card<TAs extends ElementType = \"div\">(props: CardProps<TAs>): ReactElement | null {\n const { as, render, ...consumerProps } = props as CardProps<\"div\">;\n return useRenderElement({\n as,\n defaultTag: \"div\",\n props: { ...consumerProps, \"data-uiify-card\": \"\" },\n render,\n state: {},\n });\n}\n\nCard.displayName = \"Card\";\n"],"mappings":"AACA,SAAS,wBAAwB;AAG1B,SAAS,KAAsC,OAA4C;AAChG,QAAM,EAAE,IAAI,QAAQ,GAAG,cAAc,IAAI;AACzC,SAAO,iBAAiB;AAAA,IACtB;AAAA,IACA,YAAY;AAAA,IACZ,OAAO,EAAE,GAAG,eAAe,mBAAmB,GAAG;AAAA,IACjD;AAAA,IACA,OAAO,CAAC;AAAA,EACV,CAAC;AACH;AAEA,KAAK,cAAc;","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,YAAY,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/card/index.ts"],"sourcesContent":["export { Card } from \"./Card.js\";\nexport type { CardOwnProps, CardProps } from \"./types.js\";\n"],"mappings":"AAAA,SAAS,YAAY;","names":[]}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { ElementType, ReactNode } from "react";
|
|
2
|
+
import type { RenderableProps } from "@gunkin/uiify/core/render";
|
|
3
|
+
export interface CardOwnProps {
|
|
4
|
+
readonly children?: ReactNode;
|
|
5
|
+
}
|
|
6
|
+
export type CardProps<TAs extends ElementType = "div"> = RenderableProps<TAs, CardOwnProps, Record<string, never>, HTMLElement>;
|
|
7
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/card/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAEjE,MAAM,WAAW,YAAY;IAC3B,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;CAC/B;AAED,MAAM,MAAM,SAAS,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,IAAI,eAAe,CACtE,GAAG,EACH,YAAY,EACZ,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,EACrB,WAAW,CACZ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=types.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./card/index.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./card/index.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CarouselMarkup.d.ts","sourceRoot":"","sources":["../../../src/components/carousel/CarouselMarkup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CarouselMarkup.d.ts","sourceRoot":"","sources":["../../../src/components/carousel/CarouselMarkup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAEtD,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EAAE,OAAO,EACb,OAAO,EACP,YAAY,GACb,EAAE,mBAAmB,GAAG,YAAY,GAAG,IAAI,CAgK3C;yBApKe,cAAc"}
|