@helpwave/hightide 0.0.19 → 0.1.0
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/README.md +21 -2
- package/dist/coloring/shading.cjs +556 -0
- package/dist/coloring/shading.cjs.map +1 -0
- package/dist/coloring/{shading.d.mts → shading.d.cts} +1 -1
- package/dist/coloring/shading.js +476 -37
- package/dist/coloring/shading.js.map +1 -1
- package/dist/coloring/types.cjs +31 -0
- package/dist/coloring/{types.mjs.map → types.cjs.map} +1 -1
- package/dist/coloring/types.js +2 -27
- package/dist/coloring/types.js.map +1 -1
- package/dist/components/{HelpwaveBadge.js → branding/HelpwaveBadge.cjs} +65 -33
- package/dist/components/branding/HelpwaveBadge.cjs.map +1 -0
- package/dist/components/branding/HelpwaveBadge.js +123 -0
- package/dist/components/branding/HelpwaveBadge.js.map +1 -0
- package/dist/components/date/{DatePicker.mjs → DatePicker.cjs} +158 -94
- package/dist/components/date/DatePicker.cjs.map +1 -0
- package/dist/components/date/{DatePicker.d.mts → DatePicker.d.cts} +7 -8
- package/dist/components/date/DatePicker.d.ts +4 -5
- package/dist/components/date/DatePicker.js +121 -129
- package/dist/components/date/DatePicker.js.map +1 -1
- package/dist/components/date/{DayPicker.mjs → DayPicker.cjs} +77 -24
- package/dist/components/date/DayPicker.cjs.map +1 -0
- package/dist/components/date/{DayPicker.d.mts → DayPicker.d.cts} +3 -3
- package/dist/components/date/DayPicker.d.ts +2 -2
- package/dist/components/date/DayPicker.js +38 -61
- package/dist/components/date/DayPicker.js.map +1 -1
- package/dist/components/{TimeDisplay.js → date/TimeDisplay.cjs} +24 -9
- package/dist/components/date/TimeDisplay.cjs.map +1 -0
- package/dist/components/{TimeDisplay.d.mts → date/TimeDisplay.d.cts} +2 -3
- package/dist/components/{TimeDisplay.d.ts → date/TimeDisplay.d.ts} +2 -3
- package/dist/components/{TimeDisplay.mjs → date/TimeDisplay.js} +23 -8
- package/dist/components/date/TimeDisplay.js.map +1 -0
- package/dist/components/date/{TimePicker.mjs → TimePicker.cjs} +62 -26
- package/dist/components/date/TimePicker.cjs.map +1 -0
- package/dist/components/date/{TimePicker.d.mts → TimePicker.d.cts} +2 -2
- package/dist/components/date/TimePicker.d.ts +2 -2
- package/dist/components/date/TimePicker.js +25 -61
- package/dist/components/date/TimePicker.js.map +1 -1
- package/dist/components/date/{YearMonthPicker.mjs → YearMonthPicker.cjs} +93 -42
- package/dist/components/date/YearMonthPicker.cjs.map +1 -0
- package/dist/components/date/{YearMonthPicker.d.mts → YearMonthPicker.d.cts} +2 -2
- package/dist/components/date/YearMonthPicker.d.ts +2 -2
- package/dist/components/date/YearMonthPicker.js +56 -77
- package/dist/components/date/YearMonthPicker.js.map +1 -1
- package/dist/components/{AvatarGroup.js → icons-and-geometry/Avatar.cjs} +23 -19
- package/dist/components/icons-and-geometry/Avatar.cjs.map +1 -0
- package/dist/components/icons-and-geometry/Avatar.d.cts +30 -0
- package/dist/components/icons-and-geometry/Avatar.d.ts +30 -0
- package/dist/components/{AvatarGroup.mjs → icons-and-geometry/Avatar.js} +13 -10
- package/dist/components/icons-and-geometry/Avatar.js.map +1 -0
- package/dist/components/{Circle.js → icons-and-geometry/Circle.cjs} +3 -3
- package/dist/components/icons-and-geometry/Circle.cjs.map +1 -0
- package/dist/components/{Circle.mjs → icons-and-geometry/Circle.js} +2 -2
- package/dist/components/icons-and-geometry/Circle.js.map +1 -0
- package/dist/components/{icons/Helpwave.js → icons-and-geometry/Helpwave.cjs} +38 -6
- package/dist/components/icons-and-geometry/Helpwave.cjs.map +1 -0
- package/dist/components/icons-and-geometry/Helpwave.js +75 -0
- package/dist/components/icons-and-geometry/Helpwave.js.map +1 -0
- package/dist/components/{Ring.js → icons-and-geometry/Ring.cjs} +6 -6
- package/dist/components/icons-and-geometry/Ring.cjs.map +1 -0
- package/dist/components/{Ring.mjs → icons-and-geometry/Ring.js} +4 -4
- package/dist/components/icons-and-geometry/Ring.js.map +1 -0
- package/dist/components/{icons/Tag.js → icons-and-geometry/Tag.cjs} +3 -3
- package/dist/components/icons-and-geometry/Tag.cjs.map +1 -0
- package/dist/components/{icons/Tag.mjs → icons-and-geometry/Tag.js} +2 -2
- package/dist/components/icons-and-geometry/Tag.js.map +1 -0
- package/dist/components/{BreadCrumb.js → layout-and-navigation/BreadCrumb.cjs} +12 -5
- package/dist/components/layout-and-navigation/BreadCrumb.cjs.map +1 -0
- package/dist/components/{BreadCrumb.mjs → layout-and-navigation/BreadCrumb.js} +10 -3
- package/dist/components/layout-and-navigation/BreadCrumb.js.map +1 -0
- package/dist/components/{layout/Carousel.js → layout-and-navigation/Carousel.cjs} +4 -4
- package/dist/components/layout-and-navigation/Carousel.cjs.map +1 -0
- package/dist/components/{layout/Carousel.mjs → layout-and-navigation/Carousel.js} +4 -4
- package/dist/components/layout-and-navigation/Carousel.js.map +1 -0
- package/dist/components/{ChipList.js → layout-and-navigation/Chip.cjs} +6 -6
- package/dist/components/layout-and-navigation/Chip.cjs.map +1 -0
- package/dist/components/{ChipList.mjs → layout-and-navigation/Chip.js} +2 -2
- package/dist/components/layout-and-navigation/Chip.js.map +1 -0
- package/dist/components/{layout/DividerInserter.js → layout-and-navigation/DividerInserter.cjs} +3 -3
- package/dist/components/layout-and-navigation/DividerInserter.cjs.map +1 -0
- package/dist/components/{layout/DividerInserter.mjs → layout-and-navigation/DividerInserter.js} +2 -2
- package/dist/components/layout-and-navigation/DividerInserter.js.map +1 -0
- package/dist/components/{Expandable.js → layout-and-navigation/Expandable.cjs} +3 -3
- package/dist/components/layout-and-navigation/Expandable.cjs.map +1 -0
- package/dist/components/{Expandable.mjs → layout-and-navigation/Expandable.js} +2 -2
- package/dist/components/layout-and-navigation/Expandable.js.map +1 -0
- package/dist/components/{layout/FAQSection.js → layout-and-navigation/FAQSection.cjs} +7 -7
- package/dist/components/layout-and-navigation/FAQSection.cjs.map +1 -0
- package/dist/components/{layout/FAQSection.d.mts → layout-and-navigation/FAQSection.d.cts} +1 -1
- package/dist/components/{layout → layout-and-navigation}/FAQSection.d.ts +1 -1
- package/dist/components/{layout/FAQSection.mjs → layout-and-navigation/FAQSection.js} +5 -5
- package/dist/components/layout-and-navigation/FAQSection.js.map +1 -0
- package/dist/components/{MarkdownInterpreter.js → layout-and-navigation/MarkdownInterpreter.cjs} +2 -2
- package/dist/components/layout-and-navigation/MarkdownInterpreter.cjs.map +1 -0
- package/dist/components/{MarkdownInterpreter.mjs → layout-and-navigation/MarkdownInterpreter.js} +2 -2
- package/dist/components/layout-and-navigation/MarkdownInterpreter.js.map +1 -0
- package/dist/components/layout-and-navigation/Overlay.cjs +467 -0
- package/dist/components/layout-and-navigation/Overlay.cjs.map +1 -0
- package/dist/components/layout-and-navigation/Overlay.d.cts +63 -0
- package/dist/components/layout-and-navigation/Overlay.d.ts +63 -0
- package/dist/components/layout-and-navigation/Overlay.js +429 -0
- package/dist/components/layout-and-navigation/Overlay.js.map +1 -0
- package/dist/components/{Pagination.js → layout-and-navigation/Pagination.cjs} +25 -10
- package/dist/components/layout-and-navigation/Pagination.cjs.map +1 -0
- package/dist/components/{Pagination.d.mts → layout-and-navigation/Pagination.d.cts} +2 -3
- package/dist/components/{Pagination.d.ts → layout-and-navigation/Pagination.d.ts} +2 -3
- package/dist/components/{Pagination.mjs → layout-and-navigation/Pagination.js} +25 -10
- package/dist/components/layout-and-navigation/Pagination.js.map +1 -0
- package/dist/components/{SearchableList.js → layout-and-navigation/SearchableList.cjs} +51 -34
- package/dist/components/layout-and-navigation/SearchableList.cjs.map +1 -0
- package/dist/components/{SearchableList.d.mts → layout-and-navigation/SearchableList.d.cts} +2 -2
- package/dist/components/{SearchableList.d.ts → layout-and-navigation/SearchableList.d.ts} +2 -2
- package/dist/components/{SearchableList.mjs → layout-and-navigation/SearchableList.js} +52 -40
- package/dist/components/layout-and-navigation/SearchableList.js.map +1 -0
- package/dist/components/{StepperBar.js → layout-and-navigation/StepperBar.cjs} +42 -16
- package/dist/components/layout-and-navigation/StepperBar.cjs.map +1 -0
- package/dist/components/{StepperBar.d.mts → layout-and-navigation/StepperBar.d.cts} +2 -3
- package/dist/components/{StepperBar.d.ts → layout-and-navigation/StepperBar.d.ts} +2 -3
- package/dist/components/{StepperBar.mjs → layout-and-navigation/StepperBar.js} +40 -14
- package/dist/components/layout-and-navigation/StepperBar.js.map +1 -0
- package/dist/components/{Table.js → layout-and-navigation/Table.cjs} +176 -40
- package/dist/components/layout-and-navigation/Table.cjs.map +1 -0
- package/dist/components/{Table.d.mts → layout-and-navigation/Table.d.cts} +10 -1
- package/dist/components/{Table.d.ts → layout-and-navigation/Table.d.ts} +10 -1
- package/dist/components/{Table.mjs → layout-and-navigation/Table.js} +175 -40
- package/dist/components/layout-and-navigation/Table.js.map +1 -0
- package/dist/components/{TextImage.js → layout-and-navigation/TextImage.cjs} +25 -10
- package/dist/components/layout-and-navigation/TextImage.cjs.map +1 -0
- package/dist/components/{TextImage.d.mts → layout-and-navigation/TextImage.d.cts} +2 -3
- package/dist/components/{TextImage.d.ts → layout-and-navigation/TextImage.d.ts} +2 -3
- package/dist/components/{TextImage.mjs → layout-and-navigation/TextImage.js} +23 -8
- package/dist/components/layout-and-navigation/TextImage.js.map +1 -0
- package/dist/components/{layout/Tile.js → layout-and-navigation/Tile.cjs} +4 -4
- package/dist/components/layout-and-navigation/Tile.cjs.map +1 -0
- package/dist/components/{layout/Tile.mjs → layout-and-navigation/Tile.js} +2 -2
- package/dist/components/layout-and-navigation/Tile.js.map +1 -0
- package/dist/components/{VerticalDivider.js → layout-and-navigation/VerticalDivider.cjs} +2 -2
- package/dist/components/layout-and-navigation/VerticalDivider.cjs.map +1 -0
- package/dist/components/{VerticalDivider.mjs → layout-and-navigation/VerticalDivider.js} +2 -2
- package/dist/components/layout-and-navigation/VerticalDivider.js.map +1 -0
- package/dist/components/{ErrorComponent.js → loading-states/ErrorComponent.cjs} +25 -10
- package/dist/components/loading-states/ErrorComponent.cjs.map +1 -0
- package/dist/components/{ErrorComponent.d.mts → loading-states/ErrorComponent.d.cts} +2 -3
- package/dist/components/{ErrorComponent.d.ts → loading-states/ErrorComponent.d.ts} +2 -3
- package/dist/components/{ErrorComponent.mjs → loading-states/ErrorComponent.js} +24 -9
- package/dist/components/loading-states/ErrorComponent.js.map +1 -0
- package/dist/components/{LoadingAndErrorComponent.js → loading-states/LoadingAndErrorComponent.cjs} +67 -18
- package/dist/components/loading-states/LoadingAndErrorComponent.cjs.map +1 -0
- package/dist/components/{LoadingAndErrorComponent.d.mts → loading-states/LoadingAndErrorComponent.d.cts} +6 -6
- package/dist/components/{LoadingAndErrorComponent.d.ts → loading-states/LoadingAndErrorComponent.d.ts} +4 -4
- package/dist/components/{LoadingAndErrorComponent.mjs → loading-states/LoadingAndErrorComponent.js} +66 -17
- package/dist/components/loading-states/LoadingAndErrorComponent.js.map +1 -0
- package/dist/components/{LoadingAnimation.js → loading-states/LoadingAnimation.cjs} +64 -15
- package/dist/components/loading-states/LoadingAnimation.cjs.map +1 -0
- package/dist/components/{LoadingAnimation.d.mts → loading-states/LoadingAnimation.d.cts} +2 -3
- package/dist/components/{LoadingAnimation.d.ts → loading-states/LoadingAnimation.d.ts} +2 -3
- package/dist/components/{LoadingAnimation.mjs → loading-states/LoadingAnimation.js} +63 -14
- package/dist/components/loading-states/LoadingAnimation.js.map +1 -0
- package/dist/components/{LoadingButton.js → loading-states/LoadingButton.cjs} +101 -58
- package/dist/components/loading-states/LoadingButton.cjs.map +1 -0
- package/dist/components/{LoadingButton.d.mts → loading-states/LoadingButton.d.cts} +1 -1
- package/dist/components/{LoadingButton.d.ts → loading-states/LoadingButton.d.ts} +1 -1
- package/dist/components/{LoadingButton.mjs → loading-states/LoadingButton.js} +100 -57
- package/dist/components/loading-states/LoadingButton.js.map +1 -0
- package/dist/components/{ProgressIndicator.js → loading-states/ProgressIndicator.cjs} +2 -2
- package/dist/components/loading-states/ProgressIndicator.cjs.map +1 -0
- package/dist/components/{ProgressIndicator.mjs → loading-states/ProgressIndicator.js} +2 -2
- package/dist/components/loading-states/ProgressIndicator.js.map +1 -0
- package/dist/components/modals/ConfirmDialog.cjs +353 -0
- package/dist/components/modals/ConfirmDialog.cjs.map +1 -0
- package/dist/components/modals/{ConfirmDialog.d.mts → ConfirmDialog.d.cts} +6 -6
- package/dist/components/modals/ConfirmDialog.d.ts +6 -6
- package/dist/components/modals/ConfirmDialog.js +157 -268
- package/dist/components/modals/ConfirmDialog.js.map +1 -1
- package/dist/components/modals/{DiscardChangesDialog.js → DiscardChangesModal.cjs} +210 -116
- package/dist/components/modals/DiscardChangesModal.cjs.map +1 -0
- package/dist/components/modals/DiscardChangesModal.d.cts +23 -0
- package/dist/components/modals/DiscardChangesModal.d.ts +23 -0
- package/dist/components/modals/{DiscardChangesDialog.mjs → DiscardChangesModal.js} +198 -104
- package/dist/components/modals/DiscardChangesModal.js.map +1 -0
- package/dist/components/modals/InputModal.cjs +533 -0
- package/dist/components/modals/InputModal.cjs.map +1 -0
- package/dist/components/modals/{InputModal.d.mts → InputModal.d.cts} +7 -7
- package/dist/components/modals/InputModal.d.ts +6 -6
- package/dist/components/modals/InputModal.js +197 -301
- package/dist/components/modals/InputModal.js.map +1 -1
- package/dist/components/modals/LanguageModal.cjs +667 -0
- package/dist/components/modals/LanguageModal.cjs.map +1 -0
- package/dist/components/modals/LanguageModal.d.cts +20 -0
- package/dist/components/modals/LanguageModal.d.ts +7 -8
- package/dist/components/modals/LanguageModal.js +305 -203
- package/dist/components/modals/LanguageModal.js.map +1 -1
- package/dist/components/modals/ThemeModal.cjs +694 -0
- package/dist/components/modals/ThemeModal.cjs.map +1 -0
- package/dist/components/modals/ThemeModal.d.cts +21 -0
- package/dist/components/modals/ThemeModal.d.ts +21 -0
- package/dist/components/modals/ThemeModal.js +657 -0
- package/dist/components/modals/ThemeModal.js.map +1 -0
- package/dist/components/properties/CheckboxProperty.cjs +362 -0
- package/dist/components/properties/CheckboxProperty.cjs.map +1 -0
- package/dist/components/properties/{CheckboxProperty.d.mts → CheckboxProperty.d.cts} +3 -3
- package/dist/components/properties/CheckboxProperty.d.ts +2 -2
- package/dist/components/properties/CheckboxProperty.js +94 -93
- package/dist/components/properties/CheckboxProperty.js.map +1 -1
- package/dist/components/properties/DateProperty.cjs +451 -0
- package/dist/components/properties/DateProperty.cjs.map +1 -0
- package/dist/components/properties/{DateProperty.d.mts → DateProperty.d.cts} +3 -3
- package/dist/components/properties/DateProperty.d.ts +2 -2
- package/dist/components/properties/DateProperty.js +110 -116
- package/dist/components/properties/DateProperty.js.map +1 -1
- package/dist/components/properties/{MultiSelectProperty.mjs → MultiSelectProperty.cjs} +216 -155
- package/dist/components/properties/MultiSelectProperty.cjs.map +1 -0
- package/dist/components/properties/{MultiSelectProperty.d.mts → MultiSelectProperty.d.cts} +5 -5
- package/dist/components/properties/MultiSelectProperty.d.ts +4 -4
- package/dist/components/properties/MultiSelectProperty.js +180 -184
- package/dist/components/properties/MultiSelectProperty.js.map +1 -1
- package/dist/components/properties/NumberProperty.cjs +459 -0
- package/dist/components/properties/NumberProperty.cjs.map +1 -0
- package/dist/components/properties/{NumberProperty.d.mts → NumberProperty.d.cts} +3 -3
- package/dist/components/properties/NumberProperty.d.ts +2 -2
- package/dist/components/properties/NumberProperty.js +109 -116
- package/dist/components/properties/NumberProperty.js.map +1 -1
- package/dist/components/properties/PropertyBase.cjs +223 -0
- package/dist/components/properties/PropertyBase.cjs.map +1 -0
- package/dist/components/properties/{PropertyBase.d.mts → PropertyBase.d.cts} +2 -2
- package/dist/components/properties/PropertyBase.d.ts +2 -2
- package/dist/components/properties/PropertyBase.js +60 -69
- package/dist/components/properties/PropertyBase.js.map +1 -1
- package/dist/components/properties/{SelectProperty.mjs → SelectProperty.cjs} +251 -199
- package/dist/components/properties/SelectProperty.cjs.map +1 -0
- package/dist/components/properties/{SelectProperty.d.mts → SelectProperty.d.cts} +5 -6
- package/dist/components/properties/SelectProperty.d.ts +4 -5
- package/dist/components/properties/SelectProperty.js +215 -228
- package/dist/components/properties/SelectProperty.js.map +1 -1
- package/dist/components/properties/TextProperty.cjs +428 -0
- package/dist/components/properties/TextProperty.cjs.map +1 -0
- package/dist/components/properties/{TextProperty.d.mts → TextProperty.d.cts} +3 -3
- package/dist/components/properties/TextProperty.d.ts +2 -2
- package/dist/components/properties/TextProperty.js +134 -121
- package/dist/components/properties/TextProperty.js.map +1 -1
- package/dist/components/{Button.js → user-action/Button.cjs} +70 -12
- package/dist/components/user-action/Button.cjs.map +1 -0
- package/dist/components/{Button.d.mts → user-action/Button.d.cts} +32 -5
- package/dist/components/{Button.d.ts → user-action/Button.d.ts} +32 -5
- package/dist/components/{Button.mjs → user-action/Button.js} +66 -10
- package/dist/components/user-action/Button.js.map +1 -0
- package/dist/components/{user-input/Checkbox.js → user-action/Checkbox.cjs} +26 -16
- package/dist/components/user-action/Checkbox.cjs.map +1 -0
- package/dist/components/{user-input/Checkbox.d.mts → user-action/Checkbox.d.cts} +5 -5
- package/dist/components/{user-input → user-action}/Checkbox.d.ts +4 -4
- package/dist/components/{user-input/Checkbox.mjs → user-action/Checkbox.js} +24 -14
- package/dist/components/user-action/Checkbox.js.map +1 -0
- package/dist/components/{user-input/DateAndTimePicker.js → user-action/DateAndTimePicker.cjs} +51 -23
- package/dist/components/user-action/DateAndTimePicker.cjs.map +1 -0
- package/dist/components/{user-input/DateAndTimePicker.d.mts → user-action/DateAndTimePicker.d.cts} +7 -8
- package/dist/components/{user-input → user-action}/DateAndTimePicker.d.ts +2 -3
- package/dist/components/{user-input/DateAndTimePicker.mjs → user-action/DateAndTimePicker.js} +44 -16
- package/dist/components/user-action/DateAndTimePicker.js.map +1 -0
- package/dist/components/{user-input/Input.js → user-action/Input.cjs} +35 -34
- package/dist/components/user-action/Input.cjs.map +1 -0
- package/dist/components/{user-input/Input.d.mts → user-action/Input.d.cts} +9 -16
- package/dist/components/{user-input → user-action}/Input.d.ts +8 -15
- package/dist/components/{user-input/Input.mjs → user-action/Input.js} +35 -39
- package/dist/components/user-action/Input.js.map +1 -0
- package/dist/components/{user-input/Label.js → user-action/Label.cjs} +15 -3
- package/dist/components/user-action/Label.cjs.map +1 -0
- package/dist/components/{user-input/Label.d.mts → user-action/Label.d.cts} +1 -1
- package/dist/components/{user-input → user-action}/Label.d.ts +1 -1
- package/dist/components/{user-input/Label.mjs → user-action/Label.js} +5 -3
- package/dist/components/user-action/Label.js.map +1 -0
- package/dist/components/{user-input/Menu.js → user-action/Menu.cjs} +4 -4
- package/dist/components/user-action/Menu.cjs.map +1 -0
- package/dist/components/{user-input/Menu.mjs → user-action/Menu.js} +3 -3
- package/dist/components/user-action/Menu.js.map +1 -0
- package/dist/components/{user-input/MultiSelect.js → user-action/MultiSelect.cjs} +76 -51
- package/dist/components/user-action/MultiSelect.cjs.map +1 -0
- package/dist/components/{user-input/MultiSelect.d.mts → user-action/MultiSelect.d.cts} +3 -3
- package/dist/components/{user-input → user-action}/MultiSelect.d.ts +2 -2
- package/dist/components/{user-input/MultiSelect.mjs → user-action/MultiSelect.js} +75 -55
- package/dist/components/user-action/MultiSelect.js.map +1 -0
- package/dist/components/{user-input/ScrollPicker.js → user-action/ScrollPicker.cjs} +4 -4
- package/dist/components/user-action/ScrollPicker.cjs.map +1 -0
- package/dist/components/{user-input/ScrollPicker.mjs → user-action/ScrollPicker.js} +3 -3
- package/dist/components/user-action/ScrollPicker.js.map +1 -0
- package/dist/components/{user-input/SearchableSelect.js → user-action/Select.cjs} +181 -152
- package/dist/components/user-action/Select.cjs.map +1 -0
- package/dist/components/user-action/Select.d.cts +49 -0
- package/dist/components/user-action/Select.d.ts +49 -0
- package/dist/components/{user-input/SearchableSelect.mjs → user-action/Select.js} +167 -145
- package/dist/components/user-action/Select.js.map +1 -0
- package/dist/components/{user-input/Textarea.js → user-action/Textarea.cjs} +80 -35
- package/dist/components/user-action/Textarea.cjs.map +1 -0
- package/dist/components/user-action/Textarea.d.cts +28 -0
- package/dist/components/{user-input → user-action}/Textarea.d.ts +9 -5
- package/dist/components/user-action/Textarea.js +163 -0
- package/dist/components/user-action/Textarea.js.map +1 -0
- package/dist/components/{user-input/ToggleableInput.js → user-action/ToggleableInput.cjs} +9 -15
- package/dist/components/user-action/ToggleableInput.cjs.map +1 -0
- package/dist/components/{user-input/ToggleableInput.mjs → user-action/ToggleableInput.js} +8 -14
- package/dist/components/user-action/ToggleableInput.js.map +1 -0
- package/dist/components/{Tooltip.js → user-action/Tooltip.cjs} +13 -9
- package/dist/components/user-action/Tooltip.cjs.map +1 -0
- package/dist/components/{Tooltip.d.mts → user-action/Tooltip.d.cts} +1 -1
- package/dist/components/{Tooltip.d.ts → user-action/Tooltip.d.ts} +1 -1
- package/dist/components/{Tooltip.mjs → user-action/Tooltip.js} +12 -8
- package/dist/components/user-action/Tooltip.js.map +1 -0
- package/dist/css/globals.css +178 -126
- package/dist/css/uncompiled/globals.css +65 -29
- package/dist/hooks/useHoverState.cjs +72 -0
- package/dist/hooks/{useHoverState.mjs.map → useHoverState.cjs.map} +1 -1
- package/dist/hooks/useHoverState.js +7 -32
- package/dist/hooks/useHoverState.js.map +1 -1
- package/dist/hooks/useLocalStorage.cjs +83 -0
- package/dist/hooks/useLocalStorage.cjs.map +1 -0
- package/dist/hooks/useLocalStorage.js +9 -34
- package/dist/hooks/useLocalStorage.js.map +1 -1
- package/dist/hooks/useOutsideClick.cjs +48 -0
- package/dist/hooks/{useOutsideClick.mjs.map → useOutsideClick.cjs.map} +1 -1
- package/dist/hooks/useOutsideClick.js +4 -29
- package/dist/hooks/useOutsideClick.js.map +1 -1
- package/dist/hooks/useSaveDelay.cjs +68 -0
- package/dist/hooks/{useSaveDelay.mjs.map → useSaveDelay.cjs.map} +1 -1
- package/dist/hooks/useSaveDelay.js +6 -31
- package/dist/hooks/useSaveDelay.js.map +1 -1
- package/dist/{index.mjs → index.cjs} +4005 -3881
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +82 -0
- package/dist/index.d.ts +49 -55
- package/dist/index.js +3822 -4055
- package/dist/index.js.map +1 -1
- package/dist/{hooks/useLanguage.js → localization/LanguageProvider.cjs} +30 -26
- package/dist/localization/LanguageProvider.cjs.map +1 -0
- package/dist/localization/LanguageProvider.d.cts +18 -0
- package/dist/localization/LanguageProvider.d.ts +18 -0
- package/dist/{hooks/useLanguage.mjs → localization/LanguageProvider.js} +26 -19
- package/dist/localization/LanguageProvider.js.map +1 -0
- package/dist/{hooks/useTranslation.js → localization/useTranslation.cjs} +23 -8
- package/dist/localization/useTranslation.cjs.map +1 -0
- package/dist/{hooks/useTranslation.d.mts → localization/useTranslation.d.cts} +5 -7
- package/dist/{hooks → localization}/useTranslation.d.ts +5 -7
- package/dist/{hooks/useTranslation.mjs → localization/useTranslation.js} +22 -7
- package/dist/localization/useTranslation.js.map +1 -0
- package/dist/localization/util.cjs +41 -0
- package/dist/localization/util.cjs.map +1 -0
- package/dist/localization/util.d.cts +18 -0
- package/dist/localization/util.d.ts +18 -0
- package/dist/localization/util.js +16 -0
- package/dist/localization/util.js.map +1 -0
- package/dist/{hooks/useTheme.js → theming/useTheme.cjs} +19 -11
- package/dist/theming/useTheme.cjs.map +1 -0
- package/dist/{hooks/useTheme.d.mts → theming/useTheme.d.cts} +9 -5
- package/dist/{hooks → theming}/useTheme.d.ts +9 -5
- package/dist/{hooks/useTheme.mjs → theming/useTheme.js} +15 -7
- package/dist/theming/useTheme.js.map +1 -0
- package/dist/util/{array.mjs → array.cjs} +34 -3
- package/dist/util/array.cjs.map +1 -0
- package/dist/util/array.js +2 -33
- package/dist/util/array.js.map +1 -1
- package/dist/util/builder.cjs +34 -0
- package/dist/util/{builder.mjs.map → builder.cjs.map} +1 -1
- package/dist/util/builder.js +2 -27
- package/dist/util/builder.js.map +1 -1
- package/dist/util/{date.mjs → date.cjs} +41 -3
- package/dist/util/date.cjs.map +1 -0
- package/dist/util/date.js +2 -40
- package/dist/util/date.js.map +1 -1
- package/dist/util/easeFunctions.cjs +63 -0
- package/dist/util/easeFunctions.cjs.map +1 -0
- package/dist/util/easeFunctions.js +2 -29
- package/dist/util/easeFunctions.js.map +1 -1
- package/dist/util/emailValidation.cjs +33 -0
- package/dist/util/{emailValidation.mjs.map → emailValidation.cjs.map} +1 -1
- package/dist/util/emailValidation.js +2 -27
- package/dist/util/emailValidation.js.map +1 -1
- package/dist/util/{loopingArray.mjs → loopingArray.cjs} +28 -3
- package/dist/util/{loopingArray.mjs.map → loopingArray.cjs.map} +1 -1
- package/dist/util/loopingArray.js +2 -27
- package/dist/util/loopingArray.js.map +1 -1
- package/dist/util/math.cjs +33 -0
- package/dist/util/{math.mjs.map → math.cjs.map} +1 -1
- package/dist/util/math.js +2 -27
- package/dist/util/math.js.map +1 -1
- package/dist/util/news.cjs +77 -0
- package/dist/util/news.cjs.map +1 -0
- package/dist/util/{news.d.mts → news.d.cts} +11 -13
- package/dist/util/news.d.ts +11 -13
- package/dist/util/news.js +22 -49
- package/dist/util/news.js.map +1 -1
- package/dist/util/noop.cjs +31 -0
- package/dist/util/noop.cjs.map +1 -0
- package/dist/util/noop.js +2 -27
- package/dist/util/noop.js.map +1 -1
- package/dist/util/simpleSearch.cjs +54 -0
- package/dist/util/simpleSearch.cjs.map +1 -0
- package/dist/util/simpleSearch.js +2 -30
- package/dist/util/simpleSearch.js.map +1 -1
- package/dist/util/storage.cjs +64 -0
- package/dist/util/storage.cjs.map +1 -0
- package/dist/util/storage.js +2 -28
- package/dist/util/storage.js.map +1 -1
- package/dist/util/types.cjs +19 -0
- package/dist/util/types.cjs.map +1 -0
- package/dist/util/types.js +0 -18
- package/dist/util/types.js.map +1 -1
- package/package.json +9 -12
- package/dist/coloring/shading.mjs +0 -47
- package/dist/coloring/shading.mjs.map +0 -1
- package/dist/coloring/types.mjs +0 -6
- package/dist/components/Avatar.d.mts +0 -17
- package/dist/components/Avatar.d.ts +0 -17
- package/dist/components/Avatar.js +0 -85
- package/dist/components/Avatar.js.map +0 -1
- package/dist/components/Avatar.mjs +0 -48
- package/dist/components/Avatar.mjs.map +0 -1
- package/dist/components/AvatarGroup.d.mts +0 -14
- package/dist/components/AvatarGroup.d.ts +0 -14
- package/dist/components/AvatarGroup.js.map +0 -1
- package/dist/components/AvatarGroup.mjs.map +0 -1
- package/dist/components/BreadCrumb.js.map +0 -1
- package/dist/components/BreadCrumb.mjs.map +0 -1
- package/dist/components/Button.js.map +0 -1
- package/dist/components/Button.mjs.map +0 -1
- package/dist/components/ChipList.js.map +0 -1
- package/dist/components/ChipList.mjs.map +0 -1
- package/dist/components/Circle.js.map +0 -1
- package/dist/components/Circle.mjs.map +0 -1
- package/dist/components/ErrorComponent.js.map +0 -1
- package/dist/components/ErrorComponent.mjs.map +0 -1
- package/dist/components/Expandable.js.map +0 -1
- package/dist/components/Expandable.mjs.map +0 -1
- package/dist/components/HelpwaveBadge.js.map +0 -1
- package/dist/components/HelpwaveBadge.mjs +0 -91
- package/dist/components/HelpwaveBadge.mjs.map +0 -1
- package/dist/components/HideableContentSection.d.mts +0 -14
- package/dist/components/HideableContentSection.d.ts +0 -14
- package/dist/components/HideableContentSection.js +0 -70
- package/dist/components/HideableContentSection.js.map +0 -1
- package/dist/components/HideableContentSection.mjs +0 -35
- package/dist/components/HideableContentSection.mjs.map +0 -1
- package/dist/components/InputGroup.d.mts +0 -17
- package/dist/components/InputGroup.d.ts +0 -17
- package/dist/components/InputGroup.js +0 -97
- package/dist/components/InputGroup.js.map +0 -1
- package/dist/components/InputGroup.mjs +0 -62
- package/dist/components/InputGroup.mjs.map +0 -1
- package/dist/components/LoadingAndErrorComponent.js.map +0 -1
- package/dist/components/LoadingAndErrorComponent.mjs.map +0 -1
- package/dist/components/LoadingAnimation.js.map +0 -1
- package/dist/components/LoadingAnimation.mjs.map +0 -1
- package/dist/components/LoadingButton.js.map +0 -1
- package/dist/components/LoadingButton.mjs.map +0 -1
- package/dist/components/MarkdownInterpreter.js.map +0 -1
- package/dist/components/MarkdownInterpreter.mjs.map +0 -1
- package/dist/components/Pagination.js.map +0 -1
- package/dist/components/Pagination.mjs.map +0 -1
- package/dist/components/Profile.d.mts +0 -31
- package/dist/components/Profile.d.ts +0 -31
- package/dist/components/Profile.js +0 -197
- package/dist/components/Profile.js.map +0 -1
- package/dist/components/Profile.mjs +0 -162
- package/dist/components/Profile.mjs.map +0 -1
- package/dist/components/ProgressIndicator.js.map +0 -1
- package/dist/components/ProgressIndicator.mjs.map +0 -1
- package/dist/components/Ring.js.map +0 -1
- package/dist/components/Ring.mjs.map +0 -1
- package/dist/components/SearchableList.js.map +0 -1
- package/dist/components/SearchableList.mjs.map +0 -1
- package/dist/components/SortButton.d.mts +0 -15
- package/dist/components/SortButton.d.ts +0 -15
- package/dist/components/SortButton.js +0 -132
- package/dist/components/SortButton.js.map +0 -1
- package/dist/components/SortButton.mjs +0 -97
- package/dist/components/SortButton.mjs.map +0 -1
- package/dist/components/StepperBar.js.map +0 -1
- package/dist/components/StepperBar.mjs.map +0 -1
- package/dist/components/Table.js.map +0 -1
- package/dist/components/Table.mjs.map +0 -1
- package/dist/components/TechRadar.d.mts +0 -39
- package/dist/components/TechRadar.d.ts +0 -39
- package/dist/components/TechRadar.js +0 -243
- package/dist/components/TechRadar.js.map +0 -1
- package/dist/components/TechRadar.mjs +0 -208
- package/dist/components/TechRadar.mjs.map +0 -1
- package/dist/components/TextImage.js.map +0 -1
- package/dist/components/TextImage.mjs.map +0 -1
- package/dist/components/TimeDisplay.js.map +0 -1
- package/dist/components/TimeDisplay.mjs.map +0 -1
- package/dist/components/Tooltip.js.map +0 -1
- package/dist/components/Tooltip.mjs.map +0 -1
- package/dist/components/VerticalDivider.js.map +0 -1
- package/dist/components/VerticalDivider.mjs.map +0 -1
- package/dist/components/date/DatePicker.mjs.map +0 -1
- package/dist/components/date/DayPicker.mjs.map +0 -1
- package/dist/components/date/TimePicker.mjs.map +0 -1
- package/dist/components/date/YearMonthPicker.mjs.map +0 -1
- package/dist/components/icons/Helpwave.js.map +0 -1
- package/dist/components/icons/Helpwave.mjs +0 -43
- package/dist/components/icons/Helpwave.mjs.map +0 -1
- package/dist/components/icons/Tag.js.map +0 -1
- package/dist/components/icons/Tag.mjs.map +0 -1
- package/dist/components/layout/Carousel.js.map +0 -1
- package/dist/components/layout/Carousel.mjs.map +0 -1
- package/dist/components/layout/DividerInserter.js.map +0 -1
- package/dist/components/layout/DividerInserter.mjs.map +0 -1
- package/dist/components/layout/FAQSection.js.map +0 -1
- package/dist/components/layout/FAQSection.mjs.map +0 -1
- package/dist/components/layout/Tile.js.map +0 -1
- package/dist/components/layout/Tile.mjs.map +0 -1
- package/dist/components/modals/ConfirmDialog.mjs +0 -390
- package/dist/components/modals/ConfirmDialog.mjs.map +0 -1
- package/dist/components/modals/DiscardChangesDialog.d.mts +0 -23
- package/dist/components/modals/DiscardChangesDialog.d.ts +0 -23
- package/dist/components/modals/DiscardChangesDialog.js.map +0 -1
- package/dist/components/modals/DiscardChangesDialog.mjs.map +0 -1
- package/dist/components/modals/InputModal.mjs +0 -568
- package/dist/components/modals/InputModal.mjs.map +0 -1
- package/dist/components/modals/LanguageModal.d.mts +0 -21
- package/dist/components/modals/LanguageModal.mjs +0 -491
- package/dist/components/modals/LanguageModal.mjs.map +0 -1
- package/dist/components/modals/Modal.d.mts +0 -43
- package/dist/components/modals/Modal.d.ts +0 -43
- package/dist/components/modals/Modal.js +0 -288
- package/dist/components/modals/Modal.js.map +0 -1
- package/dist/components/modals/Modal.mjs +0 -251
- package/dist/components/modals/Modal.mjs.map +0 -1
- package/dist/components/modals/ModalRegister.d.mts +0 -16
- package/dist/components/modals/ModalRegister.d.ts +0 -16
- package/dist/components/modals/ModalRegister.js +0 -63
- package/dist/components/modals/ModalRegister.js.map +0 -1
- package/dist/components/modals/ModalRegister.mjs +0 -37
- package/dist/components/modals/ModalRegister.mjs.map +0 -1
- package/dist/components/properties/CheckboxProperty.mjs +0 -291
- package/dist/components/properties/CheckboxProperty.mjs.map +0 -1
- package/dist/components/properties/DateProperty.mjs +0 -392
- package/dist/components/properties/DateProperty.mjs.map +0 -1
- package/dist/components/properties/MultiSelectProperty.mjs.map +0 -1
- package/dist/components/properties/NumberProperty.mjs +0 -401
- package/dist/components/properties/NumberProperty.mjs.map +0 -1
- package/dist/components/properties/PropertyBase.mjs +0 -162
- package/dist/components/properties/PropertyBase.mjs.map +0 -1
- package/dist/components/properties/SelectProperty.mjs.map +0 -1
- package/dist/components/properties/TextProperty.mjs +0 -345
- package/dist/components/properties/TextProperty.mjs.map +0 -1
- package/dist/components/user-input/Checkbox.js.map +0 -1
- package/dist/components/user-input/Checkbox.mjs.map +0 -1
- package/dist/components/user-input/DateAndTimePicker.js.map +0 -1
- package/dist/components/user-input/DateAndTimePicker.mjs.map +0 -1
- package/dist/components/user-input/Input.js.map +0 -1
- package/dist/components/user-input/Input.mjs.map +0 -1
- package/dist/components/user-input/Label.js.map +0 -1
- package/dist/components/user-input/Label.mjs.map +0 -1
- package/dist/components/user-input/Menu.js.map +0 -1
- package/dist/components/user-input/Menu.mjs.map +0 -1
- package/dist/components/user-input/MultiSelect.js.map +0 -1
- package/dist/components/user-input/MultiSelect.mjs.map +0 -1
- package/dist/components/user-input/ScrollPicker.js.map +0 -1
- package/dist/components/user-input/ScrollPicker.mjs.map +0 -1
- package/dist/components/user-input/SearchableSelect.d.mts +0 -14
- package/dist/components/user-input/SearchableSelect.d.ts +0 -14
- package/dist/components/user-input/SearchableSelect.js.map +0 -1
- package/dist/components/user-input/SearchableSelect.mjs.map +0 -1
- package/dist/components/user-input/Select.d.mts +0 -36
- package/dist/components/user-input/Select.d.ts +0 -36
- package/dist/components/user-input/Select.js +0 -153
- package/dist/components/user-input/Select.js.map +0 -1
- package/dist/components/user-input/Select.mjs +0 -118
- package/dist/components/user-input/Select.mjs.map +0 -1
- package/dist/components/user-input/Textarea.d.mts +0 -24
- package/dist/components/user-input/Textarea.js.map +0 -1
- package/dist/components/user-input/Textarea.mjs +0 -119
- package/dist/components/user-input/Textarea.mjs.map +0 -1
- package/dist/components/user-input/ToggleableInput.js.map +0 -1
- package/dist/components/user-input/ToggleableInput.mjs.map +0 -1
- package/dist/hooks/useHoverState.mjs +0 -47
- package/dist/hooks/useLanguage.d.mts +0 -21
- package/dist/hooks/useLanguage.d.ts +0 -21
- package/dist/hooks/useLanguage.js.map +0 -1
- package/dist/hooks/useLanguage.mjs.map +0 -1
- package/dist/hooks/useLocalStorage.mjs +0 -58
- package/dist/hooks/useLocalStorage.mjs.map +0 -1
- package/dist/hooks/useOutsideClick.mjs +0 -23
- package/dist/hooks/useSaveDelay.mjs +0 -43
- package/dist/hooks/useTheme.js.map +0 -1
- package/dist/hooks/useTheme.mjs.map +0 -1
- package/dist/hooks/useTranslation.js.map +0 -1
- package/dist/hooks/useTranslation.mjs.map +0 -1
- package/dist/index.d.mts +0 -88
- package/dist/index.mjs.map +0 -1
- package/dist/util/array.mjs.map +0 -1
- package/dist/util/builder.mjs +0 -9
- package/dist/util/date.mjs.map +0 -1
- package/dist/util/easeFunctions.mjs +0 -36
- package/dist/util/easeFunctions.mjs.map +0 -1
- package/dist/util/emailValidation.mjs +0 -8
- package/dist/util/math.mjs +0 -8
- package/dist/util/news.mjs +0 -48
- package/dist/util/news.mjs.map +0 -1
- package/dist/util/noop.mjs +0 -6
- package/dist/util/noop.mjs.map +0 -1
- package/dist/util/simpleSearch.mjs +0 -26
- package/dist/util/simpleSearch.mjs.map +0 -1
- package/dist/util/storage.mjs +0 -38
- package/dist/util/storage.mjs.map +0 -1
- package/dist/util/types.mjs +0 -1
- package/dist/util/types.mjs.map +0 -1
- /package/dist/coloring/{types.d.mts → types.d.cts} +0 -0
- /package/dist/components/{HelpwaveBadge.d.mts → branding/HelpwaveBadge.d.cts} +0 -0
- /package/dist/components/{HelpwaveBadge.d.ts → branding/HelpwaveBadge.d.ts} +0 -0
- /package/dist/components/{Circle.d.mts → icons-and-geometry/Circle.d.cts} +0 -0
- /package/dist/components/{Circle.d.ts → icons-and-geometry/Circle.d.ts} +0 -0
- /package/dist/components/{icons/Helpwave.d.mts → icons-and-geometry/Helpwave.d.cts} +0 -0
- /package/dist/components/{icons → icons-and-geometry}/Helpwave.d.ts +0 -0
- /package/dist/components/{Ring.d.mts → icons-and-geometry/Ring.d.cts} +0 -0
- /package/dist/components/{Ring.d.ts → icons-and-geometry/Ring.d.ts} +0 -0
- /package/dist/components/{icons/Tag.d.mts → icons-and-geometry/Tag.d.cts} +0 -0
- /package/dist/components/{icons → icons-and-geometry}/Tag.d.ts +0 -0
- /package/dist/components/{BreadCrumb.d.mts → layout-and-navigation/BreadCrumb.d.cts} +0 -0
- /package/dist/components/{BreadCrumb.d.ts → layout-and-navigation/BreadCrumb.d.ts} +0 -0
- /package/dist/components/{layout/Carousel.d.mts → layout-and-navigation/Carousel.d.cts} +0 -0
- /package/dist/components/{layout → layout-and-navigation}/Carousel.d.ts +0 -0
- /package/dist/components/{ChipList.d.mts → layout-and-navigation/Chip.d.cts} +0 -0
- /package/dist/components/{ChipList.d.ts → layout-and-navigation/Chip.d.ts} +0 -0
- /package/dist/components/{layout/DividerInserter.d.mts → layout-and-navigation/DividerInserter.d.cts} +0 -0
- /package/dist/components/{layout → layout-and-navigation}/DividerInserter.d.ts +0 -0
- /package/dist/components/{Expandable.d.mts → layout-and-navigation/Expandable.d.cts} +0 -0
- /package/dist/components/{Expandable.d.ts → layout-and-navigation/Expandable.d.ts} +0 -0
- /package/dist/components/{MarkdownInterpreter.d.mts → layout-and-navigation/MarkdownInterpreter.d.cts} +0 -0
- /package/dist/components/{MarkdownInterpreter.d.ts → layout-and-navigation/MarkdownInterpreter.d.ts} +0 -0
- /package/dist/components/{layout/Tile.d.mts → layout-and-navigation/Tile.d.cts} +0 -0
- /package/dist/components/{layout → layout-and-navigation}/Tile.d.ts +0 -0
- /package/dist/components/{VerticalDivider.d.mts → layout-and-navigation/VerticalDivider.d.cts} +0 -0
- /package/dist/components/{VerticalDivider.d.ts → layout-and-navigation/VerticalDivider.d.ts} +0 -0
- /package/dist/components/{ProgressIndicator.d.mts → loading-states/ProgressIndicator.d.cts} +0 -0
- /package/dist/components/{ProgressIndicator.d.ts → loading-states/ProgressIndicator.d.ts} +0 -0
- /package/dist/components/{user-input/Menu.d.mts → user-action/Menu.d.cts} +0 -0
- /package/dist/components/{user-input → user-action}/Menu.d.ts +0 -0
- /package/dist/components/{user-input/ScrollPicker.d.mts → user-action/ScrollPicker.d.cts} +0 -0
- /package/dist/components/{user-input → user-action}/ScrollPicker.d.ts +0 -0
- /package/dist/components/{user-input/ToggleableInput.d.mts → user-action/ToggleableInput.d.cts} +0 -0
- /package/dist/components/{user-input → user-action}/ToggleableInput.d.ts +0 -0
- /package/dist/hooks/{useHoverState.d.mts → useHoverState.d.cts} +0 -0
- /package/dist/hooks/{useLocalStorage.d.mts → useLocalStorage.d.cts} +0 -0
- /package/dist/hooks/{useOutsideClick.d.mts → useOutsideClick.d.cts} +0 -0
- /package/dist/hooks/{useSaveDelay.d.mts → useSaveDelay.d.cts} +0 -0
- /package/dist/util/{array.d.mts → array.d.cts} +0 -0
- /package/dist/util/{builder.d.mts → builder.d.cts} +0 -0
- /package/dist/util/{date.d.mts → date.d.cts} +0 -0
- /package/dist/util/{easeFunctions.d.mts → easeFunctions.d.cts} +0 -0
- /package/dist/util/{emailValidation.d.mts → emailValidation.d.cts} +0 -0
- /package/dist/util/{loopingArray.d.mts → loopingArray.d.cts} +0 -0
- /package/dist/util/{math.d.mts → math.d.cts} +0 -0
- /package/dist/util/{noop.d.mts → noop.d.cts} +0 -0
- /package/dist/util/{simpleSearch.d.mts → simpleSearch.d.cts} +0 -0
- /package/dist/util/{storage.d.mts → storage.d.cts} +0 -0
- /package/dist/util/{types.d.mts → types.d.cts} +0 -0
|
@@ -1,162 +0,0 @@
|
|
|
1
|
-
// src/components/Profile.tsx
|
|
2
|
-
import clsx3 from "clsx";
|
|
3
|
-
import Image from "next/image";
|
|
4
|
-
import Link from "next/link";
|
|
5
|
-
import { Github, Globe, Linkedin, Mail } from "lucide-react";
|
|
6
|
-
|
|
7
|
-
// src/components/icons/Helpwave.tsx
|
|
8
|
-
import { clsx } from "clsx";
|
|
9
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
10
|
-
var Helpwave = ({
|
|
11
|
-
color = "currentColor",
|
|
12
|
-
animate = "none",
|
|
13
|
-
size = 64,
|
|
14
|
-
...props
|
|
15
|
-
}) => {
|
|
16
|
-
const isLoadingAnimation = animate === "loading";
|
|
17
|
-
let svgAnimationKey = "";
|
|
18
|
-
if (animate === "pulse") {
|
|
19
|
-
svgAnimationKey = "animate-pulse";
|
|
20
|
-
} else if (animate === "bounce") {
|
|
21
|
-
svgAnimationKey = "animate-bounce";
|
|
22
|
-
}
|
|
23
|
-
if (size < 0) {
|
|
24
|
-
console.error("size cannot be less than 0");
|
|
25
|
-
size = 64;
|
|
26
|
-
}
|
|
27
|
-
return /* @__PURE__ */ jsx(
|
|
28
|
-
"svg",
|
|
29
|
-
{
|
|
30
|
-
width: size,
|
|
31
|
-
height: size,
|
|
32
|
-
viewBox: "0 0 888 888",
|
|
33
|
-
fill: "none",
|
|
34
|
-
strokeLinecap: "round",
|
|
35
|
-
strokeWidth: 48,
|
|
36
|
-
...props,
|
|
37
|
-
children: /* @__PURE__ */ jsxs("g", { className: clsx(svgAnimationKey), children: [
|
|
38
|
-
/* @__PURE__ */ jsx("path", { className: clsx({ "animate-wave-big-left-up": isLoadingAnimation }), d: "M144 543.235C144 423.259 232.164 326 340.92 326", stroke: color, strokeDasharray: "1000" }),
|
|
39
|
-
/* @__PURE__ */ jsx("path", { className: clsx({ "animate-wave-big-right-down": isLoadingAnimation }), d: "M537.84 544.104C429.084 544.104 340.92 446.844 340.92 326.869", stroke: color, strokeDasharray: "1000" }),
|
|
40
|
-
/* @__PURE__ */ jsx("path", { className: clsx({ "animate-wave-small-left-up": isLoadingAnimation }), d: "M462.223 518.035C462.223 432.133 525.348 362.495 603.217 362.495", stroke: color, strokeDasharray: "1000" }),
|
|
41
|
-
/* @__PURE__ */ jsx("path", { className: clsx({ "animate-wave-small-right-down": isLoadingAnimation }), d: "M745.001 519.773C666.696 519.773 603.218 450.136 603.218 364.233", stroke: color, strokeDasharray: "1000" })
|
|
42
|
-
] })
|
|
43
|
-
}
|
|
44
|
-
);
|
|
45
|
-
};
|
|
46
|
-
|
|
47
|
-
// src/components/ChipList.tsx
|
|
48
|
-
import clsx2 from "clsx";
|
|
49
|
-
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
50
|
-
var Chip = ({
|
|
51
|
-
children,
|
|
52
|
-
trailingIcon,
|
|
53
|
-
color = "default",
|
|
54
|
-
variant = "normal",
|
|
55
|
-
className = "",
|
|
56
|
-
...restProps
|
|
57
|
-
}) => {
|
|
58
|
-
const colorMapping = {
|
|
59
|
-
default: "text-tag-default-text bg-tag-default-background",
|
|
60
|
-
dark: "text-tag-dark-text bg-tag-dark-background",
|
|
61
|
-
red: "text-tag-red-text bg-tag-red-background",
|
|
62
|
-
yellow: "text-tag-yellow-text bg-tag-yellow-background",
|
|
63
|
-
green: "text-tag-green-text bg-tag-green-background",
|
|
64
|
-
blue: "text-tag-blue-text bg-tag-blue-background",
|
|
65
|
-
pink: "text-tag-pink-text bg-tag-pink-background"
|
|
66
|
-
}[color];
|
|
67
|
-
const colorMappingIcon = {
|
|
68
|
-
default: "text-tag-default-icon",
|
|
69
|
-
dark: "text-tag-dark-icon",
|
|
70
|
-
red: "text-tag-red-icon",
|
|
71
|
-
yellow: "text-tag-yellow-icon",
|
|
72
|
-
green: "text-tag-green-icon",
|
|
73
|
-
blue: "text-tag-blue-icon",
|
|
74
|
-
pink: "text-tag-pink-icon"
|
|
75
|
-
}[color];
|
|
76
|
-
return /* @__PURE__ */ jsxs2(
|
|
77
|
-
"div",
|
|
78
|
-
{
|
|
79
|
-
...restProps,
|
|
80
|
-
className: clsx2(
|
|
81
|
-
`row w-fit px-2 py-1`,
|
|
82
|
-
colorMapping,
|
|
83
|
-
{
|
|
84
|
-
"rounded-md": variant === "normal",
|
|
85
|
-
"rounded-full": variant === "fullyRounded"
|
|
86
|
-
},
|
|
87
|
-
className
|
|
88
|
-
),
|
|
89
|
-
children: [
|
|
90
|
-
children,
|
|
91
|
-
trailingIcon && /* @__PURE__ */ jsx2("span", { className: colorMappingIcon, children: trailingIcon })
|
|
92
|
-
]
|
|
93
|
-
}
|
|
94
|
-
);
|
|
95
|
-
};
|
|
96
|
-
|
|
97
|
-
// src/components/Profile.tsx
|
|
98
|
-
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
99
|
-
var SocialIcon = ({ type, url, size = 24 }) => {
|
|
100
|
-
let icon;
|
|
101
|
-
switch (type) {
|
|
102
|
-
case "mail":
|
|
103
|
-
icon = /* @__PURE__ */ jsx3(Mail, { size });
|
|
104
|
-
break;
|
|
105
|
-
case "linkedin":
|
|
106
|
-
icon = /* @__PURE__ */ jsx3(Linkedin, { size });
|
|
107
|
-
break;
|
|
108
|
-
case "github":
|
|
109
|
-
icon = /* @__PURE__ */ jsx3(Github, { size });
|
|
110
|
-
break;
|
|
111
|
-
case "website":
|
|
112
|
-
icon = /* @__PURE__ */ jsx3(Globe, { size });
|
|
113
|
-
break;
|
|
114
|
-
case "medium":
|
|
115
|
-
icon = /* @__PURE__ */ jsx3(Globe, { size });
|
|
116
|
-
break;
|
|
117
|
-
default:
|
|
118
|
-
icon = /* @__PURE__ */ jsx3(Helpwave, { size: 24 });
|
|
119
|
-
}
|
|
120
|
-
return /* @__PURE__ */ jsx3(Link, { href: url, target: "_blank", children: /* @__PURE__ */ jsx3(Chip, { color: "dark", className: "!p-2", children: icon }) });
|
|
121
|
-
};
|
|
122
|
-
var Profile = ({
|
|
123
|
-
name,
|
|
124
|
-
imageUrl,
|
|
125
|
-
badge,
|
|
126
|
-
prefix,
|
|
127
|
-
suffix,
|
|
128
|
-
roleBadge,
|
|
129
|
-
role,
|
|
130
|
-
tags,
|
|
131
|
-
info,
|
|
132
|
-
socials,
|
|
133
|
-
className,
|
|
134
|
-
imageClassName,
|
|
135
|
-
...divProps
|
|
136
|
-
}) => {
|
|
137
|
-
return /* @__PURE__ */ jsxs3(
|
|
138
|
-
"div",
|
|
139
|
-
{
|
|
140
|
-
...divProps,
|
|
141
|
-
className: clsx3(`col items-center text-center rounded-3xl p-3 pb-4 bg-white text-gray-900 w-min shadow-around-lg`, className),
|
|
142
|
-
children: [
|
|
143
|
-
/* @__PURE__ */ jsxs3("div", { className: "relative mb-6", children: [
|
|
144
|
-
/* @__PURE__ */ jsx3("div", { className: clsx3("relative rounded-xl row items-center justify-center overflow-hidden", imageClassName), children: /* @__PURE__ */ jsx3(Image, { src: imageUrl, alt: "", className: clsx3("z-[2] object-cover", imageClassName), width: 0, height: 0, style: { width: "auto", height: "auto" } }) }),
|
|
145
|
-
/* @__PURE__ */ jsx3("div", { className: "absolute top-[6px] left-[6px] z-[3]", children: badge }),
|
|
146
|
-
roleBadge && /* @__PURE__ */ jsx3("div", { className: "absolute bottom-0 left-1/2 -translate-x-1/2 translate-y-2/3 z-[4] rounded-md", children: /* @__PURE__ */ jsx3(Chip, { color: "dark", className: "font-bold px-3", children: roleBadge }) })
|
|
147
|
-
] }),
|
|
148
|
-
prefix && /* @__PURE__ */ jsx3("span", { className: "font-semibold", children: prefix }),
|
|
149
|
-
/* @__PURE__ */ jsx3("h2", { id: name, className: "textstyle-title-md", children: name }),
|
|
150
|
-
suffix && /* @__PURE__ */ jsx3("span", { className: "text-sm mb-1", children: suffix }),
|
|
151
|
-
role && /* @__PURE__ */ jsx3("span", { className: "font-space font-bold text-sm", children: role }),
|
|
152
|
-
tags && /* @__PURE__ */ jsx3("div", { className: "flex flex-wrap mx-4 mt-2 gap-x-2 justify-center", children: tags.map((tag, index) => /* @__PURE__ */ jsx3("span", { className: "textstyle-description text-sm", children: `#${tag}` }, index)) }),
|
|
153
|
-
info && /* @__PURE__ */ jsx3("span", { className: "mt-2 text-sm", children: info }),
|
|
154
|
-
socials && /* @__PURE__ */ jsx3("div", { className: "flex flex-wrap grow items-end justify-center gap-x-4 gap-y-2 mt-4", children: socials.map((socialIconProps, index) => /* @__PURE__ */ jsx3(SocialIcon, { ...socialIconProps, size: socialIconProps.size ?? 20 }, index)) })
|
|
155
|
-
]
|
|
156
|
-
}
|
|
157
|
-
);
|
|
158
|
-
};
|
|
159
|
-
export {
|
|
160
|
-
Profile
|
|
161
|
-
};
|
|
162
|
-
//# sourceMappingURL=Profile.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/Profile.tsx","../../src/components/icons/Helpwave.tsx","../../src/components/ChipList.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react'\nimport clsx from 'clsx'\nimport Image from 'next/image'\nimport Link from 'next/link'\nimport { Github, Globe, Linkedin, Mail } from 'lucide-react'\nimport { Helpwave } from './icons/Helpwave'\nimport { Chip } from './ChipList'\n\ntype SocialType = 'mail' | 'github' | 'linkedin' | 'website' | 'medium'\n\nexport type SocialIconProps = {\n type: SocialType,\n url: string,\n size?: number,\n}\n\n/**\n * A Component for showing a lin\n */\nconst SocialIcon = ({ type, url, size = 24 }: SocialIconProps) => {\n let icon: ReactNode\n switch (type) {\n case 'mail':\n icon = <Mail size={size}/>\n break\n case 'linkedin':\n // TODO find an alternative icon\n icon = <Linkedin size={size}/>\n break\n case 'github':\n // TODO find an alternative icon\n icon = <Github size={size}/>\n break\n case 'website':\n icon = <Globe size={size}/>\n break\n case 'medium':\n icon = <Globe size={size}/> // TODO find an appropriate medium svg\n break\n default:\n icon = <Helpwave size={24}/>\n }\n return (\n <Link href={url} target=\"_blank\">\n <Chip color=\"dark\" className=\"!p-2\">\n {icon}\n </Chip>\n </Link>\n )\n}\n\nexport type ProfileProps = HTMLAttributes<HTMLDivElement> & {\n name: string,\n imageUrl: string,\n badge?: ReactNode,\n prefix?: string,\n suffix?: string,\n roleBadge?: string,\n role?: string,\n /**\n * The list of tags for the\n */\n tags?: string[],\n info?: string,\n socials?: SocialIconProps[],\n imageClassName?: string,\n}\n\n\n// TODO add colors for dark-mode\n/**\n * A Component for showing a Profile\n */\nexport const Profile = ({\n name,\n imageUrl,\n badge,\n prefix,\n suffix,\n roleBadge,\n role,\n tags,\n info,\n socials,\n className,\n imageClassName,\n ...divProps\n}: ProfileProps) => {\n return (\n <div\n {...divProps}\n className={clsx(`col items-center text-center rounded-3xl p-3 pb-4 bg-white text-gray-900 w-min shadow-around-lg`, className)}\n >\n <div className=\"relative mb-6\">\n <div className={clsx('relative rounded-xl row items-center justify-center overflow-hidden', imageClassName)}>\n <Image src={imageUrl} alt=\"\" className={clsx('z-[2] object-cover', imageClassName)} width={0} height={0} style={{ width: 'auto', height: 'auto' }}/>\n </div>\n <div className=\"absolute top-[6px] left-[6px] z-[3]\">{badge}</div>\n {roleBadge && (\n <div className=\"absolute bottom-0 left-1/2 -translate-x-1/2 translate-y-2/3 z-[4] rounded-md\">\n <Chip color=\"dark\" className=\"font-bold px-3\">{roleBadge}</Chip>\n </div>\n )}\n </div>\n {prefix && <span className=\"font-semibold\">{prefix}</span>}\n <h2 id={name} className=\"textstyle-title-md\">{name}</h2>\n {suffix && <span className=\"text-sm mb-1\">{suffix}</span>}\n {role && <span className=\"font-space font-bold text-sm\">{role}</span>}\n {tags && (\n <div className=\"flex flex-wrap mx-4 mt-2 gap-x-2 justify-center\">\n {tags.map((tag, index) => <span key={index} className=\"textstyle-description text-sm\">{`#${tag}`}</span>)}\n </div>\n )}\n {info && <span className=\"mt-2 text-sm\">{info}</span>}\n {socials && (\n <div className=\"flex flex-wrap grow items-end justify-center gap-x-4 gap-y-2 mt-4\">\n {socials.map((socialIconProps, index) => (\n <SocialIcon key={index} {...socialIconProps} size={socialIconProps.size ?? 20}/>\n ))}\n </div>\n )}\n </div>\n )\n}\n","import type { SVGProps } from 'react'\nimport { clsx } from 'clsx'\n\nexport type HelpwaveProps = SVGProps<SVGSVGElement> & {\n color?: string,\n animate?: 'none' | 'loading' | 'pulse' | 'bounce',\n size?: number,\n}\n\n/**\n * The helpwave loading spinner based on the svg logo.\n */\nexport const Helpwave = ({\n color = 'currentColor',\n animate = 'none',\n size = 64,\n ...props\n}: HelpwaveProps) => {\n const isLoadingAnimation = animate === 'loading'\n let svgAnimationKey = ''\n\n if (animate === 'pulse') {\n svgAnimationKey = 'animate-pulse'\n } else if (animate === 'bounce') {\n svgAnimationKey = 'animate-bounce'\n }\n\n if (size < 0) {\n console.error('size cannot be less than 0')\n size = 64\n }\n\n return (\n <svg\n width={size}\n height={size}\n viewBox=\"0 0 888 888\"\n fill=\"none\"\n strokeLinecap=\"round\"\n strokeWidth={48}\n {...props}\n >\n <g className={clsx(svgAnimationKey)}>\n <path className={clsx({ 'animate-wave-big-left-up': isLoadingAnimation })} d=\"M144 543.235C144 423.259 232.164 326 340.92 326\" stroke={color} strokeDasharray=\"1000\" />\n <path className={clsx({ 'animate-wave-big-right-down': isLoadingAnimation })} d=\"M537.84 544.104C429.084 544.104 340.92 446.844 340.92 326.869\" stroke={color} strokeDasharray=\"1000\" />\n <path className={clsx({ 'animate-wave-small-left-up': isLoadingAnimation })} d=\"M462.223 518.035C462.223 432.133 525.348 362.495 603.217 362.495\" stroke={color} strokeDasharray=\"1000\" />\n <path className={clsx({ 'animate-wave-small-right-down': isLoadingAnimation })} d=\"M745.001 519.773C666.696 519.773 603.218 450.136 603.218 364.233\" stroke={color} strokeDasharray=\"1000\" />\n </g>\n </svg>\n )\n}\n","import type { HTMLProps, PropsWithChildren, ReactNode } from 'react'\nimport clsx from 'clsx'\n\nexport type ChipColor = 'default' | 'dark'| 'red' | 'yellow' | 'green' | 'blue' | 'pink'\ntype ChipVariant = 'normal' | 'fullyRounded'\n\nexport type ChipProps = HTMLProps<HTMLDivElement> & PropsWithChildren<{\n color?: ChipColor,\n variant?: ChipVariant,\n trailingIcon?: ReactNode,\n}>\n\n/**\n * A component for displaying a single chip\n */\nexport const Chip = ({\n children,\n trailingIcon,\n color = 'default',\n variant = 'normal',\n className = '',\n ...restProps\n }: ChipProps) => {\n const colorMapping: string = {\n default: 'text-tag-default-text bg-tag-default-background',\n dark: 'text-tag-dark-text bg-tag-dark-background',\n red: 'text-tag-red-text bg-tag-red-background',\n yellow: 'text-tag-yellow-text bg-tag-yellow-background',\n green: 'text-tag-green-text bg-tag-green-background',\n blue: 'text-tag-blue-text bg-tag-blue-background',\n pink: 'text-tag-pink-text bg-tag-pink-background',\n }[color]\n\n const colorMappingIcon: string = {\n default: 'text-tag-default-icon',\n dark: 'text-tag-dark-icon',\n red: 'text-tag-red-icon',\n yellow: 'text-tag-yellow-icon',\n green: 'text-tag-green-icon',\n blue: 'text-tag-blue-icon',\n pink: 'text-tag-pink-icon',\n }[color]\n\n return (\n <div\n {...restProps}\n className={clsx(\n `row w-fit px-2 py-1`,\n colorMapping,\n {\n 'rounded-md': variant === 'normal',\n 'rounded-full': variant === 'fullyRounded',\n },\n className\n )}\n >\n {children}\n {trailingIcon && (<span className={colorMappingIcon}>{trailingIcon}</span>)}\n </div>\n )\n}\n\nexport type ChipListProps = {\n list: ChipProps[],\n className?: string,\n}\n\n/**\n * A component for displaying a list of chips\n */\nexport const ChipList = ({\n list,\n className = ''\n }: ChipListProps) => {\n return (\n <div className={clsx('flex flex-wrap gap-x-4 gap-y-2', className)}>\n {list.map((value, index) => (\n <Chip\n key={index}\n {...value}\n color={value.color ?? 'dark'}\n variant={value.variant ?? 'normal'}\n >\n {value.children}\n </Chip>\n ))}\n </div>\n )\n}\n"],"mappings":"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","names":["clsx","clsx","jsx","jsxs","jsx","jsxs","clsx"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/ProgressIndicator.tsx"],"sourcesContent":["export type ProgressIndicatorProps = {\n /*\n The amount of progress that has been made\n Value form 0 to 1\n */\n progress: number,\n strokeWidth?: number,\n size?: keyof typeof sizeMapping,\n direction?: 'clockwise' | 'counterclockwise',\n /*\n Rotation of the starting point of the indicator\n default start at 3 o'clock\n Given in degree\n */\n rotation?: number,\n}\n\nconst sizeMapping = { small: 16, medium: 24, big: 48 }\n\n/**\n * A progress indicator\n *\n * Start rotation is 3 o'clock and fills counterclockwise\n *\n * Progress is given from 0 to 1\n */\nexport const ProgressIndicator = ({\n progress,\n strokeWidth = 5,\n size = 'medium',\n direction = 'counterclockwise',\n rotation = 0\n }: ProgressIndicatorProps) => {\n const currentSize = sizeMapping[size]\n const center = currentSize / 2\n const radius = center - strokeWidth / 2\n const arcLength = 2 * Math.PI * radius\n const arcOffset = arcLength * progress\n if (direction === 'clockwise') {\n rotation += 360 * progress\n }\n return (\n <svg\n style={{\n height: `${currentSize}px`,\n width: `${currentSize}px`,\n transform: `rotate(${rotation}deg)`\n }}\n >\n <circle cx={center} cy={center} r={radius} fill=\"transparent\" strokeWidth={strokeWidth}\n className=\"stroke-primary\"\n />\n <circle cx={center} cy={center} r={radius} fill=\"transparent\" strokeWidth={strokeWidth}\n strokeDasharray={arcLength} strokeDashoffset={arcOffset} className=\"stroke-gray-300\"\n />\n </svg>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA0CI;AAzBJ,IAAM,cAAc,EAAE,OAAO,IAAI,QAAQ,IAAI,KAAK,GAAG;AAS9C,IAAM,oBAAoB,CAAC;AAAA,EACE;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,WAAW;AACb,MAA8B;AAC9D,QAAM,cAAc,YAAY,IAAI;AACpC,QAAM,SAAS,cAAc;AAC7B,QAAM,SAAS,SAAS,cAAc;AACtC,QAAM,YAAY,IAAI,KAAK,KAAK;AAChC,QAAM,YAAY,YAAY;AAC9B,MAAI,cAAc,aAAa;AAC7B,gBAAY,MAAM;AAAA,EACpB;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,QAAQ,GAAG,WAAW;AAAA,QACtB,OAAO,GAAG,WAAW;AAAA,QACrB,WAAW,UAAU,QAAQ;AAAA,MAC/B;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YAAO,IAAI;AAAA,YAAQ,IAAI;AAAA,YAAQ,GAAG;AAAA,YAAQ,MAAK;AAAA,YAAc;AAAA,YACtD,WAAU;AAAA;AAAA,QAClB;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YAAO,IAAI;AAAA,YAAQ,IAAI;AAAA,YAAQ,GAAG;AAAA,YAAQ,MAAK;AAAA,YAAc;AAAA,YACtD,iBAAiB;AAAA,YAAW,kBAAkB;AAAA,YAAW,WAAU;AAAA;AAAA,QAC3E;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/ProgressIndicator.tsx"],"sourcesContent":["export type ProgressIndicatorProps = {\n /*\n The amount of progress that has been made\n Value form 0 to 1\n */\n progress: number,\n strokeWidth?: number,\n size?: keyof typeof sizeMapping,\n direction?: 'clockwise' | 'counterclockwise',\n /*\n Rotation of the starting point of the indicator\n default start at 3 o'clock\n Given in degree\n */\n rotation?: number,\n}\n\nconst sizeMapping = { small: 16, medium: 24, big: 48 }\n\n/**\n * A progress indicator\n *\n * Start rotation is 3 o'clock and fills counterclockwise\n *\n * Progress is given from 0 to 1\n */\nexport const ProgressIndicator = ({\n progress,\n strokeWidth = 5,\n size = 'medium',\n direction = 'counterclockwise',\n rotation = 0\n }: ProgressIndicatorProps) => {\n const currentSize = sizeMapping[size]\n const center = currentSize / 2\n const radius = center - strokeWidth / 2\n const arcLength = 2 * Math.PI * radius\n const arcOffset = arcLength * progress\n if (direction === 'clockwise') {\n rotation += 360 * progress\n }\n return (\n <svg\n style={{\n height: `${currentSize}px`,\n width: `${currentSize}px`,\n transform: `rotate(${rotation}deg)`\n }}\n >\n <circle cx={center} cy={center} r={radius} fill=\"transparent\" strokeWidth={strokeWidth}\n className=\"stroke-primary\"\n />\n <circle cx={center} cy={center} r={radius} fill=\"transparent\" strokeWidth={strokeWidth}\n strokeDasharray={arcLength} strokeDashoffset={arcOffset} className=\"stroke-gray-300\"\n />\n </svg>\n )\n}\n"],"mappings":";AA0CI,SAOE,KAPF;AAzBJ,IAAM,cAAc,EAAE,OAAO,IAAI,QAAQ,IAAI,KAAK,GAAG;AAS9C,IAAM,oBAAoB,CAAC;AAAA,EACE;AAAA,EACA,cAAc;AAAA,EACd,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,WAAW;AACb,MAA8B;AAC9D,QAAM,cAAc,YAAY,IAAI;AACpC,QAAM,SAAS,cAAc;AAC7B,QAAM,SAAS,SAAS,cAAc;AACtC,QAAM,YAAY,IAAI,KAAK,KAAK;AAChC,QAAM,YAAY,YAAY;AAC9B,MAAI,cAAc,aAAa;AAC7B,gBAAY,MAAM;AAAA,EACpB;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,QAAQ,GAAG,WAAW;AAAA,QACtB,OAAO,GAAG,WAAW;AAAA,QACrB,WAAW,UAAU,QAAQ;AAAA,MAC/B;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YAAO,IAAI;AAAA,YAAQ,IAAI;AAAA,YAAQ,GAAG;AAAA,YAAQ,MAAK;AAAA,YAAc;AAAA,YACtD,WAAU;AAAA;AAAA,QAClB;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YAAO,IAAI;AAAA,YAAQ,IAAI;AAAA,YAAQ,GAAG;AAAA,YAAQ,MAAK;AAAA,YAAc;AAAA,YACtD,iBAAiB;AAAA,YAAW,kBAAkB;AAAA,YAAW,WAAU;AAAA;AAAA,QAC3E;AAAA;AAAA;AAAA,EACF;AAEJ;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/Ring.tsx","../../src/util/noop.ts","../../src/components/Circle.tsx"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { noop } from '../util/noop'\nimport { Circle } from './Circle'\nimport clsx from 'clsx'\n\nexport type RingProps = {\n innerSize: number, // the size of the entire circle including the circleWidth\n width: number,\n className?: string,\n};\n\nexport const Ring = ({\n innerSize = 20,\n width = 7,\n className = 'outline-primary',\n }: RingProps) => {\n return (\n <div\n className={clsx(`bg-transparent rounded-full outline`, className)}\n style={{\n width: `${innerSize}px`,\n height: `${innerSize}px`,\n outlineWidth: `${width}px`,\n }}\n />\n )\n}\n\nexport type AnimatedRingProps = RingProps & {\n fillAnimationDuration?: number, // in seconds, 0 means no animation\n repeating?: boolean,\n onAnimationFinished?: () => void,\n style?: CSSProperties,\n};\n\nexport const AnimatedRing = ({\n innerSize,\n width,\n className,\n fillAnimationDuration = 3,\n repeating = false,\n onAnimationFinished = noop,\n style,\n }: AnimatedRingProps) => {\n const [currentWidth, setCurrentWidth] = useState(0)\n const milliseconds = 1000 * fillAnimationDuration\n\n const animate = useCallback((timestamp: number, startTime: number) => {\n const progress = Math.min((timestamp - startTime) / milliseconds, 1)\n const newWidth = Math.min(width * progress, width)\n\n setCurrentWidth(newWidth)\n\n if (progress < 1) {\n requestAnimationFrame((newTimestamp) => animate(newTimestamp, startTime))\n } else {\n onAnimationFinished()\n if (repeating) {\n setCurrentWidth(0)\n requestAnimationFrame((newTimestamp) => animate(newTimestamp, newTimestamp))\n }\n }\n }, [milliseconds, onAnimationFinished, repeating, width])\n\n useEffect(() => {\n if (currentWidth < width) {\n requestAnimationFrame((timestamp) => animate(timestamp, timestamp))\n }\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <div\n className=\"row items-center justify-center\"\n style={{\n width: `${innerSize + 2 * width}px`,\n height: `${innerSize + 2 * width}px`,\n ...style,\n }}\n >\n <Ring\n innerSize={innerSize}\n width={currentWidth}\n className={className}\n />\n </div>\n )\n}\n\nexport type RingWaveProps = Omit<AnimatedRingProps, 'innerSize'> & {\n startInnerSize: number,\n endInnerSize: number,\n style?: CSSProperties,\n};\n\nexport const RingWave = ({\n startInnerSize = 20,\n endInnerSize = 30,\n width,\n className,\n fillAnimationDuration = 3,\n repeating = false,\n onAnimationFinished = noop,\n style\n }: RingWaveProps) => {\n const [currentInnerSize, setCurrentInnerSize] = useState(startInnerSize)\n const distance = endInnerSize - startInnerSize\n const milliseconds = 1000 * fillAnimationDuration\n\n const animate = useCallback((timestamp: number, startTime: number) => {\n const progress = Math.min((timestamp - startTime) / milliseconds, 1)\n const newInnerSize = Math.min(\n startInnerSize + distance * progress,\n endInnerSize\n )\n\n setCurrentInnerSize(newInnerSize)\n\n if (progress < 1) {\n requestAnimationFrame((newTimestamp) => animate(newTimestamp, startTime))\n } else {\n onAnimationFinished()\n if (repeating) {\n setCurrentInnerSize(startInnerSize)\n requestAnimationFrame((newTimestamp) => animate(newTimestamp, newTimestamp))\n }\n }\n }, [distance, endInnerSize, milliseconds, onAnimationFinished, repeating, startInnerSize])\n\n useEffect(() => {\n if (currentInnerSize < endInnerSize) {\n requestAnimationFrame((timestamp) => animate(timestamp, timestamp))\n }\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <div\n className=\"row items-center justify-center\"\n style={{\n width: `${endInnerSize + 2 * width}px`,\n height: `${endInnerSize + 2 * width}px`,\n ...style\n }}\n >\n <Ring\n innerSize={currentInnerSize}\n width={width}\n className={className}\n />\n </div>\n )\n}\n\nexport type RadialRingsProps = {\n circle1ClassName?: string,\n circle2ClassName?: string,\n circle3ClassName?: string,\n waveWidth?: number,\n waveBaseColor?: string,\n sizeCircle1?: number,\n sizeCircle2?: number,\n sizeCircle3?: number,\n};\n\n// TODO use fixed colors here to avoid artifacts\nexport const RadialRings = ({\n circle1ClassName = 'bg-primary/90 outline-primary/90',\n circle2ClassName = 'bg-primary/60 outline-primary/60',\n circle3ClassName = 'bg-primary/40 outline-primary/40',\n waveWidth = 10,\n waveBaseColor = 'outline-white/20',\n sizeCircle1 = 100,\n sizeCircle2 = 200,\n sizeCircle3 = 300\n }: RadialRingsProps) => {\n const [currentRing, setCurrentRing] = useState(0)\n const size = sizeCircle3\n\n return (\n <div\n className=\"relative\"\n style={{\n width: `${sizeCircle3}px`,\n height: `${sizeCircle3}px`,\n }}\n >\n <Circle\n radius={sizeCircle1 / 2}\n className={clsx(circle1ClassName, `absolute z-[10] -translate-y-1/2 -translate-x-1/2`)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`\n }}\n />\n {currentRing === 0 ? (\n <AnimatedRing\n innerSize={sizeCircle1}\n width={(sizeCircle2 - sizeCircle1) / 2}\n onAnimationFinished={() =>\n currentRing === 0 ? setCurrentRing(1) : null\n }\n repeating={true}\n className={clsx(circle2ClassName,\n { 'opacity-5': currentRing !== 0 })}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`,\n position: 'absolute',\n translate: `-50% -50%`,\n zIndex: 9\n }}\n />\n ) : null}\n {currentRing === 2 ? (\n <RingWave\n startInnerSize={sizeCircle1 - waveWidth}\n endInnerSize={sizeCircle2}\n width={waveWidth}\n repeating={true}\n className={clsx(waveBaseColor, `opacity-5`)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`,\n position: 'absolute',\n translate: `-50% -50%`,\n zIndex: 9,\n }}\n />\n ) : null}\n <Circle\n radius={sizeCircle2 / 2}\n className={clsx(circle2ClassName,\n { 'opacity-20': currentRing < 1 },\n `absolute z-[8] -translate-y-1/2 -translate-x-1/2`)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`\n }}\n />\n {currentRing === 1 ? (\n <AnimatedRing\n innerSize={sizeCircle2 - 1} // potentially harmful\n width={(sizeCircle3 - sizeCircle2) / 2}\n onAnimationFinished={() =>\n currentRing === 1 ? setCurrentRing(2) : null\n }\n repeating={true}\n className={clsx(circle3ClassName)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`,\n position: 'absolute',\n translate: `-50% -50%`,\n zIndex: 7,\n }}\n />\n ) : null}\n {currentRing === 2 ? (\n <RingWave\n startInnerSize={sizeCircle2}\n endInnerSize={sizeCircle3 - waveWidth}\n width={waveWidth}\n repeating={true}\n className={clsx(waveBaseColor, `opacity-5`)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`,\n position: 'absolute',\n translate: `-50% -50%`,\n zIndex: 7,\n }}\n />\n ) : null}\n <Circle\n radius={sizeCircle3 / 2}\n className={clsx(circle3ClassName,\n { 'opacity-20': currentRing < 2 },\n `absolute z-[6] -translate-y-1/2 -translate-x-1/2`)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`\n }}\n />\n </div>\n )\n}\n","export const noop = () => undefined\n","import type { HTMLAttributes } from 'react'\nimport clsx from 'clsx'\n\nexport type CircleProps = Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'color'> & {\n radius: number,\n className?: string,\n}\n\nexport const Circle = ({\n radius = 20,\n className = 'bg-primary',\n style,\n ...restProps\n}: CircleProps) => {\n const size = radius * 2\n return (\n <div\n className={clsx(`rounded-full`, className)}\n style={{\n width: `${size}px`,\n height: `${size}px`,\n ...style,\n }}\n {...restProps}\n />\n )\n}\n"],"mappings":"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","names":["clsx","import_clsx","import_jsx_runtime","clsx"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/Ring.tsx","../../src/util/noop.ts","../../src/components/Circle.tsx"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { noop } from '../util/noop'\nimport { Circle } from './Circle'\nimport clsx from 'clsx'\n\nexport type RingProps = {\n innerSize: number, // the size of the entire circle including the circleWidth\n width: number,\n className?: string,\n};\n\nexport const Ring = ({\n innerSize = 20,\n width = 7,\n className = 'outline-primary',\n }: RingProps) => {\n return (\n <div\n className={clsx(`bg-transparent rounded-full outline`, className)}\n style={{\n width: `${innerSize}px`,\n height: `${innerSize}px`,\n outlineWidth: `${width}px`,\n }}\n />\n )\n}\n\nexport type AnimatedRingProps = RingProps & {\n fillAnimationDuration?: number, // in seconds, 0 means no animation\n repeating?: boolean,\n onAnimationFinished?: () => void,\n style?: CSSProperties,\n};\n\nexport const AnimatedRing = ({\n innerSize,\n width,\n className,\n fillAnimationDuration = 3,\n repeating = false,\n onAnimationFinished = noop,\n style,\n }: AnimatedRingProps) => {\n const [currentWidth, setCurrentWidth] = useState(0)\n const milliseconds = 1000 * fillAnimationDuration\n\n const animate = useCallback((timestamp: number, startTime: number) => {\n const progress = Math.min((timestamp - startTime) / milliseconds, 1)\n const newWidth = Math.min(width * progress, width)\n\n setCurrentWidth(newWidth)\n\n if (progress < 1) {\n requestAnimationFrame((newTimestamp) => animate(newTimestamp, startTime))\n } else {\n onAnimationFinished()\n if (repeating) {\n setCurrentWidth(0)\n requestAnimationFrame((newTimestamp) => animate(newTimestamp, newTimestamp))\n }\n }\n }, [milliseconds, onAnimationFinished, repeating, width])\n\n useEffect(() => {\n if (currentWidth < width) {\n requestAnimationFrame((timestamp) => animate(timestamp, timestamp))\n }\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <div\n className=\"row items-center justify-center\"\n style={{\n width: `${innerSize + 2 * width}px`,\n height: `${innerSize + 2 * width}px`,\n ...style,\n }}\n >\n <Ring\n innerSize={innerSize}\n width={currentWidth}\n className={className}\n />\n </div>\n )\n}\n\nexport type RingWaveProps = Omit<AnimatedRingProps, 'innerSize'> & {\n startInnerSize: number,\n endInnerSize: number,\n style?: CSSProperties,\n};\n\nexport const RingWave = ({\n startInnerSize = 20,\n endInnerSize = 30,\n width,\n className,\n fillAnimationDuration = 3,\n repeating = false,\n onAnimationFinished = noop,\n style\n }: RingWaveProps) => {\n const [currentInnerSize, setCurrentInnerSize] = useState(startInnerSize)\n const distance = endInnerSize - startInnerSize\n const milliseconds = 1000 * fillAnimationDuration\n\n const animate = useCallback((timestamp: number, startTime: number) => {\n const progress = Math.min((timestamp - startTime) / milliseconds, 1)\n const newInnerSize = Math.min(\n startInnerSize + distance * progress,\n endInnerSize\n )\n\n setCurrentInnerSize(newInnerSize)\n\n if (progress < 1) {\n requestAnimationFrame((newTimestamp) => animate(newTimestamp, startTime))\n } else {\n onAnimationFinished()\n if (repeating) {\n setCurrentInnerSize(startInnerSize)\n requestAnimationFrame((newTimestamp) => animate(newTimestamp, newTimestamp))\n }\n }\n }, [distance, endInnerSize, milliseconds, onAnimationFinished, repeating, startInnerSize])\n\n useEffect(() => {\n if (currentInnerSize < endInnerSize) {\n requestAnimationFrame((timestamp) => animate(timestamp, timestamp))\n }\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <div\n className=\"row items-center justify-center\"\n style={{\n width: `${endInnerSize + 2 * width}px`,\n height: `${endInnerSize + 2 * width}px`,\n ...style\n }}\n >\n <Ring\n innerSize={currentInnerSize}\n width={width}\n className={className}\n />\n </div>\n )\n}\n\nexport type RadialRingsProps = {\n circle1ClassName?: string,\n circle2ClassName?: string,\n circle3ClassName?: string,\n waveWidth?: number,\n waveBaseColor?: string,\n sizeCircle1?: number,\n sizeCircle2?: number,\n sizeCircle3?: number,\n};\n\n// TODO use fixed colors here to avoid artifacts\nexport const RadialRings = ({\n circle1ClassName = 'bg-primary/90 outline-primary/90',\n circle2ClassName = 'bg-primary/60 outline-primary/60',\n circle3ClassName = 'bg-primary/40 outline-primary/40',\n waveWidth = 10,\n waveBaseColor = 'outline-white/20',\n sizeCircle1 = 100,\n sizeCircle2 = 200,\n sizeCircle3 = 300\n }: RadialRingsProps) => {\n const [currentRing, setCurrentRing] = useState(0)\n const size = sizeCircle3\n\n return (\n <div\n className=\"relative\"\n style={{\n width: `${sizeCircle3}px`,\n height: `${sizeCircle3}px`,\n }}\n >\n <Circle\n radius={sizeCircle1 / 2}\n className={clsx(circle1ClassName, `absolute z-[10] -translate-y-1/2 -translate-x-1/2`)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`\n }}\n />\n {currentRing === 0 ? (\n <AnimatedRing\n innerSize={sizeCircle1}\n width={(sizeCircle2 - sizeCircle1) / 2}\n onAnimationFinished={() =>\n currentRing === 0 ? setCurrentRing(1) : null\n }\n repeating={true}\n className={clsx(circle2ClassName,\n { 'opacity-5': currentRing !== 0 })}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`,\n position: 'absolute',\n translate: `-50% -50%`,\n zIndex: 9\n }}\n />\n ) : null}\n {currentRing === 2 ? (\n <RingWave\n startInnerSize={sizeCircle1 - waveWidth}\n endInnerSize={sizeCircle2}\n width={waveWidth}\n repeating={true}\n className={clsx(waveBaseColor, `opacity-5`)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`,\n position: 'absolute',\n translate: `-50% -50%`,\n zIndex: 9,\n }}\n />\n ) : null}\n <Circle\n radius={sizeCircle2 / 2}\n className={clsx(circle2ClassName,\n { 'opacity-20': currentRing < 1 },\n `absolute z-[8] -translate-y-1/2 -translate-x-1/2`)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`\n }}\n />\n {currentRing === 1 ? (\n <AnimatedRing\n innerSize={sizeCircle2 - 1} // potentially harmful\n width={(sizeCircle3 - sizeCircle2) / 2}\n onAnimationFinished={() =>\n currentRing === 1 ? setCurrentRing(2) : null\n }\n repeating={true}\n className={clsx(circle3ClassName)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`,\n position: 'absolute',\n translate: `-50% -50%`,\n zIndex: 7,\n }}\n />\n ) : null}\n {currentRing === 2 ? (\n <RingWave\n startInnerSize={sizeCircle2}\n endInnerSize={sizeCircle3 - waveWidth}\n width={waveWidth}\n repeating={true}\n className={clsx(waveBaseColor, `opacity-5`)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`,\n position: 'absolute',\n translate: `-50% -50%`,\n zIndex: 7,\n }}\n />\n ) : null}\n <Circle\n radius={sizeCircle3 / 2}\n className={clsx(circle3ClassName,\n { 'opacity-20': currentRing < 2 },\n `absolute z-[6] -translate-y-1/2 -translate-x-1/2`)}\n style={{\n left: `${size / 2}px`,\n top: `${size / 2}px`\n }}\n />\n </div>\n )\n}\n","export const noop = () => undefined\n","import type { HTMLAttributes } from 'react'\nimport clsx from 'clsx'\n\nexport type CircleProps = Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'color'> & {\n radius: number,\n className?: string,\n}\n\nexport const Circle = ({\n radius = 20,\n className = 'bg-primary',\n style,\n ...restProps\n}: CircleProps) => {\n const size = radius * 2\n return (\n <div\n className={clsx(`rounded-full`, className)}\n style={{\n width: `${size}px`,\n height: `${size}px`,\n ...style,\n }}\n {...restProps}\n />\n )\n}\n"],"mappings":"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","names":["clsx","jsx"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/SearchableList.tsx","../../src/hooks/useLanguage.tsx","../../src/hooks/useLocalStorage.tsx","../../src/hooks/useTranslation.ts","../../src/util/simpleSearch.ts","../../src/components/user-input/Input.tsx","../../src/hooks/useSaveDelay.ts","../../src/util/noop.ts","../../src/components/user-input/Label.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport { useEffect, useMemo, useState } from 'react'\nimport { Search } from 'lucide-react'\nimport clsx from 'clsx'\nimport type { Languages } from '../hooks/useLanguage'\nimport { useTranslation } from '../hooks/useTranslation'\nimport type { PropsForTranslation } from '../hooks/useTranslation'\nimport { MultiSearchWithMapping } from '../util/simpleSearch'\nimport { Input } from './user-input/Input'\n\ntype SearchableListTranslation = {\n search: string,\n nothingFound: string,\n}\n\nconst defaultSearchableListTranslation: Record<Languages, SearchableListTranslation> = {\n en: {\n search: 'Search',\n nothingFound: 'Nothing found'\n },\n de: {\n search: 'Suche',\n nothingFound: 'Nichts gefunden'\n }\n}\n\nexport type SearchableListProps<T> = {\n list: T[],\n initialSearch?: string,\n searchMapping: (value: T) => string[],\n itemMapper: (value: T) => ReactNode,\n className?: string,\n}\n\n/**\n * A component for searching a list\n */\nexport const SearchableList = <T, >({\n overwriteTranslation,\n list,\n initialSearch = '',\n searchMapping,\n itemMapper,\n className\n}: PropsForTranslation<SearchableListTranslation, SearchableListProps<T>>) => {\n const translation = useTranslation(defaultSearchableListTranslation, overwriteTranslation)\n const [search, setSearch] = useState<string>(initialSearch)\n\n useEffect(() => setSearch(initialSearch), [initialSearch])\n\n const filteredEntries = useMemo(() => MultiSearchWithMapping(search, list, searchMapping), [search, list, searchMapping])\n\n return (\n <div className={clsx('col gap-y-2', className)}>\n <div className=\"row justify-between gap-x-2 items-center\">\n <div className=\"flex-1\">\n <Input value={search} onChange={setSearch} placeholder={translation.search}/>\n </div>\n <Search size={20}/>\n </div>\n {filteredEntries.length > 0 && (\n <div className=\"col gap-y-1\">\n {filteredEntries.map(itemMapper)}\n </div>\n )}\n {!filteredEntries.length && <div className=\"row justify-center\">{translation.nothingFound}</div>}\n </div>\n )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from './useLocalStorage'\n\nexport const languages = ['en', 'de'] as const\nexport type Languages = typeof languages[number]\nexport const languagesLocalNames: Record<Languages, string> = {\n en: 'English',\n de: 'Deutsch',\n}\n\nexport const DEFAULT_LANGUAGE = 'en'\n\nexport type LanguageContextValue = {\n language: Languages,\n setLanguage: Dispatch<SetStateAction<Languages>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({ language: DEFAULT_LANGUAGE, setLanguage: (v) => v })\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Languages) => {\n const { language } = useLanguage()\n const mapping: Record<Languages, string> = {\n en: 'en-US',\n de: 'de-DE'\n }\n return mapping[overWriteLanguage ?? language]\n}\n\ntype ProvideLanguageProps = {\n initialLanguage?: Languages,\n}\n\nexport const ProvideLanguage = ({ initialLanguage, children }: PropsWithChildren<ProvideLanguageProps>) => {\n const [language, setLanguage] = useState<Languages>(initialLanguage ?? DEFAULT_LANGUAGE)\n const [storedLanguage, setStoredLanguage] = useLocalStorage<Languages>('language', initialLanguage ?? DEFAULT_LANGUAGE)\n\n useEffect(() => {\n if(language !== initialLanguage && initialLanguage){\n console.warn('LanguageProvider initial state changed: Prefer using useLanguages\\'s setLanguage instead')\n setLanguage(initialLanguage)\n }\n }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n useEffect(() => {\n // TODO set locale of html tag here as well\n setStoredLanguage(language)\n }, [language, setStoredLanguage])\n\n useEffect(() => {\n if (storedLanguage !== null) {\n setLanguage(storedLanguage)\n return\n }\n\n const languagesToTestAgainst = Object.values(languages)\n\n const matchingBrowserLanguages = window.navigator.languages\n .map(language => languagesToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n .filter(entry => entry !== undefined)\n\n if (matchingBrowserLanguages.length === 0) return\n\n const firstMatch = matchingBrowserLanguages[0] as Languages\n setLanguage(firstMatch)\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <LanguageContext.Provider value={{\n language,\n setLanguage\n }}>\n {children}\n </LanguageContext.Provider>\n )\n}\n","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T, >(key: string, initValue: T): [T, SetValue<T>] => {\n const get = useCallback((): T => {\n if (typeof window === 'undefined') {\n return initValue\n }\n const storageService = new LocalStorageService()\n const value = storageService.get<T>(key)\n return value || initValue\n }, [initValue, key])\n\n const [storedValue, setStoredValue] = useState<T>(get)\n\n const setValue: SetValue<T> = useCallback(value => {\n const newValue = value instanceof Function ? value(storedValue) : value\n const storageService = new LocalStorageService()\n storageService.set(key, value)\n\n setStoredValue(newValue)\n }, [storedValue, setStoredValue, key])\n\n useEffect(() => {\n setStoredValue(get())\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return [storedValue, setValue]\n}","import type { Languages } from './useLanguage'\nimport { useLanguage } from './useLanguage'\n\nexport type Translation<T> = Record<Languages, T>\n\ntype OverwriteTranslationType<Translation extends Record<string, unknown>> = {\n language?: Languages,\n translation?: Partial<Record<Languages, Partial<Translation>>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n * if you don't expect any other props other than `language` and get an\n * error when using your component (because it uses `forwardRef` etc.)\n * you can try out `Record<string, unknown>`, this might resolve your\n * problem as `SomeType & never` is still `never` but `SomeType & unknown`\n * is `SomeType` which means that adding back props (like `ref` etc.)\n * works properly\n */\nexport type PropsForTranslation<\n Translation extends Record<string, unknown>,\n Props = Record<string, never>\n> = Props & {\n overwriteTranslation?: OverwriteTranslationType<Translation>,\n};\n\nexport const useTranslation = <Translation extends Record<string, unknown>>(\n defaults: Record<Languages, Translation>,\n translationOverwrite: OverwriteTranslationType<Translation> = {}\n) : Translation => {\n const { language: languageProp, translation: overwrite } = translationOverwrite\n const { language: inferredLanguage } = useLanguage()\n const usedLanguage = languageProp ?? inferredLanguage\n let defaultValues: Translation = defaults[usedLanguage]\n if (overwrite && overwrite[usedLanguage]) {\n defaultValues = { ...defaultValues, ...overwrite[usedLanguage] }\n }\n return defaultValues\n}\n","/**\n * Finds all values matching the search values by first mapping the values to a string array and then checking each entry for matches.\n * Returns the list of all matches.\n *\n * @param search The list of search strings e.g. `[name, type]`\n *\n * @param objects The list of objects to be searched in\n *\n * @param mapping The mapping of objects to the string properties they fulfil\n *\n * @return The list of objects that match all search strings\n */\nexport const MultiSubjectSearchWithMapping = <T>(search: string[], objects: T[], mapping: (value:T) => (string| undefined)[]) => {\n return objects.filter(object => {\n const mappedSearchKeywords = mapping(object).map(value => value ? value.toLowerCase().trim() : undefined)\n return search.every(searchValue => !!mappedSearchKeywords.find(value => !!value && value.includes(searchValue.toLowerCase().trim())))\n })\n}\n\n/**\n * Finds all values matching the search value by first mapping the values to a string array and then checking each entry for matches.\n * Returns the list of all matches.\n *\n * @param search The search string e.g `name`\n *\n * @param objects The list of objects to be searched in\n *\n * @param mapping The mapping of objects to the string properties they fulfil\n *\n * @return The list of objects that match the search string\n */\nexport const MultiSearchWithMapping = <T>(search: string, objects: T[], mapping: (value:T) => string[]) => {\n return objects.filter(object => {\n const mappedSearchKeywords = mapping(object).map(value => value.toLowerCase().trim())\n return !!mappedSearchKeywords.find(value => value.includes(search.toLowerCase().trim()))\n })\n}\n\n/**\n * Finds all values matching the search value by first mapping the values to a string and returns the list of all matches.\n *\n * @param search The search string e.g `name`\n *\n * @param objects The list of objects to be searched in\n *\n * @param mapping The mapping of objects to a string that is compared to the search\n *\n * @return The list of objects that match the search string\n */\nexport const SimpleSearchWithMapping = <T>(search: string, objects: T[], mapping: (value:T) => string) => {\n return MultiSearchWithMapping(search, objects, value => [mapping(value)])\n}\n\n/**\n * Finds all values matching the search value and returns the list of all matches.\n *\n * @param search The search string e.g `name`\n *\n * @param objects The list of objects to be searched in\n *\n * @return The list of objects that match the search string\n */\nexport const SimpleSearch = (search: string, objects: string[]) => {\n return SimpleSearchWithMapping(search, objects, value => value)\n}\n","import React, {\n useEffect,\n useRef,\n useState,\n type ChangeEvent,\n type HTMLInputTypeAttribute,\n type InputHTMLAttributes, forwardRef\n} from 'react'\nimport clsx from 'clsx'\nimport { useSaveDelay } from '../../hooks/useSaveDelay'\nimport { noop } from '../../util/noop'\nimport type { LabelProps } from './Label'\nimport { Label } from './Label'\n\nexport type InputProps = {\n /**\n * used for the label's `for` attribute\n */\n id?: string,\n value: string,\n label?: Omit<LabelProps, 'id'>,\n /**\n * @default 'text'\n */\n type?: HTMLInputTypeAttribute,\n /**\n * Callback for when the input's value changes\n * This is pretty much required but made optional for the rare cases where it actually isn't need such as when used with disabled\n * That could be enforced through a union type but that seems a bit overkill\n * @default noop\n */\n onChange?: (text: string, event: ChangeEvent<HTMLInputElement>) => void,\n onChangeEvent?: (event: ChangeEvent<HTMLInputElement>) => void,\n className?: string,\n onEditCompleted?: (text: string, event: ChangeEvent<HTMLInputElement>) => void,\n expanded?: boolean,\n containerClassName?: string,\n} & Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'value' | 'label' | 'type' | 'onChange' | 'crossOrigin'>\n\n/**\n * A Component for inputting text or other information\n *\n * Its state is managed must be managed by the parent\n */\nconst ControlledInput = ({\n id,\n type = 'text',\n value,\n label,\n onChange = noop,\n onChangeEvent = noop,\n className = '',\n onEditCompleted,\n expanded = true,\n onBlur,\n containerClassName,\n ...restProps\n }: InputProps) => {\n const {\n restartTimer,\n clearUpdateTimer\n } = useSaveDelay(() => undefined, 3000)\n const ref = useRef<HTMLInputElement>(null)\n\n useEffect(() => {\n if (restProps.autoFocus) {\n ref.current?.focus()\n }\n }, [restProps.autoFocus])\n return (\n <div className={clsx({ 'w-full': expanded }, containerClassName)}>\n {label && <Label {...label} htmlFor={id} className={clsx('mb-1', label.className)}/>}\n <input\n ref={ref}\n value={value}\n id={id}\n type={type}\n className={clsx('block bg-surface text-on-surface px-3 py-2 rounded-md w-full border-2 border-gray-200 hover:border-primary focus:outline-none focus:border-primary focus:ring-primary', className)}\n onBlur={event => {\n if (onBlur) {\n onBlur(event)\n }\n if (onEditCompleted) {\n onEditCompleted(event.target.value, event)\n clearUpdateTimer()\n }\n }}\n onChange={e => {\n const value = e.target.value\n if (onEditCompleted) {\n restartTimer(() => {\n onEditCompleted(value, e)\n clearUpdateTimer()\n })\n }\n onChange(value, e)\n onChangeEvent(e)\n }}\n {...restProps}\n />\n </div>\n )\n}\n\ntype UncontrolledInputProps = Omit<InputProps, 'value'> & {\n /**\n * @default ''\n */\n defaultValue?: string,\n}\n\n/**\n * A Component for inputting text or other information\n *\n * Its state is managed by the component itself\n */\nconst UncontrolledInput = ({\n defaultValue = '',\n onChange = noop,\n ...props\n }: UncontrolledInputProps) => {\n const [value, setValue] = useState(defaultValue)\n\n const handleChange = (text: string, event: ChangeEvent<HTMLInputElement>) => {\n setValue(text)\n onChange(text, event)\n }\n\n return (\n <ControlledInput\n {...props}\n value={value}\n onChange={handleChange}\n />\n )\n}\n\nexport type FormInputProps = InputHTMLAttributes<HTMLInputElement> & {\n id: string,\n labelText?: string,\n errorText?: string,\n labelClassName?: string,\n errorClassName?: string,\n containerClassName?: string,\n}\n\nconst FormInput = forwardRef<HTMLInputElement, FormInputProps>(function FormInput({\n id,\n labelText,\n errorText,\n className,\n labelClassName,\n errorClassName,\n containerClassName,\n required,\n ...restProps\n }, ref) {\n const input = (\n <input\n ref={ref}\n id={id}\n {...restProps}\n className={clsx(\n 'block bg-surface text-on-surface px-3 py-2 rounded-md w-full border-2 border-gray-200 hover:border-primary focus:outline-none focus:border-primary focus:ring-primary',\n {\n 'focus:border-primary focus:ring-primary': !errorText,\n 'focus:border-negative focus:ring-negative text-negative': !!errorText,\n },\n className\n )}\n />\n )\n\n return (\n <div className={clsx('flex flex-col gap-y-1', containerClassName)}>\n {labelText && (\n <label htmlFor={id} className={clsx('textstyle-label-md', labelClassName)}>\n {labelText}\n {required && <span className=\"text-primary font-bold\">*</span>}\n </label>\n )}\n {input}\n {errorText && <label htmlFor={id} className={clsx('text-negative', errorClassName)}>{errorText}</label>}\n </div>\n )\n})\n\nexport {\n UncontrolledInput,\n ControlledInput as Input,\n FormInput\n}\n","import { useEffect, useState } from 'react'\n\nexport function useSaveDelay(setNotificationStatus: (isShowing: boolean) => void, delay: number) {\n const [updateTimer, setUpdateTimer] = useState<NodeJS.Timeout | undefined>(undefined)\n const [notificationTimer, setNotificationTimer] = useState<NodeJS.Timeout | undefined>(undefined)\n\n const restartTimer = (onSave: () => void) => {\n clearTimeout(updateTimer)\n setUpdateTimer(setTimeout(() => {\n onSave()\n setNotificationStatus(true)\n // Show Saved Notification for fade animation duration\n clearTimeout(notificationTimer)\n setNotificationTimer(setTimeout(() => {\n setNotificationStatus(false)\n clearTimeout(notificationTimer)\n }, delay))\n clearTimeout(updateTimer)\n }, delay))\n }\n\n const clearUpdateTimer = (hasSaved = true) => {\n clearTimeout(updateTimer)\n if (hasSaved) {\n setNotificationStatus(true)\n clearTimeout(notificationTimer)\n setNotificationTimer(setTimeout(() => {\n setNotificationStatus(false)\n clearTimeout(notificationTimer)\n }, delay))\n } else {\n setNotificationStatus(false)\n }\n }\n\n useEffect(() => {\n return () => {\n clearTimeout(updateTimer)\n clearTimeout(notificationTimer)\n }\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return { restartTimer, clearUpdateTimer }\n}","export const noop = () => undefined\n","import type { LabelHTMLAttributes } from 'react'\n\nexport type LabelType = 'labelSmall' | 'labelMedium' | 'labelBig'\nconst styleMapping: Record<LabelType, string> = {\n labelSmall: 'textstyle-label-sm',\n labelMedium: 'textstyle-label-md',\n labelBig: 'textstyle-label-lg',\n}\n\n\nexport type LabelProps = {\n /** The text for the label */\n name?: string,\n /** The styling for the label */\n labelType?: LabelType,\n} & LabelHTMLAttributes<HTMLLabelElement>\n\n/**\n * A Label component\n */\nexport const Label = ({\n children,\n name,\n labelType = 'labelSmall',\n ...props\n}: LabelProps) => {\n return (\n <label {...props}>\n {children ? children : (<span className={styleMapping[labelType]}>{name}</span>)}\n </label>\n )\n}\n"],"mappings":"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","names":["import_react","import_clsx","import_react","import_react","import_react","import_jsx_runtime","import_jsx_runtime","clsx","value","FormInput","clsx","import_jsx_runtime","clsx"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/SearchableList.tsx","../../src/hooks/useLanguage.tsx","../../src/hooks/useLocalStorage.tsx","../../src/hooks/useTranslation.ts","../../src/util/simpleSearch.ts","../../src/components/user-input/Input.tsx","../../src/hooks/useSaveDelay.ts","../../src/util/noop.ts","../../src/components/user-input/Label.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\nimport { useEffect, useMemo, useState } from 'react'\nimport { Search } from 'lucide-react'\nimport clsx from 'clsx'\nimport type { Languages } from '../hooks/useLanguage'\nimport { useTranslation } from '../hooks/useTranslation'\nimport type { PropsForTranslation } from '../hooks/useTranslation'\nimport { MultiSearchWithMapping } from '../util/simpleSearch'\nimport { Input } from './user-input/Input'\n\ntype SearchableListTranslation = {\n search: string,\n nothingFound: string,\n}\n\nconst defaultSearchableListTranslation: Record<Languages, SearchableListTranslation> = {\n en: {\n search: 'Search',\n nothingFound: 'Nothing found'\n },\n de: {\n search: 'Suche',\n nothingFound: 'Nichts gefunden'\n }\n}\n\nexport type SearchableListProps<T> = {\n list: T[],\n initialSearch?: string,\n searchMapping: (value: T) => string[],\n itemMapper: (value: T) => ReactNode,\n className?: string,\n}\n\n/**\n * A component for searching a list\n */\nexport const SearchableList = <T, >({\n overwriteTranslation,\n list,\n initialSearch = '',\n searchMapping,\n itemMapper,\n className\n}: PropsForTranslation<SearchableListTranslation, SearchableListProps<T>>) => {\n const translation = useTranslation(defaultSearchableListTranslation, overwriteTranslation)\n const [search, setSearch] = useState<string>(initialSearch)\n\n useEffect(() => setSearch(initialSearch), [initialSearch])\n\n const filteredEntries = useMemo(() => MultiSearchWithMapping(search, list, searchMapping), [search, list, searchMapping])\n\n return (\n <div className={clsx('col gap-y-2', className)}>\n <div className=\"row justify-between gap-x-2 items-center\">\n <div className=\"flex-1\">\n <Input value={search} onChange={setSearch} placeholder={translation.search}/>\n </div>\n <Search size={20}/>\n </div>\n {filteredEntries.length > 0 && (\n <div className=\"col gap-y-1\">\n {filteredEntries.map(itemMapper)}\n </div>\n )}\n {!filteredEntries.length && <div className=\"row justify-center\">{translation.nothingFound}</div>}\n </div>\n )\n}\n","import type { Dispatch, PropsWithChildren, SetStateAction } from 'react'\nimport { createContext, useContext, useEffect, useState } from 'react'\nimport { useLocalStorage } from './useLocalStorage'\n\nexport const languages = ['en', 'de'] as const\nexport type Languages = typeof languages[number]\nexport const languagesLocalNames: Record<Languages, string> = {\n en: 'English',\n de: 'Deutsch',\n}\n\nexport const DEFAULT_LANGUAGE = 'en'\n\nexport type LanguageContextValue = {\n language: Languages,\n setLanguage: Dispatch<SetStateAction<Languages>>,\n}\n\nexport const LanguageContext = createContext<LanguageContextValue>({ language: DEFAULT_LANGUAGE, setLanguage: (v) => v })\n\nexport const useLanguage = () => useContext(LanguageContext)\n\nexport const useLocale = (overWriteLanguage?: Languages) => {\n const { language } = useLanguage()\n const mapping: Record<Languages, string> = {\n en: 'en-US',\n de: 'de-DE'\n }\n return mapping[overWriteLanguage ?? language]\n}\n\ntype ProvideLanguageProps = {\n initialLanguage?: Languages,\n}\n\nexport const ProvideLanguage = ({ initialLanguage, children }: PropsWithChildren<ProvideLanguageProps>) => {\n const [language, setLanguage] = useState<Languages>(initialLanguage ?? DEFAULT_LANGUAGE)\n const [storedLanguage, setStoredLanguage] = useLocalStorage<Languages>('language', initialLanguage ?? DEFAULT_LANGUAGE)\n\n useEffect(() => {\n if(language !== initialLanguage && initialLanguage){\n console.warn('LanguageProvider initial state changed: Prefer using useLanguages\\'s setLanguage instead')\n setLanguage(initialLanguage)\n }\n }, [initialLanguage]) // eslint-disable-line react-hooks/exhaustive-deps\n\n useEffect(() => {\n // TODO set locale of html tag here as well\n setStoredLanguage(language)\n }, [language, setStoredLanguage])\n\n useEffect(() => {\n if (storedLanguage !== null) {\n setLanguage(storedLanguage)\n return\n }\n\n const languagesToTestAgainst = Object.values(languages)\n\n const matchingBrowserLanguages = window.navigator.languages\n .map(language => languagesToTestAgainst.find((test) => language === test || language.split('-')[0] === test))\n .filter(entry => entry !== undefined)\n\n if (matchingBrowserLanguages.length === 0) return\n\n const firstMatch = matchingBrowserLanguages[0] as Languages\n setLanguage(firstMatch)\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <LanguageContext.Provider value={{\n language,\n setLanguage\n }}>\n {children}\n </LanguageContext.Provider>\n )\n}\n","import type { Dispatch, SetStateAction } from 'react'\nimport { useCallback, useEffect, useState } from 'react'\nimport { LocalStorageService } from '../util/storage'\n\ntype SetValue<T> = Dispatch<SetStateAction<T>>\nexport const useLocalStorage = <T, >(key: string, initValue: T): [T, SetValue<T>] => {\n const get = useCallback((): T => {\n if (typeof window === 'undefined') {\n return initValue\n }\n const storageService = new LocalStorageService()\n const value = storageService.get<T>(key)\n return value || initValue\n }, [initValue, key])\n\n const [storedValue, setStoredValue] = useState<T>(get)\n\n const setValue: SetValue<T> = useCallback(value => {\n const newValue = value instanceof Function ? value(storedValue) : value\n const storageService = new LocalStorageService()\n storageService.set(key, value)\n\n setStoredValue(newValue)\n }, [storedValue, setStoredValue, key])\n\n useEffect(() => {\n setStoredValue(get())\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return [storedValue, setValue]\n}","import type { Languages } from './useLanguage'\nimport { useLanguage } from './useLanguage'\n\nexport type Translation<T> = Record<Languages, T>\n\ntype OverwriteTranslationType<Translation extends Record<string, unknown>> = {\n language?: Languages,\n translation?: Partial<Record<Languages, Partial<Translation>>>,\n}\n\n/**\n * Adds the `language` prop to the component props.\n *\n * @param Translation the type of the translation object\n *\n * @param Props the type of the component props, defaults to `Record<string, never>`,\n * if you don't expect any other props other than `language` and get an\n * error when using your component (because it uses `forwardRef` etc.)\n * you can try out `Record<string, unknown>`, this might resolve your\n * problem as `SomeType & never` is still `never` but `SomeType & unknown`\n * is `SomeType` which means that adding back props (like `ref` etc.)\n * works properly\n */\nexport type PropsForTranslation<\n Translation extends Record<string, unknown>,\n Props = Record<string, never>\n> = Props & {\n overwriteTranslation?: OverwriteTranslationType<Translation>,\n};\n\nexport const useTranslation = <Translation extends Record<string, unknown>>(\n defaults: Record<Languages, Translation>,\n translationOverwrite: OverwriteTranslationType<Translation> = {}\n) : Translation => {\n const { language: languageProp, translation: overwrite } = translationOverwrite\n const { language: inferredLanguage } = useLanguage()\n const usedLanguage = languageProp ?? inferredLanguage\n let defaultValues: Translation = defaults[usedLanguage]\n if (overwrite && overwrite[usedLanguage]) {\n defaultValues = { ...defaultValues, ...overwrite[usedLanguage] }\n }\n return defaultValues\n}\n","/**\n * Finds all values matching the search values by first mapping the values to a string array and then checking each entry for matches.\n * Returns the list of all matches.\n *\n * @param search The list of search strings e.g. `[name, type]`\n *\n * @param objects The list of objects to be searched in\n *\n * @param mapping The mapping of objects to the string properties they fulfil\n *\n * @return The list of objects that match all search strings\n */\nexport const MultiSubjectSearchWithMapping = <T>(search: string[], objects: T[], mapping: (value:T) => (string| undefined)[]) => {\n return objects.filter(object => {\n const mappedSearchKeywords = mapping(object).map(value => value ? value.toLowerCase().trim() : undefined)\n return search.every(searchValue => !!mappedSearchKeywords.find(value => !!value && value.includes(searchValue.toLowerCase().trim())))\n })\n}\n\n/**\n * Finds all values matching the search value by first mapping the values to a string array and then checking each entry for matches.\n * Returns the list of all matches.\n *\n * @param search The search string e.g `name`\n *\n * @param objects The list of objects to be searched in\n *\n * @param mapping The mapping of objects to the string properties they fulfil\n *\n * @return The list of objects that match the search string\n */\nexport const MultiSearchWithMapping = <T>(search: string, objects: T[], mapping: (value:T) => string[]) => {\n return objects.filter(object => {\n const mappedSearchKeywords = mapping(object).map(value => value.toLowerCase().trim())\n return !!mappedSearchKeywords.find(value => value.includes(search.toLowerCase().trim()))\n })\n}\n\n/**\n * Finds all values matching the search value by first mapping the values to a string and returns the list of all matches.\n *\n * @param search The search string e.g `name`\n *\n * @param objects The list of objects to be searched in\n *\n * @param mapping The mapping of objects to a string that is compared to the search\n *\n * @return The list of objects that match the search string\n */\nexport const SimpleSearchWithMapping = <T>(search: string, objects: T[], mapping: (value:T) => string) => {\n return MultiSearchWithMapping(search, objects, value => [mapping(value)])\n}\n\n/**\n * Finds all values matching the search value and returns the list of all matches.\n *\n * @param search The search string e.g `name`\n *\n * @param objects The list of objects to be searched in\n *\n * @return The list of objects that match the search string\n */\nexport const SimpleSearch = (search: string, objects: string[]) => {\n return SimpleSearchWithMapping(search, objects, value => value)\n}\n","import React, {\n useEffect,\n useRef,\n useState,\n type ChangeEvent,\n type HTMLInputTypeAttribute,\n type InputHTMLAttributes, forwardRef\n} from 'react'\nimport clsx from 'clsx'\nimport { useSaveDelay } from '../../hooks/useSaveDelay'\nimport { noop } from '../../util/noop'\nimport type { LabelProps } from './Label'\nimport { Label } from './Label'\n\nexport type InputProps = {\n /**\n * used for the label's `for` attribute\n */\n id?: string,\n value: string,\n label?: Omit<LabelProps, 'id'>,\n /**\n * @default 'text'\n */\n type?: HTMLInputTypeAttribute,\n /**\n * Callback for when the input's value changes\n * This is pretty much required but made optional for the rare cases where it actually isn't need such as when used with disabled\n * That could be enforced through a union type but that seems a bit overkill\n * @default noop\n */\n onChange?: (text: string, event: ChangeEvent<HTMLInputElement>) => void,\n onChangeEvent?: (event: ChangeEvent<HTMLInputElement>) => void,\n className?: string,\n onEditCompleted?: (text: string, event: ChangeEvent<HTMLInputElement>) => void,\n expanded?: boolean,\n containerClassName?: string,\n} & Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'value' | 'label' | 'type' | 'onChange' | 'crossOrigin'>\n\n/**\n * A Component for inputting text or other information\n *\n * Its state is managed must be managed by the parent\n */\nconst ControlledInput = ({\n id,\n type = 'text',\n value,\n label,\n onChange = noop,\n onChangeEvent = noop,\n className = '',\n onEditCompleted,\n expanded = true,\n onBlur,\n containerClassName,\n ...restProps\n }: InputProps) => {\n const {\n restartTimer,\n clearUpdateTimer\n } = useSaveDelay(() => undefined, 3000)\n const ref = useRef<HTMLInputElement>(null)\n\n useEffect(() => {\n if (restProps.autoFocus) {\n ref.current?.focus()\n }\n }, [restProps.autoFocus])\n return (\n <div className={clsx({ 'w-full': expanded }, containerClassName)}>\n {label && <Label {...label} htmlFor={id} className={clsx('mb-1', label.className)}/>}\n <input\n ref={ref}\n value={value}\n id={id}\n type={type}\n className={clsx('block bg-surface text-on-surface px-3 py-2 rounded-md w-full border-2 border-gray-200 hover:border-primary focus:outline-none focus:border-primary focus:ring-primary', className)}\n onBlur={event => {\n if (onBlur) {\n onBlur(event)\n }\n if (onEditCompleted) {\n onEditCompleted(event.target.value, event)\n clearUpdateTimer()\n }\n }}\n onChange={e => {\n const value = e.target.value\n if (onEditCompleted) {\n restartTimer(() => {\n onEditCompleted(value, e)\n clearUpdateTimer()\n })\n }\n onChange(value, e)\n onChangeEvent(e)\n }}\n {...restProps}\n />\n </div>\n )\n}\n\ntype UncontrolledInputProps = Omit<InputProps, 'value'> & {\n /**\n * @default ''\n */\n defaultValue?: string,\n}\n\n/**\n * A Component for inputting text or other information\n *\n * Its state is managed by the component itself\n */\nconst UncontrolledInput = ({\n defaultValue = '',\n onChange = noop,\n ...props\n }: UncontrolledInputProps) => {\n const [value, setValue] = useState(defaultValue)\n\n const handleChange = (text: string, event: ChangeEvent<HTMLInputElement>) => {\n setValue(text)\n onChange(text, event)\n }\n\n return (\n <ControlledInput\n {...props}\n value={value}\n onChange={handleChange}\n />\n )\n}\n\nexport type FormInputProps = InputHTMLAttributes<HTMLInputElement> & {\n id: string,\n labelText?: string,\n errorText?: string,\n labelClassName?: string,\n errorClassName?: string,\n containerClassName?: string,\n}\n\nconst FormInput = forwardRef<HTMLInputElement, FormInputProps>(function FormInput({\n id,\n labelText,\n errorText,\n className,\n labelClassName,\n errorClassName,\n containerClassName,\n required,\n ...restProps\n }, ref) {\n const input = (\n <input\n ref={ref}\n id={id}\n {...restProps}\n className={clsx(\n 'block bg-surface text-on-surface px-3 py-2 rounded-md w-full border-2 border-gray-200 hover:border-primary focus:outline-none focus:border-primary focus:ring-primary',\n {\n 'focus:border-primary focus:ring-primary': !errorText,\n 'focus:border-negative focus:ring-negative text-negative': !!errorText,\n },\n className\n )}\n />\n )\n\n return (\n <div className={clsx('flex flex-col gap-y-1', containerClassName)}>\n {labelText && (\n <label htmlFor={id} className={clsx('textstyle-label-md', labelClassName)}>\n {labelText}\n {required && <span className=\"text-primary font-bold\">*</span>}\n </label>\n )}\n {input}\n {errorText && <label htmlFor={id} className={clsx('text-negative', errorClassName)}>{errorText}</label>}\n </div>\n )\n})\n\nexport {\n UncontrolledInput,\n ControlledInput as Input,\n FormInput\n}\n","import { useEffect, useState } from 'react'\n\nexport function useSaveDelay(setNotificationStatus: (isShowing: boolean) => void, delay: number) {\n const [updateTimer, setUpdateTimer] = useState<NodeJS.Timeout | undefined>(undefined)\n const [notificationTimer, setNotificationTimer] = useState<NodeJS.Timeout | undefined>(undefined)\n\n const restartTimer = (onSave: () => void) => {\n clearTimeout(updateTimer)\n setUpdateTimer(setTimeout(() => {\n onSave()\n setNotificationStatus(true)\n // Show Saved Notification for fade animation duration\n clearTimeout(notificationTimer)\n setNotificationTimer(setTimeout(() => {\n setNotificationStatus(false)\n clearTimeout(notificationTimer)\n }, delay))\n clearTimeout(updateTimer)\n }, delay))\n }\n\n const clearUpdateTimer = (hasSaved = true) => {\n clearTimeout(updateTimer)\n if (hasSaved) {\n setNotificationStatus(true)\n clearTimeout(notificationTimer)\n setNotificationTimer(setTimeout(() => {\n setNotificationStatus(false)\n clearTimeout(notificationTimer)\n }, delay))\n } else {\n setNotificationStatus(false)\n }\n }\n\n useEffect(() => {\n return () => {\n clearTimeout(updateTimer)\n clearTimeout(notificationTimer)\n }\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return { restartTimer, clearUpdateTimer }\n}","export const noop = () => undefined\n","import type { LabelHTMLAttributes } from 'react'\n\nexport type LabelType = 'labelSmall' | 'labelMedium' | 'labelBig'\nconst styleMapping: Record<LabelType, string> = {\n labelSmall: 'textstyle-label-sm',\n labelMedium: 'textstyle-label-md',\n labelBig: 'textstyle-label-lg',\n}\n\n\nexport type LabelProps = {\n /** The text for the label */\n name?: string,\n /** The styling for the label */\n labelType?: LabelType,\n} & LabelHTMLAttributes<HTMLLabelElement>\n\n/**\n * A Label component\n */\nexport const Label = ({\n children,\n name,\n labelType = 'labelSmall',\n ...props\n}: LabelProps) => {\n return (\n <label {...props}>\n {children ? children : (<span className={styleMapping[labelType]}>{name}</span>)}\n </label>\n )\n}\n"],"mappings":"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","names":["useEffect","useState","clsx","useEffect","useState","useEffect","useState","useEffect","useState","jsx","jsx","useEffect","value","FormInput","jsx","jsx","jsxs","useState","useEffect","clsx"]}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import { TextButtonProps } from './Button.mjs';
|
|
3
|
-
import { TableSortingType } from './Table.mjs';
|
|
4
|
-
import 'react';
|
|
5
|
-
|
|
6
|
-
type SortButtonProps = Omit<TextButtonProps, 'onClick'> & {
|
|
7
|
-
ascending?: TableSortingType;
|
|
8
|
-
onClick: (newTableSorting: TableSortingType) => void;
|
|
9
|
-
};
|
|
10
|
-
/**
|
|
11
|
-
* A Extension of the normal button that displays the sorting state right of the content
|
|
12
|
-
*/
|
|
13
|
-
declare const SortButton: ({ children, ascending, color, onClick, ...buttonProps }: SortButtonProps) => react_jsx_runtime.JSX.Element;
|
|
14
|
-
|
|
15
|
-
export { SortButton, type SortButtonProps };
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import { TextButtonProps } from './Button.js';
|
|
3
|
-
import { TableSortingType } from './Table.js';
|
|
4
|
-
import 'react';
|
|
5
|
-
|
|
6
|
-
type SortButtonProps = Omit<TextButtonProps, 'onClick'> & {
|
|
7
|
-
ascending?: TableSortingType;
|
|
8
|
-
onClick: (newTableSorting: TableSortingType) => void;
|
|
9
|
-
};
|
|
10
|
-
/**
|
|
11
|
-
* A Extension of the normal button that displays the sorting state right of the content
|
|
12
|
-
*/
|
|
13
|
-
declare const SortButton: ({ children, ascending, color, onClick, ...buttonProps }: SortButtonProps) => react_jsx_runtime.JSX.Element;
|
|
14
|
-
|
|
15
|
-
export { SortButton, type SortButtonProps };
|
|
@@ -1,132 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
-
var __export = (target, all) => {
|
|
9
|
-
for (var name in all)
|
|
10
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
-
};
|
|
12
|
-
var __copyProps = (to, from, except, desc) => {
|
|
13
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
-
for (let key of __getOwnPropNames(from))
|
|
15
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
-
}
|
|
18
|
-
return to;
|
|
19
|
-
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
-
mod
|
|
27
|
-
));
|
|
28
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
-
|
|
30
|
-
// src/components/SortButton.tsx
|
|
31
|
-
var SortButton_exports = {};
|
|
32
|
-
__export(SortButton_exports, {
|
|
33
|
-
SortButton: () => SortButton
|
|
34
|
-
});
|
|
35
|
-
module.exports = __toCommonJS(SortButton_exports);
|
|
36
|
-
var import_lucide_react = require("lucide-react");
|
|
37
|
-
|
|
38
|
-
// src/components/Button.tsx
|
|
39
|
-
var import_clsx = __toESM(require("clsx"));
|
|
40
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
41
|
-
var ButtonSizePaddings = {
|
|
42
|
-
small: "btn-sm",
|
|
43
|
-
medium: "btn-md",
|
|
44
|
-
large: "btn-lg"
|
|
45
|
-
};
|
|
46
|
-
var TextButton = ({
|
|
47
|
-
children,
|
|
48
|
-
disabled = false,
|
|
49
|
-
color = "neutral",
|
|
50
|
-
size = "medium",
|
|
51
|
-
startIcon,
|
|
52
|
-
endIcon,
|
|
53
|
-
onClick,
|
|
54
|
-
className,
|
|
55
|
-
...restProps
|
|
56
|
-
}) => {
|
|
57
|
-
const colorClasses = {
|
|
58
|
-
negative: "bg-transparent text-button-text-negative-text",
|
|
59
|
-
neutral: "bg-transparent text-button-text-neutral-text"
|
|
60
|
-
}[color];
|
|
61
|
-
const iconColorClasses = {
|
|
62
|
-
negative: "text-button-text-negative-icon",
|
|
63
|
-
neutral: "text-button-text-neutral-icon"
|
|
64
|
-
}[color];
|
|
65
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
66
|
-
"button",
|
|
67
|
-
{
|
|
68
|
-
onClick: disabled ? void 0 : onClick,
|
|
69
|
-
disabled: disabled || onClick === void 0,
|
|
70
|
-
className: (0, import_clsx.default)(
|
|
71
|
-
className,
|
|
72
|
-
{
|
|
73
|
-
"text-disabled-text": disabled,
|
|
74
|
-
[(0, import_clsx.default)(colorClasses, "hover:bg-button-text-hover-background rounded-full")]: !disabled
|
|
75
|
-
},
|
|
76
|
-
ButtonSizePaddings[size]
|
|
77
|
-
),
|
|
78
|
-
...restProps,
|
|
79
|
-
children: [
|
|
80
|
-
startIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
81
|
-
"span",
|
|
82
|
-
{
|
|
83
|
-
className: (0, import_clsx.default)({
|
|
84
|
-
[iconColorClasses]: !disabled,
|
|
85
|
-
[`text-disabled-icon`]: disabled
|
|
86
|
-
}),
|
|
87
|
-
children: startIcon
|
|
88
|
-
}
|
|
89
|
-
),
|
|
90
|
-
children,
|
|
91
|
-
endIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
92
|
-
"span",
|
|
93
|
-
{
|
|
94
|
-
className: (0, import_clsx.default)({
|
|
95
|
-
[iconColorClasses]: !disabled,
|
|
96
|
-
[`text-disabled-icon`]: disabled
|
|
97
|
-
}),
|
|
98
|
-
children: endIcon
|
|
99
|
-
}
|
|
100
|
-
)
|
|
101
|
-
]
|
|
102
|
-
}
|
|
103
|
-
);
|
|
104
|
-
};
|
|
105
|
-
|
|
106
|
-
// src/components/SortButton.tsx
|
|
107
|
-
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
108
|
-
var SortButton = ({
|
|
109
|
-
children,
|
|
110
|
-
ascending,
|
|
111
|
-
color,
|
|
112
|
-
onClick,
|
|
113
|
-
...buttonProps
|
|
114
|
-
}) => {
|
|
115
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
116
|
-
TextButton,
|
|
117
|
-
{
|
|
118
|
-
color,
|
|
119
|
-
onClick: () => onClick(ascending === "descending" ? "ascending" : "descending"),
|
|
120
|
-
...buttonProps,
|
|
121
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "row gap-x-2", children: [
|
|
122
|
-
children,
|
|
123
|
-
ascending === "ascending" ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react.ChevronUp, {}) : !ascending ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react.ChevronsUpDown, {}) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react.ChevronDown, {})
|
|
124
|
-
] })
|
|
125
|
-
}
|
|
126
|
-
);
|
|
127
|
-
};
|
|
128
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
129
|
-
0 && (module.exports = {
|
|
130
|
-
SortButton
|
|
131
|
-
});
|
|
132
|
-
//# sourceMappingURL=SortButton.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/SortButton.tsx","../../src/components/Button.tsx"],"sourcesContent":["import { ChevronDown, ChevronsUpDown, ChevronUp } from 'lucide-react'\nimport type { TextButtonProps } from './Button'\nimport { TextButton } from './Button'\nimport type { TableSortingType } from './Table'\n\nexport type SortButtonProps = Omit<TextButtonProps, 'onClick'> & {\n ascending?: TableSortingType,\n onClick: (newTableSorting:TableSortingType) => void,\n}\n\n/**\n * A Extension of the normal button that displays the sorting state right of the content\n */\nexport const SortButton = ({\n children,\n ascending,\n color,\n onClick,\n ...buttonProps\n}: SortButtonProps) => {\n return (\n <TextButton\n color={color}\n onClick={() => onClick(ascending === 'descending' ? 'ascending' : 'descending')}\n {...buttonProps}\n >\n <div className=\"row gap-x-2\">\n {children}\n {ascending === 'ascending' ? <ChevronUp/> : (!ascending ? <ChevronsUpDown/> : <ChevronDown/>)}\n </div>\n </TextButton>\n )\n}\n","import type { PropsWithChildren, ButtonHTMLAttributes, ReactNode } from 'react'\nimport clsx from 'clsx'\n\nexport type SolidButtonColor = 'primary' | 'secondary' | 'tertiary' | 'positive' | 'warning'| 'negative'\nexport type OutlineButtonColor = 'primary'\nexport type TextButtonColor = 'negative' | 'neutral'\n\ntype ButtonSizes = 'small' | 'medium' | 'large'\n\n/**\n * The shard properties between all button types\n */\nexport type ButtonProps = PropsWithChildren<{\n /**\n * @default 'medium'\n */\n size?: ButtonSizes,\n}> & ButtonHTMLAttributes<Element>\n\nexport const ButtonSizePaddings: Record<ButtonSizes, string> = {\n small: 'btn-sm',\n medium: 'btn-md',\n large: 'btn-lg'\n}\n\ntype ButtonWithIconsProps = ButtonProps & {\n startIcon?: ReactNode,\n endIcon?: ReactNode,\n}\n\nexport type SolidButtonProps = ButtonWithIconsProps & {\n color?: SolidButtonColor,\n}\n\nexport type OutlineButtonProps = ButtonWithIconsProps & {\n color?: OutlineButtonColor,\n}\n\nexport type TextButtonProps = ButtonWithIconsProps & {\n color?: TextButtonColor,\n}\n\n/**\n * A button with a solid background and different sizes\n */\nconst SolidButton = ({\n children,\n disabled = false,\n color = 'primary',\n size = 'medium',\n startIcon,\n endIcon,\n onClick,\n className,\n ...restProps\n }: SolidButtonProps) => {\n const colorClasses = {\n primary: 'bg-button-solid-primary-background text-button-solid-primary-text',\n secondary: 'bg-button-solid-secondary-background text-button-solid-secondary-text',\n tertiary: 'bg-button-solid-tertiary-background text-button-solid-tertiary-text',\n positive: 'bg-button-solid-positive-background text-button-solid-positive-text',\n warning: 'bg-button-solid-warning-background text-button-solid-warning-text',\n negative: 'bg-button-solid-negative-background text-button-solid-negative-text',\n }[color]\n\n const iconColorClasses = {\n primary: 'text-button-solid-primary-icon',\n secondary: 'text-button-solid-secondary-icon',\n tertiary: 'text-button-solid-tertiary-icon',\n positive: 'text-button-solid-positive-icon',\n warning: 'text-button-solid-warning-icon',\n negative: 'text-button-solid-negative-icon',\n }[color]\n\n return (\n <button\n onClick={disabled ? undefined : onClick}\n disabled={disabled || onClick === undefined}\n className={clsx(\n className,\n {\n 'text-disabled-text bg-disabled-background': disabled,\n [clsx(colorClasses, 'hover:brightness-90')]: !disabled\n },\n ButtonSizePaddings[size]\n )}\n {...restProps}\n >\n {startIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {startIcon}\n </span>\n )}\n {children}\n {endIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {endIcon}\n </span>\n )}\n </button>\n )\n}\n\n/**\n * A button with an outline border and different sizes\n */\nconst OutlineButton = ({\n children,\n disabled = false,\n color = 'primary',\n size = 'medium',\n startIcon,\n endIcon,\n onClick,\n className,\n ...restProps\n }: OutlineButtonProps) => {\n const colorClasses = {\n primary: 'bg-transparent border-2 border-button-outline-primary-text text-button-outline-primary-text',\n }[color]\n\n const iconColorClasses = {\n primary: 'text-button-outline-primary-icon',\n }[color]\n return (\n <button\n onClick={disabled ? undefined : onClick}\n disabled={disabled || onClick === undefined}\n className={clsx(\n className, {\n 'text-disabled-text border-disabled-outline)': disabled,\n [clsx(colorClasses, 'hover:brightness-80')]: !disabled,\n },\n ButtonSizePaddings[size]\n )}\n {...restProps}\n >\n {startIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {startIcon}\n </span>\n )}\n {children}\n {endIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {endIcon}\n </span>\n )}\n </button>\n )\n}\n\n/**\n * A text that is a button that can have different sizes\n */\nconst TextButton = ({\n children,\n disabled = false,\n color = 'neutral',\n size = 'medium',\n startIcon,\n endIcon,\n onClick,\n className,\n ...restProps\n }: TextButtonProps) => {\n const colorClasses = {\n negative: 'bg-transparent text-button-text-negative-text',\n neutral: 'bg-transparent text-button-text-neutral-text',\n }[color]\n\n const iconColorClasses = {\n negative: 'text-button-text-negative-icon',\n neutral: 'text-button-text-neutral-icon',\n }[color]\n return (\n <button\n onClick={disabled ? undefined : onClick}\n disabled={disabled || onClick === undefined}\n className={clsx(\n className, {\n 'text-disabled-text': disabled,\n [clsx(colorClasses, 'hover:bg-button-text-hover-background rounded-full')]: !disabled,\n },\n ButtonSizePaddings[size]\n )}\n {...restProps}\n >\n {startIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {startIcon}\n </span>\n )}\n {children}\n {endIcon && (\n <span\n className={clsx({\n [iconColorClasses]: !disabled,\n [`text-disabled-icon`]: disabled\n })}\n >\n {endIcon}\n </span>\n )}\n </button>\n )\n}\n\n// TODO Icon button\n\nexport { SolidButton, OutlineButton, TextButton }\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAuD;;;ACCvD,kBAAiB;AA0Eb;AAxDG,IAAM,qBAAkD;AAAA,EAC7D,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACT;AAwJA,IAAM,aAAa,CAAC;AAAA,EACE;AAAA,EACA,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAuB;AACzC,QAAM,eAAe;AAAA,IACnB,UAAU;AAAA,IACV,SAAS;AAAA,EACX,EAAE,KAAK;AAEP,QAAM,mBAAmB;AAAA,IACvB,UAAU;AAAA,IACV,SAAS;AAAA,EACX,EAAE,KAAK;AACP,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,WAAW,SAAY;AAAA,MAChC,UAAU,YAAY,YAAY;AAAA,MAClC,eAAW,YAAAA;AAAA,QACT;AAAA,QAAW;AAAA,UACT,sBAAsB;AAAA,UACtB,KAAC,YAAAA,SAAK,cAAc,oDAAoD,CAAC,GAAG,CAAC;AAAA,QAC/E;AAAA,QACA,mBAAmB,IAAI;AAAA,MACzB;AAAA,MACC,GAAG;AAAA,MAEH;AAAA,qBACC;AAAA,UAAC;AAAA;AAAA,YACC,eAAW,YAAAA,SAAK;AAAA,cACd,CAAC,gBAAgB,GAAG,CAAC;AAAA,cACrB,CAAC,oBAAoB,GAAG;AAAA,YAC1B,CAAC;AAAA,YAEF;AAAA;AAAA,QACH;AAAA,QAEC;AAAA,QACA,WACC;AAAA,UAAC;AAAA;AAAA,YACC,eAAW,YAAAA,SAAK;AAAA,cACd,CAAC,gBAAgB,GAAG,CAAC;AAAA,cACrB,CAAC,oBAAoB,GAAG;AAAA,YAC1B,CAAC;AAAA,YAEF;AAAA;AAAA,QACH;AAAA;AAAA;AAAA,EAEF;AAEJ;;;AD7MM,IAAAC,sBAAA;AAbC,IAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAuB;AACrB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,SAAS,MAAM,QAAQ,cAAc,eAAe,cAAc,YAAY;AAAA,MAC7E,GAAG;AAAA,MAEJ,wDAAC,SAAI,WAAU,eACZ;AAAA;AAAA,QACA,cAAc,cAAc,6CAAC,iCAAS,IAAM,CAAC,YAAY,6CAAC,sCAAc,IAAK,6CAAC,mCAAW;AAAA,SAC5F;AAAA;AAAA,EACF;AAEJ;","names":["clsx","import_jsx_runtime"]}
|