@tcn/ui 0.3.1 → 0.3.2
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 +2 -1
- package/dist/actions/button/base_button/base_button.d.ts.map +1 -1
- package/dist/actions/button/base_button/base_button.js +18 -18
- package/dist/actions/button/base_button/base_button.js.map +1 -1
- package/dist/actions/button/button_group/button_group.d.ts +1 -1
- package/dist/actions/button/button_group/button_group.d.ts.map +1 -1
- package/dist/actions/button/button_group/button_group.js +10 -7
- package/dist/actions/button/button_group/button_group.js.map +1 -1
- package/dist/actions/button/select_group/select_group.js +2 -2
- package/dist/actions/button/select_group/select_group.js.map +1 -1
- package/dist/badge.css +1 -1
- package/dist/base_button.css +1 -1
- package/dist/body_text.css +1 -1
- package/dist/bottom_resize_handle.css +1 -1
- package/dist/bubble.css +1 -1
- package/dist/button.css +1 -1
- package/dist/button_group.css +1 -1
- package/dist/callout.css +1 -1
- package/dist/caption.css +1 -1
- package/dist/checkbox.css +1 -1
- package/dist/chip.css +1 -1
- package/dist/circle.css +1 -1
- package/dist/collapsible_box.css +1 -1
- package/dist/color_input.css +1 -1
- package/dist/color_picker.css +1 -1
- package/dist/column.css +1 -1
- package/dist/confirm.css +1 -1
- package/dist/css/layers.css +1 -0
- package/dist/date_picker.css +1 -1
- package/dist/date_picker_date.css +1 -1
- package/dist/date_picker_day.css +1 -1
- package/dist/date_picker_header.css +1 -1
- package/dist/date_picker_input.css +1 -1
- package/dist/date_picker_time_selector.css +1 -1
- package/dist/date_picker_year_input.css +1 -1
- package/dist/date_picker_year_selector.css +1 -1
- package/dist/divider.css +1 -1
- package/dist/draggable.css +1 -1
- package/dist/drawer_bottom.css +1 -1
- package/dist/drawer_end.css +1 -1
- package/dist/drawer_start.css +1 -1
- package/dist/drawer_top.css +1 -1
- package/dist/end_resize_handle.css +1 -1
- package/dist/feedback/progress/progress_bar.d.ts.map +1 -1
- package/dist/feedback/progress/progress_bar.js +34 -26
- package/dist/feedback/progress/progress_bar.js.map +1 -1
- package/dist/field_control.css +1 -1
- package/dist/field_set.css +1 -1
- package/dist/footer.css +1 -1
- package/dist/footnote.css +1 -1
- package/dist/form/field/common/field_control/field_control.js +9 -9
- package/dist/form/field/common/field_control/field_control.js.map +1 -1
- package/dist/form/field/common/field_description.js +3 -3
- package/dist/form/field/common/field_description.js.map +1 -1
- package/dist/form/field/common/field_error.js +8 -7
- package/dist/form/field/common/field_error.js.map +1 -1
- package/dist/form/field/common/field_header.js +7 -7
- package/dist/form/field/common/field_header.js.map +1 -1
- package/dist/form/field/common/status_input/status_input.d.ts.map +1 -1
- package/dist/form/field/common/status_input/status_input.js +15 -9
- package/dist/form/field/common/status_input/status_input.js.map +1 -1
- package/dist/form/field/h_field/h_field.js +1 -1
- package/dist/form/field/h_field/h_field.js.map +1 -1
- package/dist/form/field/v_field/v_field.js +5 -5
- package/dist/form/field/v_field/v_field.js.map +1 -1
- package/dist/form/field_set/field_set.d.ts.map +1 -1
- package/dist/form/field_set/field_set.js +17 -10
- package/dist/form/field_set/field_set.js.map +1 -1
- package/dist/frame.css +1 -1
- package/dist/grid.css +1 -1
- package/dist/h_body.css +1 -1
- package/dist/h_field.css +1 -1
- package/dist/h_panel.css +1 -1
- package/dist/header.css +1 -1
- package/dist/headline.css +1 -1
- package/dist/input.css +1 -1
- package/dist/inputs/checkbox/checkbox.js +14 -14
- package/dist/inputs/checkbox/checkbox.js.map +1 -1
- package/dist/inputs/checkbox/checkbox_row.d.ts +1 -1
- package/dist/inputs/checkbox/checkbox_row.d.ts.map +1 -1
- package/dist/inputs/checkbox/checkbox_row.js +19 -8
- package/dist/inputs/checkbox/checkbox_row.js.map +1 -1
- package/dist/inputs/color_input/color_input.d.ts.map +1 -1
- package/dist/inputs/color_input/color_input.js +32 -28
- package/dist/inputs/color_input/color_input.js.map +1 -1
- package/dist/inputs/color_input/color_picker.js +16 -16
- package/dist/inputs/color_input/color_picker.js.map +1 -1
- package/dist/inputs/combo_box/combo_box.js +1 -1
- package/dist/inputs/combo_box/combo_box.js.map +1 -1
- package/dist/inputs/date_picker/date_picker.js +10 -10
- package/dist/inputs/date_picker/date_picker.js.map +1 -1
- package/dist/inputs/date_picker/date_picker_body.js +1 -1
- package/dist/inputs/date_picker/date_picker_body.js.map +1 -1
- package/dist/inputs/date_picker/date_picker_date.js +2 -2
- package/dist/inputs/date_picker/date_picker_date.js.map +1 -1
- package/dist/inputs/date_picker/date_picker_day.d.ts.map +1 -1
- package/dist/inputs/date_picker/date_picker_day.js +16 -8
- package/dist/inputs/date_picker/date_picker_day.js.map +1 -1
- package/dist/inputs/date_picker/date_picker_header.js +1 -1
- package/dist/inputs/date_picker/date_picker_header.js.map +1 -1
- package/dist/inputs/date_picker/date_picker_input.js +3 -3
- package/dist/inputs/date_picker/date_picker_input.js.map +1 -1
- package/dist/inputs/date_picker/date_picker_time_selector.d.ts.map +1 -1
- package/dist/inputs/date_picker/date_picker_time_selector.js +14 -11
- package/dist/inputs/date_picker/date_picker_time_selector.js.map +1 -1
- package/dist/inputs/date_picker/date_picker_year_input.js +4 -4
- package/dist/inputs/date_picker/date_picker_year_input.js.map +1 -1
- package/dist/inputs/date_picker/date_picker_year_selector.d.ts.map +1 -1
- package/dist/inputs/date_picker/date_picker_year_selector.js +13 -10
- package/dist/inputs/date_picker/date_picker_year_selector.js.map +1 -1
- package/dist/inputs/index.d.ts +0 -4
- package/dist/inputs/index.d.ts.map +1 -1
- package/dist/inputs/index.js +53 -61
- package/dist/inputs/index.js.map +1 -1
- package/dist/inputs/input/input.js +3 -3
- package/dist/inputs/input/input.js.map +1 -1
- package/dist/inputs/multiselect/multiselect.d.ts.map +1 -1
- package/dist/inputs/multiselect/multiselect.js +10 -9
- package/dist/inputs/multiselect/multiselect.js.map +1 -1
- package/dist/inputs/multiselect/multiselect_inline_values.d.ts.map +1 -1
- package/dist/inputs/multiselect/multiselect_inline_values.js +18 -17
- package/dist/inputs/multiselect/multiselect_inline_values.js.map +1 -1
- package/dist/inputs/multiselect/multiselect_values.js +20 -20
- package/dist/inputs/multiselect/multiselect_values.js.map +1 -1
- package/dist/inputs/phone_number_input/phone_number_input.d.ts.map +1 -1
- package/dist/inputs/phone_number_input/phone_number_input.js +94 -81
- package/dist/inputs/phone_number_input/phone_number_input.js.map +1 -1
- package/dist/inputs/radio/radio.js +11 -11
- package/dist/inputs/radio/radio.js.map +1 -1
- package/dist/inputs/select/select.d.ts.map +1 -1
- package/dist/inputs/select/select.js +33 -33
- package/dist/inputs/select/select.js.map +1 -1
- package/dist/inputs/slider/slider.js +4 -4
- package/dist/inputs/slider/slider.js.map +1 -1
- package/dist/inputs/suggestions/suggestion_item.js +9 -9
- package/dist/inputs/suggestions/suggestion_item.js.map +1 -1
- package/dist/inputs/suggestions/suggestion_list.d.ts.map +1 -1
- package/dist/inputs/suggestions/suggestion_list.js +29 -22
- package/dist/inputs/suggestions/suggestion_list.js.map +1 -1
- package/dist/inputs/switch/switch.js +14 -14
- package/dist/inputs/switch/switch.js.map +1 -1
- package/dist/inputs/textarea/textarea.js +6 -6
- package/dist/inputs/textarea/textarea.js.map +1 -1
- package/dist/inputs/unit_input/unit_input.js +8 -8
- package/dist/inputs/unit_input/unit_input.js.map +1 -1
- package/dist/layouts/body/h_body.js +7 -7
- package/dist/layouts/body/h_body.js.map +1 -1
- package/dist/layouts/column/column.js +8 -8
- package/dist/layouts/column/column.js.map +1 -1
- package/dist/layouts/divider/divider.d.ts.map +1 -1
- package/dist/layouts/divider/divider.js +11 -12
- package/dist/layouts/divider/divider.js.map +1 -1
- package/dist/layouts/grid/grid.d.ts.map +1 -1
- package/dist/layouts/grid/grid.js +26 -17
- package/dist/layouts/grid/grid.js.map +1 -1
- package/dist/layouts/header/header.js +4 -4
- package/dist/layouts/header/header.js.map +1 -1
- package/dist/layouts/list/section_header.d.ts.map +1 -1
- package/dist/layouts/list/section_header.js +15 -5
- package/dist/layouts/list/section_header.js.map +1 -1
- package/dist/layouts/sidebar_end/sidebar_end.js +26 -26
- package/dist/layouts/sidebar_end/sidebar_end.js.map +1 -1
- package/dist/layouts/sidebar_start/sidebar_start.js +24 -24
- package/dist/layouts/sidebar_start/sidebar_start.js.map +1 -1
- package/dist/layouts/utility_bar/utility_bar.d.ts.map +1 -1
- package/dist/layouts/utility_bar/utility_bar.js +10 -15
- package/dist/layouts/utility_bar/utility_bar.js.map +1 -1
- package/dist/left_resize_handle.css +1 -1
- package/dist/loading.css +1 -1
- package/dist/menu.css +1 -1
- package/dist/modal.css +1 -1
- package/dist/multi_combo_box.css +1 -1
- package/dist/multiselect.css +1 -1
- package/dist/multiselect_values.css +1 -1
- package/dist/overlay/context_menu/context_menu.js +5 -5
- package/dist/overlay/context_menu/context_menu.js.map +1 -1
- package/dist/overlay/menu/menu.js +2 -2
- package/dist/overlay/menu/menu.js.map +1 -1
- package/dist/overlay/popper/legacy/popper.d.ts.map +1 -1
- package/dist/overlay/popper/legacy/popper.js +12 -11
- package/dist/overlay/popper/legacy/popper.js.map +1 -1
- package/dist/overlay/popper/preview_popper.js +16 -16
- package/dist/overlay/popper/preview_popper.js.map +1 -1
- package/dist/overlay/portal/portal.css +1 -0
- package/dist/overlay/portal/portal_platform.d.ts.map +1 -1
- package/dist/overlay/portal/portal_platform.js +6 -5
- package/dist/overlay/portal/portal_platform.js.map +1 -1
- package/dist/page.css +1 -1
- package/dist/phone_number_input.css +1 -1
- package/dist/picture_placeholder.css +1 -1
- package/dist/popper.css +1 -1
- package/dist/progress_bar.css +1 -1
- package/dist/radio.css +1 -1
- package/dist/rect.css +1 -1
- package/dist/right_resize_handle.css +1 -1
- package/dist/scaffold.css +1 -1
- package/dist/select.css +1 -1
- package/dist/select_group.css +1 -1
- package/dist/sidebar_end.css +1 -1
- package/dist/sidebar_start.css +1 -1
- package/dist/slider.css +1 -1
- package/dist/slim_button.css +1 -1
- package/dist/stack.css +1 -1
- package/dist/stacks/box/bottom_resize_handle.js +1 -1
- package/dist/stacks/box/bottom_resize_handle.js.map +1 -1
- package/dist/stacks/box/box.js +1 -1
- package/dist/stacks/box/box.js.map +1 -1
- package/dist/stacks/box/end_resize_handle.js +1 -1
- package/dist/stacks/box/end_resize_handle.js.map +1 -1
- package/dist/stacks/box/left_resize_handle.js +7 -7
- package/dist/stacks/box/left_resize_handle.js.map +1 -1
- package/dist/stacks/box/right_resize_handle.js +3 -3
- package/dist/stacks/box/right_resize_handle.js.map +1 -1
- package/dist/stacks/box/start_resize_handle.js +6 -6
- package/dist/stacks/box/start_resize_handle.js.map +1 -1
- package/dist/stacks/box/top_resize_handle.js +1 -1
- package/dist/stacks/box/top_resize_handle.js.map +1 -1
- package/dist/stacks/h_collapsible_box.d.ts.map +1 -1
- package/dist/stacks/h_collapsible_box.js +8 -4
- package/dist/stacks/h_collapsible_box.js.map +1 -1
- package/dist/stacks/h_stack.js +5 -5
- package/dist/stacks/h_stack.js.map +1 -1
- package/dist/stacks/spacer.js +13 -13
- package/dist/stacks/spacer.js.map +1 -1
- package/dist/stacks/story_components/circle.js +3 -3
- package/dist/stacks/story_components/circle.js.map +1 -1
- package/dist/stacks/story_components/picture_placeholder.d.ts.map +1 -1
- package/dist/stacks/story_components/picture_placeholder.js +5 -1
- package/dist/stacks/story_components/picture_placeholder.js.map +1 -1
- package/dist/stacks/story_components/rect.js +10 -10
- package/dist/stacks/story_components/rect.js.map +1 -1
- package/dist/stacks/v_collapsible_box.d.ts.map +1 -1
- package/dist/stacks/v_collapsible_box.js +12 -8
- package/dist/stacks/v_collapsible_box.js.map +1 -1
- package/dist/stacks/v_stack.js +4 -4
- package/dist/stacks/v_stack.js.map +1 -1
- package/dist/stacks/z_stack.js +7 -7
- package/dist/stacks/z_stack.js.map +1 -1
- package/dist/start_resize_handle.css +1 -1
- package/dist/status_input.css +1 -1
- package/dist/subheadline.css +1 -1
- package/dist/suggestion_item.css +1 -1
- package/dist/suggestion_list.css +1 -1
- package/dist/surfaces/alert/alert.js +6 -6
- package/dist/surfaces/alert/alert.js.map +1 -1
- package/dist/surfaces/confirm/confirm.d.ts.map +1 -1
- package/dist/surfaces/confirm/confirm.js +22 -15
- package/dist/surfaces/confirm/confirm.js.map +1 -1
- package/dist/surfaces/drawers/drawer_bottom/drawer_bottom.js +3 -3
- package/dist/surfaces/drawers/drawer_bottom/drawer_bottom.js.map +1 -1
- package/dist/surfaces/drawers/drawer_end/drawer_end.js +4 -4
- package/dist/surfaces/drawers/drawer_end/drawer_end.js.map +1 -1
- package/dist/surfaces/drawers/drawer_start/drawer_start.js +1 -1
- package/dist/surfaces/drawers/drawer_start/drawer_start.js.map +1 -1
- package/dist/surfaces/drawers/drawer_top/drawer_top.js +1 -1
- package/dist/surfaces/drawers/drawer_top/drawer_top.js.map +1 -1
- package/dist/surfaces/page/h_page.js +1 -1
- package/dist/surfaces/page/h_page.js.map +1 -1
- package/dist/surfaces/page/v_page.js +4 -4
- package/dist/surfaces/page/v_page.js.map +1 -1
- package/dist/surfaces/popover/popover.js +1 -1
- package/dist/surfaces/popover/popover.js.map +1 -1
- package/dist/switch.css +1 -1
- package/dist/tethered.css +1 -1
- package/dist/textarea.css +1 -1
- package/dist/themes/stylesheets/reset.css +1 -0
- package/dist/themes/stylesheets/reset.js +133 -131
- package/dist/themes/stylesheets/reset.js.map +1 -1
- package/dist/themes/theme.d.ts.map +1 -1
- package/dist/themes/theme.js +15 -6
- package/dist/themes/theme.js.map +1 -1
- package/dist/themes/themes/ergo/ergo_theme.css +1 -0
- package/dist/themes/themes/ergo/ergo_theme.js +503 -545
- package/dist/themes/themes/ergo/ergo_theme.js.map +1 -1
- package/dist/themes/themes/windows_98/windows_98.css +1 -0
- package/dist/themes/themes/windows_98/windows_98_theme.js +1034 -1168
- package/dist/themes/themes/windows_98/windows_98_theme.js.map +1 -1
- package/dist/title.css +1 -1
- package/dist/tokens/badge/badge.js +6 -6
- package/dist/tokens/badge/badge.js.map +1 -1
- package/dist/tokens/bubble/bubble.js +13 -12
- package/dist/tokens/bubble/bubble.js.map +1 -1
- package/dist/tokens/chip/chip.js +4 -3
- package/dist/tokens/chip/chip.js.map +1 -1
- package/dist/tooltip.css +1 -1
- package/dist/top_resize_handle.css +1 -1
- package/dist/typography/body_text/body_text.js +9 -9
- package/dist/typography/body_text/body_text.js.map +1 -1
- package/dist/typography/callout/callout.js +9 -9
- package/dist/typography/callout/callout.js.map +1 -1
- package/dist/typography/caption/caption.js +5 -5
- package/dist/typography/caption/caption.js.map +1 -1
- package/dist/typography/footnote/footnote.js +9 -9
- package/dist/typography/footnote/footnote.js.map +1 -1
- package/dist/typography/headline/headline.js +13 -13
- package/dist/typography/headline/headline.js.map +1 -1
- package/dist/typography/subheadline/subheadline.js +10 -10
- package/dist/typography/subheadline/subheadline.js.map +1 -1
- package/dist/typography/title/title.js +6 -6
- package/dist/typography/title/title.js.map +1 -1
- package/dist/unit_input.css +1 -1
- package/dist/utility_bar.css +1 -1
- package/dist/v_body.css +1 -1
- package/dist/window.css +1 -1
- package/package.json +3 -3
- package/src/actions/__docs__/actions.mdx +65 -2
- package/src/actions/__docs__/actions.stories.tsx +174 -2
- package/src/actions/button/__stories__/button_group.stories.tsx +63 -0
- package/src/actions/button/__stories__/select_group.stories.tsx +47 -4
- package/src/actions/button/base_button/base_button.module.css +15 -13
- package/src/actions/button/base_button/base_button.tsx +2 -1
- package/src/actions/button/button/button.module.css +52 -50
- package/src/actions/button/button_group/button_group.module.css +54 -52
- package/src/actions/button/button_group/button_group.tsx +9 -4
- package/src/actions/button/select_group/select_group.module.css +54 -52
- package/src/actions/button/select_group/select_group.tsx +2 -2
- package/src/actions/button/slim_button/slim_button.module.css +7 -5
- package/src/css/layers.css +1 -0
- package/src/feedback/loading/loading.module.css +17 -15
- package/src/feedback/progress/progress_bar.module.css +52 -50
- package/src/feedback/progress/progress_bar.tsx +6 -1
- package/src/form/field/common/field_control/field_control.module.css +17 -15
- package/src/form/field/common/field_control/field_control.tsx +1 -1
- package/src/form/field/common/field_description.tsx +1 -1
- package/src/form/field/common/field_error.tsx +1 -1
- package/src/form/field/common/field_header.tsx +1 -1
- package/src/form/field/common/status_input/status_input.module.css +10 -8
- package/src/form/field/common/status_input/status_input.tsx +8 -5
- package/src/form/field/h_field/h_field.module.css +7 -5
- package/src/form/field/h_field/h_field.tsx +1 -1
- package/src/form/field/v_field/v_field.tsx +1 -1
- package/src/form/field_set/field_set.module.css +16 -14
- package/src/form/field_set/field_set.tsx +7 -4
- package/src/inputs/checkbox/checkbox.module.css +45 -43
- package/src/inputs/checkbox/checkbox.tsx +1 -1
- package/src/inputs/checkbox/checkbox_row.tsx +9 -2
- package/src/inputs/color_input/color_input.module.css +58 -56
- package/src/inputs/color_input/color_input.tsx +8 -4
- package/src/inputs/color_input/color_picker.module.css +13 -11
- package/src/inputs/color_input/color_picker.tsx +2 -2
- package/src/inputs/combo_box/combo_box.tsx +1 -1
- package/src/inputs/date_picker/date_picker.module.css +19 -17
- package/src/inputs/date_picker/date_picker.tsx +2 -2
- package/src/inputs/date_picker/date_picker_body.tsx +1 -1
- package/src/inputs/date_picker/date_picker_date.module.css +71 -69
- package/src/inputs/date_picker/date_picker_date.tsx +2 -2
- package/src/inputs/date_picker/date_picker_day.module.css +5 -3
- package/src/inputs/date_picker/date_picker_day.tsx +7 -2
- package/src/inputs/date_picker/date_picker_header.module.css +4 -2
- package/src/inputs/date_picker/date_picker_header.tsx +1 -1
- package/src/inputs/date_picker/date_picker_input.module.css +55 -53
- package/src/inputs/date_picker/date_picker_input.tsx +3 -3
- package/src/inputs/date_picker/date_picker_time_selector.module.css +30 -28
- package/src/inputs/date_picker/date_picker_time_selector.tsx +7 -4
- package/src/inputs/date_picker/date_picker_year_input.module.css +46 -44
- package/src/inputs/date_picker/date_picker_year_input.tsx +1 -1
- package/src/inputs/date_picker/date_picker_year_selector.module.css +48 -46
- package/src/inputs/date_picker/date_picker_year_selector.tsx +5 -2
- package/src/inputs/index.ts +0 -4
- package/src/inputs/input/input.module.css +56 -79
- package/src/inputs/input/input.tsx +1 -1
- package/src/inputs/multi_combo_box/multi_combo_box.module.css +4 -2
- package/src/inputs/multiselect/multiselect.module.css +4 -2
- package/src/inputs/multiselect/multiselect.tsx +2 -1
- package/src/inputs/multiselect/multiselect_inline_values.tsx +3 -2
- package/src/inputs/multiselect/multiselect_values.module.css +28 -26
- package/src/inputs/multiselect/multiselect_values.tsx +3 -3
- package/src/inputs/phone_number_input/phone_number_input.module.css +54 -52
- package/src/inputs/phone_number_input/phone_number_input.tsx +15 -6
- package/src/inputs/radio/radio.module.css +48 -66
- package/src/inputs/radio/radio.tsx +2 -2
- package/src/inputs/select/select.module.css +57 -59
- package/src/inputs/select/select.tsx +4 -2
- package/src/inputs/slider/slider.module.css +151 -149
- package/src/inputs/slider/slider.tsx +1 -1
- package/src/inputs/suggestions/suggestion_item.module.css +35 -53
- package/src/inputs/suggestions/suggestion_item.tsx +1 -1
- package/src/inputs/suggestions/suggestion_list.module.css +29 -27
- package/src/inputs/suggestions/suggestion_list.tsx +6 -3
- package/src/inputs/switch/switch.module.css +111 -109
- package/src/inputs/switch/switch.tsx +3 -3
- package/src/inputs/textarea/textarea.module.css +47 -65
- package/src/inputs/textarea/textarea.tsx +1 -1
- package/src/inputs/unit_input/unit_input.module.css +20 -18
- package/src/inputs/unit_input/unit_input.tsx +3 -3
- package/src/layouts/body/h_body.module.css +7 -4
- package/src/layouts/body/h_body.tsx +1 -1
- package/src/layouts/body/v_body.module.css +6 -4
- package/src/layouts/column/column.module.css +30 -28
- package/src/layouts/column/column.tsx +2 -2
- package/src/layouts/divider/divider.module.css +103 -101
- package/src/layouts/divider/divider.tsx +1 -2
- package/src/layouts/footer/footer.module.css +24 -21
- package/src/layouts/grid/grid.module.css +20 -18
- package/src/layouts/grid/grid.tsx +6 -1
- package/src/layouts/header/header.module.css +7 -5
- package/src/layouts/header/header.tsx +1 -1
- package/src/layouts/list/section_header.module.css +16 -14
- package/src/layouts/list/section_header.tsx +7 -1
- package/src/layouts/scaffold/scaffold.module.css +6 -4
- package/src/layouts/sidebar_end/sidebar_end.module.css +28 -26
- package/src/layouts/sidebar_end/sidebar_end.tsx +2 -2
- package/src/layouts/sidebar_start/sidebar_start.module.css +28 -26
- package/src/layouts/sidebar_start/sidebar_start.tsx +2 -2
- package/src/layouts/utility_bar/utility_bar.module.css +5 -3
- package/src/layouts/utility_bar/utility_bar.tsx +1 -6
- package/src/overlay/context_menu/context_menu.tsx +1 -1
- package/src/overlay/frame/frame.module.css +6 -4
- package/src/overlay/frame/frame_stories.module.css +14 -12
- package/src/overlay/menu/menu.module.css +30 -28
- package/src/overlay/menu/menu.tsx +2 -2
- package/src/overlay/popper/legacy/popper.module.css +10 -8
- package/src/overlay/popper/legacy/popper.tsx +2 -1
- package/src/overlay/popper/preview_popper.tsx +1 -1
- package/src/overlay/portal/portal.css +33 -31
- package/src/overlay/portal/portal_platform.tsx +5 -5
- package/src/overlay/tethered/tethered.module.css +9 -7
- package/src/stacks/box/bottom_resize_handle.module.css +11 -9
- package/src/stacks/box/bottom_resize_handle.tsx +1 -1
- package/src/stacks/box/box.tsx +1 -1
- package/src/stacks/box/end_resize_handle.module.css +16 -14
- package/src/stacks/box/end_resize_handle.tsx +1 -1
- package/src/stacks/box/left_resize_handle.module.css +11 -9
- package/src/stacks/box/left_resize_handle.tsx +1 -1
- package/src/stacks/box/right_resize_handle.module.css +11 -9
- package/src/stacks/box/right_resize_handle.tsx +1 -1
- package/src/stacks/box/start_resize_handle.module.css +16 -14
- package/src/stacks/box/start_resize_handle.tsx +1 -1
- package/src/stacks/box/top_resize_handle.module.css +11 -9
- package/src/stacks/box/top_resize_handle.tsx +1 -1
- package/src/stacks/collapsible_box.module.css +45 -29
- package/src/stacks/demo.module.css +5 -3
- package/src/stacks/h_collapsible_box.tsx +5 -1
- package/src/stacks/h_stack.tsx +1 -1
- package/src/stacks/spacer.tsx +1 -1
- package/src/stacks/stack.module.css +400 -393
- package/src/stacks/story_components/circle.module.css +8 -6
- package/src/stacks/story_components/circle.tsx +1 -1
- package/src/stacks/story_components/picture_placeholder.module.css +4 -2
- package/src/stacks/story_components/picture_placeholder.tsx +5 -1
- package/src/stacks/story_components/rect.module.css +9 -7
- package/src/stacks/story_components/rect.tsx +1 -1
- package/src/stacks/v_collapsible_box.tsx +5 -1
- package/src/stacks/v_stack.tsx +1 -1
- package/src/stacks/z_stack.tsx +1 -1
- package/src/surfaces/alert/alert.tsx +1 -1
- package/src/surfaces/card/card_stories.module.css +13 -11
- package/src/surfaces/confirm/confirm.module.css +37 -35
- package/src/surfaces/confirm/confirm.tsx +7 -4
- package/src/surfaces/drawers/drawer_bottom/drawer_bottom.module.css +4 -2
- package/src/surfaces/drawers/drawer_bottom/drawer_bottom.tsx +1 -1
- package/src/surfaces/drawers/drawer_end/drawer_end.module.css +4 -2
- package/src/surfaces/drawers/drawer_end/drawer_end.tsx +1 -1
- package/src/surfaces/drawers/drawer_start/drawer_start.module.css +4 -2
- package/src/surfaces/drawers/drawer_start/drawer_start.tsx +1 -1
- package/src/surfaces/drawers/drawer_top/drawer_top.module.css +4 -2
- package/src/surfaces/drawers/drawer_top/drawer_top.tsx +1 -1
- package/src/surfaces/modal/modal.module.css +5 -3
- package/src/surfaces/page/h_page.tsx +1 -1
- package/src/surfaces/page/page.module.css +12 -10
- package/src/surfaces/page/v_page.tsx +1 -1
- package/src/surfaces/panel/panel.module.css +8 -7
- package/src/surfaces/popover/popover.tsx +1 -1
- package/src/surfaces/tooltip/tooltip.module.css +4 -2
- package/src/surfaces/window/window.module.css +6 -4
- package/src/themes/stylesheets/reset.css +133 -131
- package/src/themes/theme.tsx +17 -0
- package/src/themes/themes/ergo/ergo_theme.css +503 -545
- package/src/themes/themes/windows_98/windows_98.css +1030 -1164
- package/src/tokens/badge/badge.module.css +13 -11
- package/src/tokens/badge/badge.tsx +2 -2
- package/src/tokens/bubble/bubble.module.css +12 -10
- package/src/tokens/bubble/bubble.tsx +1 -1
- package/src/tokens/chip/chip.module.css +14 -12
- package/src/tokens/chip/chip.tsx +1 -1
- package/src/typography/body_text/body_text.module.css +61 -59
- package/src/typography/body_text/body_text.tsx +1 -1
- package/src/typography/callout/callout.module.css +56 -54
- package/src/typography/callout/callout.tsx +1 -1
- package/src/typography/caption/caption.module.css +56 -54
- package/src/typography/caption/caption.tsx +1 -1
- package/src/typography/footnote/footnote.module.css +56 -54
- package/src/typography/footnote/footnote.tsx +1 -1
- package/src/typography/headline/headline.module.css +57 -55
- package/src/typography/headline/headline.tsx +1 -1
- package/src/typography/subheadline/subheadline.module.css +57 -55
- package/src/typography/subheadline/subheadline.tsx +1 -1
- package/src/typography/title/title.module.css +54 -52
- package/src/typography/title/title.tsx +1 -1
- package/src/utils/dnd/draggable/draggable.module.css +8 -6
- package/dist/actions/types.js +0 -2
- package/dist/actions/types.js.map +0 -1
- package/dist/form/field/common/types.js +0 -2
- package/dist/form/field/common/types.js.map +0 -1
- package/dist/inputs/mask_input/mask_config.js +0 -2
- package/dist/inputs/mask_input/mask_config.js.map +0 -1
- package/dist/inputs/mask_input/mask_cursor.js +0 -2
- package/dist/inputs/mask_input/mask_cursor.js.map +0 -1
- package/dist/inputs/multiselect/multiselect_row.d.ts +0 -10
- package/dist/inputs/multiselect/multiselect_row.d.ts.map +0 -1
- package/dist/inputs/multiselect/multiselect_row.js +0 -35
- package/dist/inputs/multiselect/multiselect_row.js.map +0 -1
- package/dist/inputs/switch/switch_row.d.ts +0 -8
- package/dist/inputs/switch/switch_row.d.ts.map +0 -1
- package/dist/inputs/switch/switch_row.js +0 -16
- package/dist/inputs/switch/switch_row.js.map +0 -1
- package/dist/inputs/textarea/textarea_row.d.ts +0 -8
- package/dist/inputs/textarea/textarea_row.d.ts.map +0 -1
- package/dist/inputs/textarea/textarea_row.js +0 -12
- package/dist/inputs/textarea/textarea_row.js.map +0 -1
- package/dist/overlay/tethered/types.js +0 -2
- package/dist/overlay/tethered/types.js.map +0 -1
- package/dist/portal_platform.css +0 -1
- package/dist/stacks/box/handle_props.js +0 -2
- package/dist/stacks/box/handle_props.js.map +0 -1
- package/dist/utils/calendar/calendar_date.js +0 -2
- package/dist/utils/calendar/calendar_date.js.map +0 -1
- package/dist/utils/dnd/types.js +0 -2
- package/dist/utils/dnd/types.js.map +0 -1
- package/src/inputs/multiselect/multiselect_row.tsx +0 -57
- package/src/inputs/switch/TODO.md +0 -3
- package/src/inputs/switch/switch_row.tsx +0 -33
- package/src/inputs/textarea/textarea_row.tsx +0 -24
|
@@ -1 +1 @@
|
|
|
1
|
-
._chip_ab2e86b{margin-block:2px;margin-inline-end:4px;padding:4px 8px 4px 12px}._remove_e42285d
|
|
1
|
+
@layer tcn-system{:where(._chip_ab2e86b){margin-block:2px;margin-inline-end:4px;padding:4px 8px 4px 12px}:where(._remove_e42285d),:where(._remove_e42285d:focus),:where(._remove_e42285d:active){outline-width:1px}:where(._item-container_2592c83){background-color:#fff;border-radius:4px;padding:4px;max-height:150px;min-width:100%;overflow:auto;border:1px solid #aaa}:where(._item-container_2592c83[data-is-disabled=true]){background-color:#0000000d;cursor:not-allowed}:where(._item-container_2592c83[data-is-disabled=true]>._chip_ab2e86b){opacity:.5;cursor:not-allowed}}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as a, Fragment as m, jsx as t } from "react/jsx-runtime";
|
|
2
2
|
import { Portal as s } from "../portal/portal.js";
|
|
3
3
|
import { useState as h } from "react";
|
|
4
4
|
import { Menu as u } from "../menu/menu.js";
|
|
5
5
|
function v({ open: e, position: r, children: n, onClose: i }) {
|
|
6
6
|
const [o, l] = h(null);
|
|
7
|
-
return !e || r == null ? null : /* @__PURE__ */
|
|
7
|
+
return !e || r == null ? null : /* @__PURE__ */ a(m, { children: [
|
|
8
8
|
/* @__PURE__ */ t(s, { children: /* @__PURE__ */ t("div", { style: { position: "fixed", inset: 0 }, children: /* @__PURE__ */ t(
|
|
9
9
|
"div",
|
|
10
10
|
{
|
|
11
|
-
ref: (
|
|
12
|
-
l(
|
|
11
|
+
ref: (c) => {
|
|
12
|
+
l(c);
|
|
13
13
|
},
|
|
14
14
|
style: {
|
|
15
15
|
position: "absolute",
|
|
@@ -33,7 +33,7 @@ function v({ open: e, position: r, children: n, onClose: i }) {
|
|
|
33
33
|
open: e,
|
|
34
34
|
onClose: i,
|
|
35
35
|
minWidth: "150px",
|
|
36
|
-
className: "context-menu",
|
|
36
|
+
className: "tcn-context-menu",
|
|
37
37
|
children: n
|
|
38
38
|
}
|
|
39
39
|
)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context_menu.js","sources":["../../../src/overlay/context_menu/context_menu.tsx"],"sourcesContent":["import { Position } from '../../utils/index.js';\nimport { Portal } from '../portal/portal.js';\nimport React, { useState } from 'react';\nimport { Menu } from '../menu/menu.js';\n\nexport interface ContextMenuProps {\n open: boolean;\n onClose: () => void;\n position?: Position | null;\n children?: React.ReactNode;\n}\n\nexport function ContextMenu({ open, position, children, onClose }: ContextMenuProps) {\n const [anchorElement, setAnchorElement] = useState<HTMLElement | null>(null);\n\n if (!open || position == null) {\n return null;\n }\n\n return (\n <>\n <Portal>\n <div style={{ position: 'fixed', inset: 0 }}>\n <div\n ref={element => {\n setAnchorElement(element);\n }}\n style={{\n position: 'absolute',\n top: position.y,\n left: position.x,\n width: '1px',\n height: '1px',\n opacity: 0,\n }}\n ></div>\n </div>\n </Portal>\n <Menu\n veil\n horizontalAnchor=\"start\"\n verticalAnchor=\"top\"\n horizontalOrigin=\"start\"\n verticalOrigin=\"top\"\n anchorElement={anchorElement}\n open={open}\n onClose={onClose}\n minWidth=\"150px\"\n className=\"context-menu\"\n >\n {children}\n </Menu>\n </>\n );\n}\n"],"names":["ContextMenu","open","position","children","onClose","anchorElement","setAnchorElement","useState","jsxs","Fragment","jsx","Portal","element","Menu"],"mappings":";;;;AAYO,SAASA,EAAY,EAAE,MAAAC,GAAM,UAAAC,GAAU,UAAAC,GAAU,SAAAC,KAA6B;AACnF,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAA6B,IAAI;AAE3E,SAAI,CAACN,KAAQC,KAAY,OAChB,OAIP,gBAAAM,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EACC,4BAAC,OAAA,EAAI,OAAO,EAAE,UAAU,SAAS,OAAO,EAAA,GACtC,UAAA,gBAAAD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK,CAAAE,MAAW;AACd,UAAAN,EAAiBM,CAAO;AAAA,QAC1B;AAAA,QACA,OAAO;AAAA,UACL,UAAU;AAAA,UACV,KAAKV,EAAS;AAAA,UACd,MAAMA,EAAS;AAAA,UACf,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,IAAA,GAEJ,EAAA,CACF;AAAA,IACA,gBAAAQ;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,MAAI;AAAA,QACJ,kBAAiB;AAAA,QACjB,gBAAe;AAAA,QACf,kBAAiB;AAAA,QACjB,gBAAe;AAAA,QACf,eAAAR;AAAA,QACA,MAAAJ;AAAA,QACA,SAAAG;AAAA,QACA,UAAS;AAAA,QACT,WAAU;AAAA,QAET,UAAAD;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;"}
|
|
1
|
+
{"version":3,"file":"context_menu.js","sources":["../../../src/overlay/context_menu/context_menu.tsx"],"sourcesContent":["import { Position } from '../../utils/index.js';\nimport { Portal } from '../portal/portal.js';\nimport React, { useState } from 'react';\nimport { Menu } from '../menu/menu.js';\n\nexport interface ContextMenuProps {\n open: boolean;\n onClose: () => void;\n position?: Position | null;\n children?: React.ReactNode;\n}\n\nexport function ContextMenu({ open, position, children, onClose }: ContextMenuProps) {\n const [anchorElement, setAnchorElement] = useState<HTMLElement | null>(null);\n\n if (!open || position == null) {\n return null;\n }\n\n return (\n <>\n <Portal>\n <div style={{ position: 'fixed', inset: 0 }}>\n <div\n ref={element => {\n setAnchorElement(element);\n }}\n style={{\n position: 'absolute',\n top: position.y,\n left: position.x,\n width: '1px',\n height: '1px',\n opacity: 0,\n }}\n ></div>\n </div>\n </Portal>\n <Menu\n veil\n horizontalAnchor=\"start\"\n verticalAnchor=\"top\"\n horizontalOrigin=\"start\"\n verticalOrigin=\"top\"\n anchorElement={anchorElement}\n open={open}\n onClose={onClose}\n minWidth=\"150px\"\n className=\"tcn-context-menu\"\n >\n {children}\n </Menu>\n </>\n );\n}\n"],"names":["ContextMenu","open","position","children","onClose","anchorElement","setAnchorElement","useState","jsxs","Fragment","jsx","Portal","element","Menu"],"mappings":";;;;AAYO,SAASA,EAAY,EAAE,MAAAC,GAAM,UAAAC,GAAU,UAAAC,GAAU,SAAAC,KAA6B;AACnF,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAA6B,IAAI;AAE3E,SAAI,CAACN,KAAQC,KAAY,OAChB,OAIP,gBAAAM,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EACC,4BAAC,OAAA,EAAI,OAAO,EAAE,UAAU,SAAS,OAAO,EAAA,GACtC,UAAA,gBAAAD;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAK,CAAAE,MAAW;AACd,UAAAN,EAAiBM,CAAO;AAAA,QAC1B;AAAA,QACA,OAAO;AAAA,UACL,UAAU;AAAA,UACV,KAAKV,EAAS;AAAA,UACd,MAAMA,EAAS;AAAA,UACf,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,IAAA,GAEJ,EAAA,CACF;AAAA,IACA,gBAAAQ;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,MAAI;AAAA,QACJ,kBAAiB;AAAA,QACjB,gBAAe;AAAA,QACf,kBAAiB;AAAA,QACjB,gBAAe;AAAA,QACf,eAAAR;AAAA,QACA,MAAAJ;AAAA,QACA,SAAAG;AAAA,QACA,UAAS;AAAA,QACT,WAAU;AAAA,QAET,UAAAD;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;"}
|
|
@@ -73,7 +73,7 @@ import '../../menu.css';const Q = "_menu_9ce21e3", U = "_menu-item_68b387f", j =
|
|
|
73
73
|
onClose: x,
|
|
74
74
|
restoreFocus: Y,
|
|
75
75
|
veil: s,
|
|
76
|
-
children: /* @__PURE__ */ g(J, { ref: I, className: L(j.menu, E, "menu"), ...b, children: m })
|
|
76
|
+
children: /* @__PURE__ */ g(J, { ref: I, className: L(j.menu, E, "tcn-menu"), ...b, children: m })
|
|
77
77
|
}
|
|
78
78
|
);
|
|
79
79
|
}), D = f.forwardRef(function({
|
|
@@ -129,7 +129,7 @@ import '../../menu.css';const Q = "_menu_9ce21e3", U = "_menu-item_68b387f", j =
|
|
|
129
129
|
ref: t,
|
|
130
130
|
"data-is-selected": !!R,
|
|
131
131
|
"data-has-children": !!a,
|
|
132
|
-
className: L(S, j["menu-item"], "menu-item"),
|
|
132
|
+
className: L(S, j["menu-item"], "tcn-menu-item"),
|
|
133
133
|
"data-is-open": s,
|
|
134
134
|
...c,
|
|
135
135
|
children: typeof d == "string" ? /* @__PURE__ */ g(O, { color: "inherit", children: d }) : d
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.js","sources":["../../../src/overlay/menu/menu.tsx"],"sourcesContent":["import { BodyText } from '../../typography/body_text/body_text.js';\nimport { useForkRef } from '../../utils/index.js';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport type { HStackProps } from '../../stacks/h_stack.js';\nimport type { VStackProps } from '../../stacks/v_stack.js';\nimport { Popper, type PopperProps } from '../popper/legacy/popper.js';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\nimport styles from './menu.module.css';\nimport { clsx } from 'clsx';\n\nexport type MenuProps = Omit<PopperProps & VStackProps, 'children'> & {\n children?: React.ReactNode;\n onActivatedMenu?: (hasActiveMenu: boolean) => void;\n direction?: 'up' | 'down';\n};\n\nexport const Menu = React.forwardRef(function Menu(\n {\n anchorElement,\n verticalAnchor,\n verticalOrigin,\n verticalOffset,\n horizontalAnchor,\n horizontalOrigin,\n horizontalOffset,\n direction,\n open,\n onClose,\n restoreFocus,\n veil,\n onActivatedMenu,\n children = [],\n className,\n ...props\n }: MenuProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const [focusedIndex, setFocusedIndex] = useState(-1);\n const clonedChildren = React.Children.toArray(children).map((child, index) => {\n if (!React.isValidElement(child)) {\n return child;\n }\n\n if (child.type !== MenuItem) {\n return React.cloneElement(child, {\n ...child.props,\n onClick: (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n child.props.onClick && child.props.onClick(e);\n },\n });\n }\n\n const props = {\n ...child.props,\n key: index,\n verticalAnchor: direction === 'up' ? 'bottom' : 'top',\n verticalOrigin: direction === 'up' ? 'bottom' : 'top',\n verticalOffset,\n horizontalAnchor: 'end',\n horizontalOrigin: 'start',\n horizontalOffset,\n direction,\n onClick: (e: React.MouseEvent<HTMLDivElement>) => {\n if (child.props.children == null) {\n onClose && onClose();\n }\n child.props.onClick && child.props.onClick(e);\n },\n onMouseEnter: (e: React.MouseEvent<HTMLDivElement>) => {\n setFocusedIndex(index);\n onActivatedMenu && onActivatedMenu(true);\n child.props.onMouseEnter && child.props.onMouseEnter(e);\n },\n };\n\n if (child.type === MenuItem) {\n props.open = focusedIndex === index;\n }\n\n return React.cloneElement(child, props);\n });\n\n direction === 'up' && clonedChildren.reverse();\n\n useLayoutEffect(() => {\n if (!open) {\n setFocusedIndex(-1);\n onActivatedMenu && onActivatedMenu(false);\n }\n }, [open, onActivatedMenu]);\n\n return (\n <Popper\n anchorElement={anchorElement}\n verticalAnchor={verticalAnchor}\n verticalOrigin={verticalOrigin}\n verticalOffset={verticalOffset}\n horizontalAnchor={horizontalAnchor || 'end'}\n horizontalOrigin={horizontalOrigin || 'end'}\n horizontalOffset={horizontalOffset}\n open={open}\n onClose={onClose}\n restoreFocus={restoreFocus}\n veil={veil}\n >\n <VStack ref={ref} className={clsx(styles.menu, className, 'menu')} {...props}>\n {clonedChildren}\n </VStack>\n </Popper>\n );\n});\n\nexport interface MenuItemProps extends Omit<HStackProps, 'children'> {\n open?: boolean;\n children?: React.ReactElement<MenuItemProps>[];\n selected?: boolean;\n label?: React.ReactNode;\n direction?: 'up' | 'down';\n verticalAnchor?: 'top' | 'center' | 'bottom';\n verticalOrigin?: 'top' | 'center' | 'bottom';\n verticalOffset?: number;\n horizontalAnchor?: 'center' | 'start' | 'end';\n horizontalOrigin?: 'center' | 'start' | 'end';\n horizontalOffset?: number;\n}\n\nexport const MenuItem = React.forwardRef(function MenuItem(\n {\n selected,\n label,\n className,\n children,\n direction = 'down',\n verticalAnchor = 'top',\n verticalOrigin = 'top',\n verticalOffset,\n horizontalAnchor = 'end',\n horizontalOrigin = 'start',\n horizontalOffset,\n open = false,\n ...props\n }: MenuItemProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const hasEnteredMenuRef = useRef(false);\n const cursorPositionRef = useRef({ x: -1, y: -1 });\n const cursorDeltaRef = useRef({ x: -1, y: -1 });\n const [showVeil, setShowVeil] = useState(false);\n const itemRef = useRef<HTMLElement | null>(null);\n const forkedRef = useForkRef(ref, itemRef);\n const hasSubmenu = children != null && children.length > 0;\n\n function close() {\n setShowVeil(false);\n }\n\n useLayoutEffect(() => {\n const itemElement = itemRef.current;\n\n if (itemElement && hasSubmenu && open) {\n const direction = window.getComputedStyle(itemElement).direction;\n\n const startPosition = cursorPositionRef.current;\n const delta = cursorDeltaRef.current;\n\n const calculateSlope = (event: MouseEvent) => {\n if (startPosition.x === -1) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n }\n\n const deltaX = event.clientX - startPosition.x;\n const deltaY = event.clientY - startPosition.y;\n delta.x = Math.max(Math.abs(deltaX), 0.001);\n delta.y = Math.max(Math.abs(deltaY), 0.001);\n\n const isSlopeWrongDirection =\n ((deltaX < 0 ||\n (direction === 'down' && deltaY < 0) ||\n (direction === 'up' && deltaY > 0)) &&\n direction === 'ltr') ||\n ((deltaX > 0 ||\n (direction === 'down' && deltaY < 0) ||\n (direction === 'up' && deltaY > 0)) &&\n direction === 'rtl');\n\n if (isSlopeWrongDirection) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n setShowVeil(false);\n return;\n }\n\n const distance = Math.sqrt(delta.x ** 2 + delta.y ** 2);\n\n if (hasEnteredMenuRef.current) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n setShowVeil(false);\n return;\n }\n\n if (distance > 5) {\n const movingHorizontal = delta.x / delta.y > 0.2;\n\n if (movingHorizontal) {\n setShowVeil(true);\n } else {\n setShowVeil(false);\n }\n\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n }\n };\n\n window.addEventListener('mousemove', calculateSlope);\n\n return () => {\n window.removeEventListener('mousemove', calculateSlope);\n };\n }\n }, [hasSubmenu, open]);\n\n useLayoutEffect(() => {\n setShowVeil(open);\n }, [open]);\n\n return (\n <>\n <HStack\n as=\"button\"\n ref={forkedRef}\n data-is-selected={Boolean(selected)}\n data-has-children={Boolean(hasSubmenu)}\n className={clsx(className, styles['menu-item'], 'menu-item')}\n data-is-open={open}\n {...props}\n >\n {typeof label === 'string' ? <BodyText color=\"inherit\">{label}</BodyText> : label}\n </HStack>\n {children && (\n <Menu\n anchorElement={itemRef.current}\n veil={showVeil}\n onClose={close}\n open={open}\n direction={direction}\n verticalAnchor={verticalAnchor}\n verticalOrigin={verticalOrigin}\n verticalOffset={verticalOffset}\n horizontalAnchor={horizontalAnchor}\n horizontalOrigin={horizontalOrigin}\n horizontalOffset={horizontalOffset}\n hAlign=\"start\"\n onActivatedMenu={hasActiveMenu => {\n hasEnteredMenuRef.current = hasActiveMenu;\n }}\n >\n {children}\n </Menu>\n )}\n </>\n );\n});\n"],"names":["Menu","React","anchorElement","verticalAnchor","verticalOrigin","verticalOffset","horizontalAnchor","horizontalOrigin","horizontalOffset","direction","open","onClose","restoreFocus","veil","onActivatedMenu","children","className","props","ref","focusedIndex","setFocusedIndex","useState","clonedChildren","child","index","MenuItem","useLayoutEffect","jsx","Popper","VStack","clsx","styles","selected","label","hasEnteredMenuRef","useRef","cursorPositionRef","cursorDeltaRef","showVeil","setShowVeil","itemRef","forkedRef","useForkRef","hasSubmenu","close","itemElement","startPosition","delta","calculateSlope","event","deltaX","deltaY","distance","movingHorizontal","jsxs","Fragment","HStack","BodyText","hasActiveMenu"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"menu.js","sources":["../../../src/overlay/menu/menu.tsx"],"sourcesContent":["import { BodyText } from '../../typography/body_text/body_text.js';\nimport { useForkRef } from '../../utils/index.js';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport type { HStackProps } from '../../stacks/h_stack.js';\nimport type { VStackProps } from '../../stacks/v_stack.js';\nimport { Popper, type PopperProps } from '../popper/legacy/popper.js';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\nimport styles from './menu.module.css';\nimport { clsx } from 'clsx';\n\nexport type MenuProps = Omit<PopperProps & VStackProps, 'children'> & {\n children?: React.ReactNode;\n onActivatedMenu?: (hasActiveMenu: boolean) => void;\n direction?: 'up' | 'down';\n};\n\nexport const Menu = React.forwardRef(function Menu(\n {\n anchorElement,\n verticalAnchor,\n verticalOrigin,\n verticalOffset,\n horizontalAnchor,\n horizontalOrigin,\n horizontalOffset,\n direction,\n open,\n onClose,\n restoreFocus,\n veil,\n onActivatedMenu,\n children = [],\n className,\n ...props\n }: MenuProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const [focusedIndex, setFocusedIndex] = useState(-1);\n const clonedChildren = React.Children.toArray(children).map((child, index) => {\n if (!React.isValidElement(child)) {\n return child;\n }\n\n if (child.type !== MenuItem) {\n return React.cloneElement(child, {\n ...child.props,\n onClick: (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n child.props.onClick && child.props.onClick(e);\n },\n });\n }\n\n const props = {\n ...child.props,\n key: index,\n verticalAnchor: direction === 'up' ? 'bottom' : 'top',\n verticalOrigin: direction === 'up' ? 'bottom' : 'top',\n verticalOffset,\n horizontalAnchor: 'end',\n horizontalOrigin: 'start',\n horizontalOffset,\n direction,\n onClick: (e: React.MouseEvent<HTMLDivElement>) => {\n if (child.props.children == null) {\n onClose && onClose();\n }\n child.props.onClick && child.props.onClick(e);\n },\n onMouseEnter: (e: React.MouseEvent<HTMLDivElement>) => {\n setFocusedIndex(index);\n onActivatedMenu && onActivatedMenu(true);\n child.props.onMouseEnter && child.props.onMouseEnter(e);\n },\n };\n\n if (child.type === MenuItem) {\n props.open = focusedIndex === index;\n }\n\n return React.cloneElement(child, props);\n });\n\n direction === 'up' && clonedChildren.reverse();\n\n useLayoutEffect(() => {\n if (!open) {\n setFocusedIndex(-1);\n onActivatedMenu && onActivatedMenu(false);\n }\n }, [open, onActivatedMenu]);\n\n return (\n <Popper\n anchorElement={anchorElement}\n verticalAnchor={verticalAnchor}\n verticalOrigin={verticalOrigin}\n verticalOffset={verticalOffset}\n horizontalAnchor={horizontalAnchor || 'end'}\n horizontalOrigin={horizontalOrigin || 'end'}\n horizontalOffset={horizontalOffset}\n open={open}\n onClose={onClose}\n restoreFocus={restoreFocus}\n veil={veil}\n >\n <VStack ref={ref} className={clsx(styles.menu, className, 'tcn-menu')} {...props}>\n {clonedChildren}\n </VStack>\n </Popper>\n );\n});\n\nexport interface MenuItemProps extends Omit<HStackProps, 'children'> {\n open?: boolean;\n children?: React.ReactElement<MenuItemProps>[];\n selected?: boolean;\n label?: React.ReactNode;\n direction?: 'up' | 'down';\n verticalAnchor?: 'top' | 'center' | 'bottom';\n verticalOrigin?: 'top' | 'center' | 'bottom';\n verticalOffset?: number;\n horizontalAnchor?: 'center' | 'start' | 'end';\n horizontalOrigin?: 'center' | 'start' | 'end';\n horizontalOffset?: number;\n}\n\nexport const MenuItem = React.forwardRef(function MenuItem(\n {\n selected,\n label,\n className,\n children,\n direction = 'down',\n verticalAnchor = 'top',\n verticalOrigin = 'top',\n verticalOffset,\n horizontalAnchor = 'end',\n horizontalOrigin = 'start',\n horizontalOffset,\n open = false,\n ...props\n }: MenuItemProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const hasEnteredMenuRef = useRef(false);\n const cursorPositionRef = useRef({ x: -1, y: -1 });\n const cursorDeltaRef = useRef({ x: -1, y: -1 });\n const [showVeil, setShowVeil] = useState(false);\n const itemRef = useRef<HTMLElement | null>(null);\n const forkedRef = useForkRef(ref, itemRef);\n const hasSubmenu = children != null && children.length > 0;\n\n function close() {\n setShowVeil(false);\n }\n\n useLayoutEffect(() => {\n const itemElement = itemRef.current;\n\n if (itemElement && hasSubmenu && open) {\n const direction = window.getComputedStyle(itemElement).direction;\n\n const startPosition = cursorPositionRef.current;\n const delta = cursorDeltaRef.current;\n\n const calculateSlope = (event: MouseEvent) => {\n if (startPosition.x === -1) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n }\n\n const deltaX = event.clientX - startPosition.x;\n const deltaY = event.clientY - startPosition.y;\n delta.x = Math.max(Math.abs(deltaX), 0.001);\n delta.y = Math.max(Math.abs(deltaY), 0.001);\n\n const isSlopeWrongDirection =\n ((deltaX < 0 ||\n (direction === 'down' && deltaY < 0) ||\n (direction === 'up' && deltaY > 0)) &&\n direction === 'ltr') ||\n ((deltaX > 0 ||\n (direction === 'down' && deltaY < 0) ||\n (direction === 'up' && deltaY > 0)) &&\n direction === 'rtl');\n\n if (isSlopeWrongDirection) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n setShowVeil(false);\n return;\n }\n\n const distance = Math.sqrt(delta.x ** 2 + delta.y ** 2);\n\n if (hasEnteredMenuRef.current) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n setShowVeil(false);\n return;\n }\n\n if (distance > 5) {\n const movingHorizontal = delta.x / delta.y > 0.2;\n\n if (movingHorizontal) {\n setShowVeil(true);\n } else {\n setShowVeil(false);\n }\n\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n }\n };\n\n window.addEventListener('mousemove', calculateSlope);\n\n return () => {\n window.removeEventListener('mousemove', calculateSlope);\n };\n }\n }, [hasSubmenu, open]);\n\n useLayoutEffect(() => {\n setShowVeil(open);\n }, [open]);\n\n return (\n <>\n <HStack\n as=\"button\"\n ref={forkedRef}\n data-is-selected={Boolean(selected)}\n data-has-children={Boolean(hasSubmenu)}\n className={clsx(className, styles['menu-item'], 'tcn-menu-item')}\n data-is-open={open}\n {...props}\n >\n {typeof label === 'string' ? <BodyText color=\"inherit\">{label}</BodyText> : label}\n </HStack>\n {children && (\n <Menu\n anchorElement={itemRef.current}\n veil={showVeil}\n onClose={close}\n open={open}\n direction={direction}\n verticalAnchor={verticalAnchor}\n verticalOrigin={verticalOrigin}\n verticalOffset={verticalOffset}\n horizontalAnchor={horizontalAnchor}\n horizontalOrigin={horizontalOrigin}\n horizontalOffset={horizontalOffset}\n hAlign=\"start\"\n onActivatedMenu={hasActiveMenu => {\n hasEnteredMenuRef.current = hasActiveMenu;\n }}\n >\n {children}\n </Menu>\n )}\n </>\n );\n});\n"],"names":["Menu","React","anchorElement","verticalAnchor","verticalOrigin","verticalOffset","horizontalAnchor","horizontalOrigin","horizontalOffset","direction","open","onClose","restoreFocus","veil","onActivatedMenu","children","className","props","ref","focusedIndex","setFocusedIndex","useState","clonedChildren","child","index","MenuItem","useLayoutEffect","jsx","Popper","VStack","clsx","styles","selected","label","hasEnteredMenuRef","useRef","cursorPositionRef","cursorDeltaRef","showVeil","setShowVeil","itemRef","forkedRef","useForkRef","hasSubmenu","close","itemElement","startPosition","delta","calculateSlope","event","deltaX","deltaY","distance","movingHorizontal","jsxs","Fragment","HStack","BodyText","hasActiveMenu"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popper.d.ts","sourceRoot":"","sources":["../../../../src/overlay/popper/legacy/popper.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4C,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"popper.d.ts","sourceRoot":"","sources":["../../../../src/overlay/popper/legacy/popper.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAKjE,MAAM,WAAW,WAAW;IAC1B,aAAa,EAAE,WAAW,GAAG,IAAI,CAAC;IAClC,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC7C,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC7C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC9C,gBAAgB,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IAC9C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACxE,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,CAAC;IAC/C,oBAAoB,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC;IACxD,qBAAqB,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC;IACzD,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAGD,wBAAgB,MAAM,CAAC,EACrB,aAAa,EACb,cAAyB,EACzB,cAAsB,EACtB,cAAkB,EAClB,gBAA0B,EAC1B,gBAA0B,EAC1B,gBAAoB,EACpB,YAAoB,EACpB,IAAY,EACZ,WAAW,EACX,aAAkB,EAClB,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,gBAAwB,EACxB,oBAAoB,EACpB,qBAAqB,GACtB,EAAE,WAAW,kDA8Kb"}
|
|
@@ -5,9 +5,10 @@ import { ScrollAwayListener as J } from "../../../utils/scroll_away_listener.js"
|
|
|
5
5
|
import { useRef as f, useState as K, useLayoutEffect as E } from "react";
|
|
6
6
|
import "../../../utils/hooks/use_resize_observer.js";
|
|
7
7
|
import { Portal as M } from "../../portal/portal.js";
|
|
8
|
-
import
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
import Q from "clsx";
|
|
9
|
+
import '../../../popper.css';const U = "_popover_fcfb66a", V = "_popover-veil_c56df66", P = { popover: U, "popover-veil": V };
|
|
10
|
+
function re({
|
|
11
|
+
anchorElement: r,
|
|
11
12
|
verticalAnchor: _ = "bottom",
|
|
12
13
|
verticalOrigin: j = "top",
|
|
13
14
|
verticalOffset: h = 0,
|
|
@@ -25,13 +26,13 @@ function ie({
|
|
|
25
26
|
isClickAwayException: W,
|
|
26
27
|
isScrollAwayException: $
|
|
27
28
|
}) {
|
|
28
|
-
const k = f(
|
|
29
|
+
const k = f(r), [c, q] = K({ top: 0, left: 0 }), x = f(null), w = f(null), T = u && r != null, D = H ?? [], F = !N, C = f(null);
|
|
29
30
|
function S() {
|
|
30
31
|
R && R();
|
|
31
32
|
}
|
|
32
33
|
const m = () => {
|
|
33
|
-
if (!
|
|
34
|
-
const e =
|
|
34
|
+
if (!r || !w.current) return;
|
|
35
|
+
const e = r.getBoundingClientRect(), o = w.current.getBoundingClientRect(), A = window.innerWidth, L = window.innerHeight, v = getComputedStyle(r).direction === "rtl";
|
|
35
36
|
let t = e.top, i = e.left;
|
|
36
37
|
switch (_) {
|
|
37
38
|
case "top":
|
|
@@ -55,8 +56,8 @@ function ie({
|
|
|
55
56
|
break;
|
|
56
57
|
}
|
|
57
58
|
d === "start" ? i += v ? e.width + s : s : d === "center" ? i += e.width / 2 : d === "end" && (i += v ? -s : e.width + s);
|
|
58
|
-
let
|
|
59
|
-
v && (a === "start" ?
|
|
59
|
+
let n = a;
|
|
60
|
+
v && (a === "start" ? n = "end" : a === "end" && (n = "start")), n === "start" || (n === "center" ? i -= o.width / 2 : n === "end" && (i -= o.width)), i + o.width > A && (i = A - o.width), i < 0 && (i = 0), t + o.height > L && (t = L - o.height), t < 0 && (t = 0), (t !== c.top || i !== c.left) && q({ top: t, left: i });
|
|
60
61
|
};
|
|
61
62
|
if (E(() => (m(), window.addEventListener("resize", m), () => {
|
|
62
63
|
window.removeEventListener("resize", m);
|
|
@@ -71,12 +72,12 @@ function ie({
|
|
|
71
72
|
}
|
|
72
73
|
}, [u, g]), !T)
|
|
73
74
|
return null;
|
|
74
|
-
k.current =
|
|
75
|
+
k.current = r;
|
|
75
76
|
let l = /* @__PURE__ */ p(J, { onScrollAway: S, isException: $, children: /* @__PURE__ */ p(
|
|
76
77
|
"div",
|
|
77
78
|
{
|
|
78
79
|
ref: w,
|
|
79
|
-
className: P.popover,
|
|
80
|
+
className: Q(P.popover, "tcn-popper"),
|
|
80
81
|
style: {
|
|
81
82
|
top: `${c.top}px`,
|
|
82
83
|
left: `${c.left}px`
|
|
@@ -106,6 +107,6 @@ function ie({
|
|
|
106
107
|
] });
|
|
107
108
|
}
|
|
108
109
|
export {
|
|
109
|
-
|
|
110
|
+
re as Popper
|
|
110
111
|
};
|
|
111
112
|
//# sourceMappingURL=popper.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"popper.js","sources":["../../../../src/overlay/popper/legacy/popper.tsx"],"sourcesContent":["import { ClickAwayListener, ScrollAwayListener } from '../../../utils/index.js';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\nimport { Portal } from '../../portal/portal.js';\nimport styles from './popper.module.css';\n\nexport interface PopperProps {\n anchorElement: HTMLElement | null;\n verticalAnchor?: 'top' | 'center' | 'bottom';\n verticalOrigin?: 'top' | 'center' | 'bottom';\n verticalOffset?: number;\n horizontalAnchor?: 'start' | 'center' | 'end';\n horizontalOrigin?: 'start' | 'center' | 'end';\n horizontalOffset?: number;\n open: boolean;\n onClose: () => void;\n restoreFocus?: boolean;\n children: React.ReactNode;\n veil?: boolean;\n onVeilClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n clickAwayRefs?: React.RefObject<HTMLElement>[];\n isClickAwayException?: (target: HTMLElement) => boolean;\n isScrollAwayException?: (target: HTMLElement) => boolean;\n disableClickAway?: boolean;\n}\n\n// This component is being phased out in favor of ElementPopper - need to ensure parity beforehand.\nexport function Popper({\n anchorElement,\n verticalAnchor = 'bottom',\n verticalOrigin = 'top',\n verticalOffset = 0,\n horizontalAnchor = 'start',\n horizontalOrigin = 'start',\n horizontalOffset = 0,\n restoreFocus = false,\n veil = false,\n onVeilClick,\n clickAwayRefs = [],\n open,\n onClose,\n children,\n disableClickAway = false,\n isClickAwayException,\n isScrollAwayException,\n}: PopperProps) {\n const anchorElementRef = useRef(anchorElement);\n const [position, setPosition] = useState({ top: 0, left: 0 });\n const activeElementRef = useRef<HTMLElement | null>(null);\n const popoverRef = useRef<HTMLDivElement>(null);\n const canOpen = open && anchorElement != null;\n const finalClickAwayRefs: React.RefObject<HTMLElement>[] = clickAwayRefs ?? [];\n const enableClickAway = !disableClickAway;\n const veilRef = useRef<HTMLDivElement>(null);\n function close() {\n onClose && onClose();\n }\n\n // eslint-disable-next-line complexity\n const updatePosition = () => {\n if (!anchorElement || !popoverRef.current) return;\n\n const anchorRect = anchorElement.getBoundingClientRect();\n const popoverRect = popoverRef.current.getBoundingClientRect();\n const viewportWidth = window.innerWidth;\n const viewportHeight = window.innerHeight;\n\n // Determine the text direction (ltr or rtl)\n const computedStyle = getComputedStyle(anchorElement);\n const isRtl = computedStyle.direction === 'rtl';\n\n let top = anchorRect.top;\n let left = anchorRect.left;\n\n // Calculate vertical position\n switch (verticalAnchor) {\n case 'top':\n top += verticalOffset;\n break;\n case 'center':\n top += anchorRect.height / 2;\n break;\n case 'bottom':\n top += anchorRect.height - verticalOffset;\n break;\n }\n\n switch (verticalOrigin) {\n case 'top':\n break;\n case 'center':\n top -= popoverRect.height / 2;\n break;\n case 'bottom':\n top -= popoverRect.height;\n break;\n }\n\n // Calculate horizontal position with direction sensitivity\n if (horizontalAnchor === 'start') {\n left += isRtl ? anchorRect.width + horizontalOffset : horizontalOffset;\n } else if (horizontalAnchor === 'center') {\n left += anchorRect.width / 2;\n } else if (horizontalAnchor === 'end') {\n left += isRtl ? -horizontalOffset : anchorRect.width + horizontalOffset;\n }\n\n // Adjust the origin based on RTL direction\n let adjustedHorizontalOrigin = horizontalOrigin;\n if (isRtl) {\n if (horizontalOrigin === 'start') {\n adjustedHorizontalOrigin = 'end';\n } else if (horizontalOrigin === 'end') {\n adjustedHorizontalOrigin = 'start';\n }\n }\n\n // Apply adjusted origin to the position calculation\n if (adjustedHorizontalOrigin === 'start') {\n // No adjustment needed\n } else if (adjustedHorizontalOrigin === 'center') {\n left -= popoverRect.width / 2;\n } else if (adjustedHorizontalOrigin === 'end') {\n left -= popoverRect.width;\n }\n\n // Ensure the popover stays within the viewport\n // Prevent overflow to the right\n if (left + popoverRect.width > viewportWidth) {\n left = viewportWidth - popoverRect.width;\n }\n\n // Prevent overflow to the left\n if (left < 0) {\n left = 0;\n }\n\n // Prevent overflow to the bottom\n if (top + popoverRect.height > viewportHeight) {\n top = viewportHeight - popoverRect.height;\n }\n\n // Prevent overflow to the top\n if (top < 0) {\n top = 0;\n }\n\n // Only update if position has changed to avoid unnecessary re-renders\n if (top !== position.top || left !== position.left) {\n setPosition({ top, left });\n }\n };\n\n useLayoutEffect(() => {\n updatePosition();\n window.addEventListener('resize', updatePosition);\n return () => {\n window.removeEventListener('resize', updatePosition);\n };\n });\n\n useLayoutEffect(() => {\n if (open) {\n activeElementRef.current = window.document.activeElement as HTMLElement;\n } else {\n const restoreToElement = activeElementRef.current;\n requestAnimationFrame(() => {\n restoreFocus && restoreToElement?.focus();\n });\n }\n }, [open, restoreFocus]);\n\n if (!canOpen) {\n return null;\n }\n\n anchorElementRef.current = anchorElement;\n\n let content = (\n <ScrollAwayListener onScrollAway={close} isException={isScrollAwayException}>\n <div\n ref={popoverRef}\n className={styles.popover}\n style={{\n top: `${position.top}px`,\n left: `${position.left}px`,\n }}\n >\n {children}\n </div>\n </ScrollAwayListener>\n );\n\n if (enableClickAway) {\n content = (\n <ClickAwayListener\n onClickAway={close}\n refs={[anchorElementRef, ...finalClickAwayRefs]}\n isException={isClickAwayException}\n >\n {content}\n </ClickAwayListener>\n );\n }\n\n return (\n <Portal>\n {veil && (\n <div\n ref={veilRef}\n onClick={e => veilRef.current === e.target && onVeilClick && onVeilClick(e)}\n className={styles['popover-veil']}\n >\n {content}\n </div>\n )}\n {!veil && content}\n </Portal>\n );\n}\n"],"names":["Popper","anchorElement","verticalAnchor","verticalOrigin","verticalOffset","horizontalAnchor","horizontalOrigin","horizontalOffset","restoreFocus","veil","onVeilClick","clickAwayRefs","open","onClose","children","disableClickAway","isClickAwayException","isScrollAwayException","anchorElementRef","useRef","position","setPosition","useState","activeElementRef","popoverRef","canOpen","finalClickAwayRefs","enableClickAway","veilRef","close","updatePosition","anchorRect","popoverRect","viewportWidth","viewportHeight","isRtl","top","left","adjustedHorizontalOrigin","useLayoutEffect","restoreToElement","content","jsx","ScrollAwayListener","styles","ClickAwayListener","Portal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"popper.js","sources":["../../../../src/overlay/popper/legacy/popper.tsx"],"sourcesContent":["import { ClickAwayListener, ScrollAwayListener } from '../../../utils/index.js';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\nimport { Portal } from '../../portal/portal.js';\nimport styles from './popper.module.css';\nimport clsx from 'clsx';\n\nexport interface PopperProps {\n anchorElement: HTMLElement | null;\n verticalAnchor?: 'top' | 'center' | 'bottom';\n verticalOrigin?: 'top' | 'center' | 'bottom';\n verticalOffset?: number;\n horizontalAnchor?: 'start' | 'center' | 'end';\n horizontalOrigin?: 'start' | 'center' | 'end';\n horizontalOffset?: number;\n open: boolean;\n onClose: () => void;\n restoreFocus?: boolean;\n children: React.ReactNode;\n veil?: boolean;\n onVeilClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n clickAwayRefs?: React.RefObject<HTMLElement>[];\n isClickAwayException?: (target: HTMLElement) => boolean;\n isScrollAwayException?: (target: HTMLElement) => boolean;\n disableClickAway?: boolean;\n}\n\n// This component is being phased out in favor of ElementPopper - need to ensure parity beforehand.\nexport function Popper({\n anchorElement,\n verticalAnchor = 'bottom',\n verticalOrigin = 'top',\n verticalOffset = 0,\n horizontalAnchor = 'start',\n horizontalOrigin = 'start',\n horizontalOffset = 0,\n restoreFocus = false,\n veil = false,\n onVeilClick,\n clickAwayRefs = [],\n open,\n onClose,\n children,\n disableClickAway = false,\n isClickAwayException,\n isScrollAwayException,\n}: PopperProps) {\n const anchorElementRef = useRef(anchorElement);\n const [position, setPosition] = useState({ top: 0, left: 0 });\n const activeElementRef = useRef<HTMLElement | null>(null);\n const popoverRef = useRef<HTMLDivElement>(null);\n const canOpen = open && anchorElement != null;\n const finalClickAwayRefs: React.RefObject<HTMLElement>[] = clickAwayRefs ?? [];\n const enableClickAway = !disableClickAway;\n const veilRef = useRef<HTMLDivElement>(null);\n function close() {\n onClose && onClose();\n }\n\n // eslint-disable-next-line complexity\n const updatePosition = () => {\n if (!anchorElement || !popoverRef.current) return;\n\n const anchorRect = anchorElement.getBoundingClientRect();\n const popoverRect = popoverRef.current.getBoundingClientRect();\n const viewportWidth = window.innerWidth;\n const viewportHeight = window.innerHeight;\n\n // Determine the text direction (ltr or rtl)\n const computedStyle = getComputedStyle(anchorElement);\n const isRtl = computedStyle.direction === 'rtl';\n\n let top = anchorRect.top;\n let left = anchorRect.left;\n\n // Calculate vertical position\n switch (verticalAnchor) {\n case 'top':\n top += verticalOffset;\n break;\n case 'center':\n top += anchorRect.height / 2;\n break;\n case 'bottom':\n top += anchorRect.height - verticalOffset;\n break;\n }\n\n switch (verticalOrigin) {\n case 'top':\n break;\n case 'center':\n top -= popoverRect.height / 2;\n break;\n case 'bottom':\n top -= popoverRect.height;\n break;\n }\n\n // Calculate horizontal position with direction sensitivity\n if (horizontalAnchor === 'start') {\n left += isRtl ? anchorRect.width + horizontalOffset : horizontalOffset;\n } else if (horizontalAnchor === 'center') {\n left += anchorRect.width / 2;\n } else if (horizontalAnchor === 'end') {\n left += isRtl ? -horizontalOffset : anchorRect.width + horizontalOffset;\n }\n\n // Adjust the origin based on RTL direction\n let adjustedHorizontalOrigin = horizontalOrigin;\n if (isRtl) {\n if (horizontalOrigin === 'start') {\n adjustedHorizontalOrigin = 'end';\n } else if (horizontalOrigin === 'end') {\n adjustedHorizontalOrigin = 'start';\n }\n }\n\n // Apply adjusted origin to the position calculation\n if (adjustedHorizontalOrigin === 'start') {\n // No adjustment needed\n } else if (adjustedHorizontalOrigin === 'center') {\n left -= popoverRect.width / 2;\n } else if (adjustedHorizontalOrigin === 'end') {\n left -= popoverRect.width;\n }\n\n // Ensure the popover stays within the viewport\n // Prevent overflow to the right\n if (left + popoverRect.width > viewportWidth) {\n left = viewportWidth - popoverRect.width;\n }\n\n // Prevent overflow to the left\n if (left < 0) {\n left = 0;\n }\n\n // Prevent overflow to the bottom\n if (top + popoverRect.height > viewportHeight) {\n top = viewportHeight - popoverRect.height;\n }\n\n // Prevent overflow to the top\n if (top < 0) {\n top = 0;\n }\n\n // Only update if position has changed to avoid unnecessary re-renders\n if (top !== position.top || left !== position.left) {\n setPosition({ top, left });\n }\n };\n\n useLayoutEffect(() => {\n updatePosition();\n window.addEventListener('resize', updatePosition);\n return () => {\n window.removeEventListener('resize', updatePosition);\n };\n });\n\n useLayoutEffect(() => {\n if (open) {\n activeElementRef.current = window.document.activeElement as HTMLElement;\n } else {\n const restoreToElement = activeElementRef.current;\n requestAnimationFrame(() => {\n restoreFocus && restoreToElement?.focus();\n });\n }\n }, [open, restoreFocus]);\n\n if (!canOpen) {\n return null;\n }\n\n anchorElementRef.current = anchorElement;\n\n let content = (\n <ScrollAwayListener onScrollAway={close} isException={isScrollAwayException}>\n <div\n ref={popoverRef}\n className={clsx(styles.popover, 'tcn-popper')}\n style={{\n top: `${position.top}px`,\n left: `${position.left}px`,\n }}\n >\n {children}\n </div>\n </ScrollAwayListener>\n );\n\n if (enableClickAway) {\n content = (\n <ClickAwayListener\n onClickAway={close}\n refs={[anchorElementRef, ...finalClickAwayRefs]}\n isException={isClickAwayException}\n >\n {content}\n </ClickAwayListener>\n );\n }\n\n return (\n <Portal>\n {veil && (\n <div\n ref={veilRef}\n onClick={e => veilRef.current === e.target && onVeilClick && onVeilClick(e)}\n className={styles['popover-veil']}\n >\n {content}\n </div>\n )}\n {!veil && content}\n </Portal>\n );\n}\n"],"names":["Popper","anchorElement","verticalAnchor","verticalOrigin","verticalOffset","horizontalAnchor","horizontalOrigin","horizontalOffset","restoreFocus","veil","onVeilClick","clickAwayRefs","open","onClose","children","disableClickAway","isClickAwayException","isScrollAwayException","anchorElementRef","useRef","position","setPosition","useState","activeElementRef","popoverRef","canOpen","finalClickAwayRefs","enableClickAway","veilRef","close","updatePosition","anchorRect","popoverRect","viewportWidth","viewportHeight","isRtl","top","left","adjustedHorizontalOrigin","useLayoutEffect","restoreToElement","content","jsx","ScrollAwayListener","clsx","styles","ClickAwayListener","Portal"],"mappings":"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"}
|
|
@@ -1,40 +1,40 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { forwardRef as u, useRef as
|
|
3
|
-
import { BasePopper as
|
|
1
|
+
import { jsx as r, Fragment as d } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as u, useRef as R } from "react";
|
|
3
|
+
import { BasePopper as a } from "./base/base_popper.js";
|
|
4
4
|
import "../../utils/click_away_listener.js";
|
|
5
5
|
import "../../utils/focus_redirect.js";
|
|
6
6
|
import "../../utils/scroll_away_listener.js";
|
|
7
7
|
import { useForkRef as w } from "../../utils/hooks/use_fork_ref.js";
|
|
8
8
|
import "../../utils/hooks/use_resize_observer.js";
|
|
9
|
-
import { ElementTethered as
|
|
10
|
-
import { usePreviewElement as
|
|
9
|
+
import { ElementTethered as v } from "../tethered/element_tethered.js";
|
|
10
|
+
import { usePreviewElement as E } from "./hooks/use_hover_trigger.js";
|
|
11
11
|
import { PopperDismissal as g } from "./base/dismissal_decorator.js";
|
|
12
12
|
const T = u(function({
|
|
13
|
-
anchorElement:
|
|
13
|
+
anchorElement: e,
|
|
14
14
|
restoreFocus: p,
|
|
15
|
-
children:
|
|
16
|
-
acceptedRefs:
|
|
15
|
+
children: i,
|
|
16
|
+
acceptedRefs: m = [],
|
|
17
17
|
isException: t,
|
|
18
18
|
dismissals: s = [g.MOUSE_LEAVE],
|
|
19
19
|
...f
|
|
20
20
|
}, n) {
|
|
21
|
-
const o =
|
|
22
|
-
return /* @__PURE__ */
|
|
23
|
-
|
|
21
|
+
const o = R(null), c = w(n, o), { isOpen: l, close: P } = E(e);
|
|
22
|
+
return /* @__PURE__ */ r(d, { children: /* @__PURE__ */ r(
|
|
23
|
+
a,
|
|
24
24
|
{
|
|
25
25
|
restoreFocus: p,
|
|
26
26
|
open: l,
|
|
27
27
|
onDismissal: P,
|
|
28
28
|
isException: t,
|
|
29
29
|
dismissals: s,
|
|
30
|
-
acceptedRefs: [o, ...
|
|
31
|
-
children: /* @__PURE__ */
|
|
32
|
-
|
|
30
|
+
acceptedRefs: [o, e, ...m],
|
|
31
|
+
children: /* @__PURE__ */ r(
|
|
32
|
+
v,
|
|
33
33
|
{
|
|
34
34
|
ref: c,
|
|
35
|
-
anchorElement:
|
|
35
|
+
anchorElement: e,
|
|
36
36
|
...f,
|
|
37
|
-
children:
|
|
37
|
+
children: i
|
|
38
38
|
}
|
|
39
39
|
)
|
|
40
40
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"preview_popper.js","sources":["../../../src/overlay/popper/preview_popper.tsx"],"sourcesContent":["import { forwardRef, useRef, type PropsWithChildren } from 'react';\nimport { BasePopper, type BasePopperProps } from './base/base_popper.js';\nimport { useForkRef } from '../../utils/index.js';\nimport {\n ElementTethered,\n type ElementTetheredProps,\n} from '../tethered/element_tethered.js';\nimport { usePreviewElement } from './hooks/use_hover_trigger.js';\nimport { PopperDismissal } from './base/dismissal_decorator.js';\n\nexport type PreviewPopperProps = Omit<BasePopperProps, 'open' | 'onDismissal'> &\n ElementTetheredProps;\n\nexport const PreviewPopper = forwardRef<\n HTMLElement,\n PropsWithChildren<PreviewPopperProps>\n>(function PreviewPopper(\n {\n anchorElement,\n restoreFocus,\n children,\n acceptedRefs = [],\n isException,\n dismissals = [PopperDismissal.MOUSE_LEAVE],\n ...elementTetheredProps\n },\n ref\n) {\n const popperRef = useRef<HTMLElement>(null);\n const merged = useForkRef(ref, popperRef);\n\n const { isOpen, close } = usePreviewElement(anchorElement);\n\n return (\n <>\n <BasePopper\n restoreFocus={restoreFocus}\n open={isOpen}\n onDismissal={close}\n isException={isException}\n dismissals={dismissals}\n acceptedRefs={[popperRef, ...acceptedRefs]}\n >\n <ElementTethered\n ref={merged}\n anchorElement={anchorElement}\n {...elementTetheredProps}\n >\n {children}\n </ElementTethered>\n </BasePopper>\n </>\n );\n});\n"],"names":["PreviewPopper","forwardRef","anchorElement","restoreFocus","children","acceptedRefs","isException","dismissals","PopperDismissal","elementTetheredProps","ref","popperRef","useRef","merged","useForkRef","isOpen","close","usePreviewElement","jsx","Fragment","BasePopper","ElementTethered"],"mappings":";;;;;;;;;;;AAaO,MAAMA,IAAgBC,EAG3B,SACA;AAAA,EACE,eAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC,IAAe,CAAA;AAAA,EACf,aAAAC;AAAA,EACA,YAAAC,IAAa,CAACC,EAAgB,WAAW;AAAA,EACzC,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAYC,EAAoB,IAAI,GACpCC,IAASC,EAAWJ,GAAKC,CAAS,GAElC,EAAE,QAAAI,GAAQ,OAAAC,MAAUC,EAAkBf,CAAa;AAEzD,SACE,gBAAAgB,EAAAC,GAAA,EACE,UAAA,gBAAAD;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,cAAAjB;AAAA,MACA,MAAMY;AAAA,MACN,aAAaC;AAAA,MACb,aAAAV;AAAA,MACA,YAAAC;AAAA,MACA,cAAc,CAACI,
|
|
1
|
+
{"version":3,"file":"preview_popper.js","sources":["../../../src/overlay/popper/preview_popper.tsx"],"sourcesContent":["import { forwardRef, useRef, type PropsWithChildren } from 'react';\nimport { BasePopper, type BasePopperProps } from './base/base_popper.js';\nimport { useForkRef } from '../../utils/index.js';\nimport {\n ElementTethered,\n type ElementTetheredProps,\n} from '../tethered/element_tethered.js';\nimport { usePreviewElement } from './hooks/use_hover_trigger.js';\nimport { PopperDismissal } from './base/dismissal_decorator.js';\n\nexport type PreviewPopperProps = Omit<BasePopperProps, 'open' | 'onDismissal'> &\n ElementTetheredProps;\n\nexport const PreviewPopper = forwardRef<\n HTMLElement,\n PropsWithChildren<PreviewPopperProps>\n>(function PreviewPopper(\n {\n anchorElement,\n restoreFocus,\n children,\n acceptedRefs = [],\n isException,\n dismissals = [PopperDismissal.MOUSE_LEAVE],\n ...elementTetheredProps\n },\n ref\n) {\n const popperRef = useRef<HTMLElement>(null);\n const merged = useForkRef(ref, popperRef);\n\n const { isOpen, close } = usePreviewElement(anchorElement);\n\n return (\n <>\n <BasePopper\n restoreFocus={restoreFocus}\n open={isOpen}\n onDismissal={close}\n isException={isException}\n dismissals={dismissals}\n acceptedRefs={[popperRef, anchorElement, ...acceptedRefs]}\n >\n <ElementTethered\n ref={merged}\n anchorElement={anchorElement}\n {...elementTetheredProps}\n >\n {children}\n </ElementTethered>\n </BasePopper>\n </>\n );\n});\n"],"names":["PreviewPopper","forwardRef","anchorElement","restoreFocus","children","acceptedRefs","isException","dismissals","PopperDismissal","elementTetheredProps","ref","popperRef","useRef","merged","useForkRef","isOpen","close","usePreviewElement","jsx","Fragment","BasePopper","ElementTethered"],"mappings":";;;;;;;;;;;AAaO,MAAMA,IAAgBC,EAG3B,SACA;AAAA,EACE,eAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC,IAAe,CAAA;AAAA,EACf,aAAAC;AAAA,EACA,YAAAC,IAAa,CAACC,EAAgB,WAAW;AAAA,EACzC,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAYC,EAAoB,IAAI,GACpCC,IAASC,EAAWJ,GAAKC,CAAS,GAElC,EAAE,QAAAI,GAAQ,OAAAC,MAAUC,EAAkBf,CAAa;AAEzD,SACE,gBAAAgB,EAAAC,GAAA,EACE,UAAA,gBAAAD;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,cAAAjB;AAAA,MACA,MAAMY;AAAA,MACN,aAAaC;AAAA,MACb,aAAAV;AAAA,MACA,YAAAC;AAAA,MACA,cAAc,CAACI,GAAWT,GAAe,GAAGG,CAAY;AAAA,MAExD,UAAA,gBAAAa;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,KAAKR;AAAA,UACL,eAAAX;AAAA,UACC,GAAGO;AAAA,UAEH,UAAAL;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA,GAEJ;AAEJ,CAAC;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer tcn-system{:where(body>*){position:relative;z-index:0}:where(.tcn-portal){position:absolute!important;inset:0;overflow:hidden;padding:0;margin:0;pointer-events:none}:where(.tcn-portal>*){pointer-events:auto}:where(.tcn-portal-platform){position:fixed!important;inset:0;overflow:hidden;padding:0;margin:0;background-color:#0000;pointer-events:none;transform:none;z-index:1}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"portal_platform.d.ts","sourceRoot":"","sources":["../../../src/overlay/portal/portal_platform.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,cAAc,CAAC;AAEtB,qBAAa,eAAe;IAC1B,OAAO,CAAC,OAAO,CAA6B;IAC5C,GAAG,EAAE,cAAc,CAAC;IACpB,UAAU,UAAS;gBAEP,GAAG,6BAAS,EAAE,MAAM,GAAE,MAAM,GAAG,MAAY;IAOvD,SAAS,CAAC,MAAM,GAAE,MAAM,GAAG,MAAY;IAMvC,MAAM,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS;CAOjC;AAED,qBAAa,cAAc;IACzB,OAAO,CAAC,OAAO,CAA6B;IAC5C,OAAO,CAAC,KAAK,CAAc;IAC3B,OAAO,CAAC,QAAQ,CAAyB;IAEzC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;gBAEtB,GAAG,6BAAS,EAAE,IAAI,GAAE,WAA+B;
|
|
1
|
+
{"version":3,"file":"portal_platform.d.ts","sourceRoot":"","sources":["../../../src/overlay/portal/portal_platform.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,cAAc,CAAC;AAEtB,qBAAa,eAAe;IAC1B,OAAO,CAAC,OAAO,CAA6B;IAC5C,GAAG,EAAE,cAAc,CAAC;IACpB,UAAU,UAAS;gBAEP,GAAG,6BAAS,EAAE,MAAM,GAAE,MAAM,GAAG,MAAY;IAOvD,SAAS,CAAC,MAAM,GAAE,MAAM,GAAG,MAAY;IAMvC,MAAM,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS;CAOjC;AAED,qBAAa,cAAc;IACzB,OAAO,CAAC,OAAO,CAA6B;IAC5C,OAAO,CAAC,KAAK,CAAc;IAC3B,OAAO,CAAC,QAAQ,CAAyB;IAEzC,QAAQ,CAAC,QAAQ,EAAE,cAAc,CAAC;gBAEtB,GAAG,6BAAS,EAAE,IAAI,GAAE,WAA+B;IAM/D,OAAO,CAAC,gBAAgB;IAkBxB,SAAS,CAAC,MAAM,GAAE,MAAM,GAAG,MAAe;IAM1C,OAAO,CAAC,IAAI,EAAE,WAAW,GAAG,IAAI;IAQhC,YAAY;IAMZ,WAAW,CAAC,MAAM,EAAE,eAAe;IAMnC,aAAa,CAAC,MAAM,EAAE,eAAe;IAIrC,YAAY,CAAC,MAAM,EAAE,eAAe;IAUpC,YAAY;IAMZ,uBAAuB;IAMvB,OAAO;CAKR"}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { createPortal as e } from "react-dom";
|
|
2
|
-
import '
|
|
2
|
+
import './portal.css';/* empty css */
|
|
3
|
+
class s {
|
|
3
4
|
_window;
|
|
4
5
|
div;
|
|
5
6
|
hasMounted = !1;
|
|
6
7
|
constructor(t = window, o = "0") {
|
|
7
|
-
this._window = t, this.div = this._window.document.createElement("div"), this.div.className = "portal", this.setZIndex(o);
|
|
8
|
+
this._window = t, this.div = this._window.document.createElement("div"), this.div.className = "tcn-portal", this.setZIndex(o);
|
|
8
9
|
}
|
|
9
10
|
setZIndex(t = "0") {
|
|
10
11
|
this.div != null && (this.div.style.zIndex = t.toString());
|
|
@@ -19,17 +20,17 @@ class a {
|
|
|
19
20
|
_portals = [];
|
|
20
21
|
platform;
|
|
21
22
|
constructor(t = window, o = t.document.body) {
|
|
22
|
-
this._window = t, this._root = o, this.platform = this._getPlatformRoot()
|
|
23
|
+
this._window = t, this._root = o, this.platform = this._getPlatformRoot();
|
|
23
24
|
}
|
|
24
25
|
_getPlatformRoot() {
|
|
25
26
|
const t = this._window.document.body.querySelector(
|
|
26
|
-
".platform-root"
|
|
27
|
+
".tcn-platform-root"
|
|
27
28
|
);
|
|
28
29
|
if (t)
|
|
29
30
|
return t;
|
|
30
31
|
{
|
|
31
32
|
const o = this._window.document.createElement("div"), i = this._window.document.createElement("div");
|
|
32
|
-
return i.id = "portal-platform", i.classList.add("portal-platform"), o.appendChild(i), o;
|
|
33
|
+
return i.id = "tcn-portal-platform", i.classList.add("tcn-portal-platform"), o.appendChild(i), o.classList.add("tcn-platform-root"), o;
|
|
33
34
|
}
|
|
34
35
|
}
|
|
35
36
|
setZIndex(t = "auto") {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"portal_platform.js","sources":["../../../src/overlay/portal/portal_platform.tsx"],"sourcesContent":["import React from 'react';\nimport { createPortal } from 'react-dom';\nimport './portal.css';\n\nexport class PortalPresenter {\n private _window: Window & typeof globalThis;\n div: HTMLDivElement;\n hasMounted = false;\n\n constructor(win = window, zIndex: number | string = '0') {\n this._window = win;\n this.div = this._window.document.createElement('div');\n this.div.className = 'portal';\n this.setZIndex(zIndex);\n }\n\n setZIndex(zIndex: number | string = '0') {\n if (this.div != null) {\n this.div.style.zIndex = zIndex.toString();\n }\n }\n\n render(children: React.ReactNode) {\n if (this.div == null) {\n return null;\n }\n\n return createPortal(children, this.div);\n }\n}\n\nexport class PortalPlatform {\n private _window: Window & typeof globalThis;\n private _root: HTMLElement;\n private _portals: PortalPresenter[] = [];\n\n readonly platform: HTMLDivElement;\n\n constructor(win = window, root: HTMLElement = win.document.body) {\n this._window = win;\n this._root = root;\n this.platform = this._getPlatformRoot();\n
|
|
1
|
+
{"version":3,"file":"portal_platform.js","sources":["../../../src/overlay/portal/portal_platform.tsx"],"sourcesContent":["import React from 'react';\nimport { createPortal } from 'react-dom';\nimport './portal.css';\n\nexport class PortalPresenter {\n private _window: Window & typeof globalThis;\n div: HTMLDivElement;\n hasMounted = false;\n\n constructor(win = window, zIndex: number | string = '0') {\n this._window = win;\n this.div = this._window.document.createElement('div');\n this.div.className = 'tcn-portal';\n this.setZIndex(zIndex);\n }\n\n setZIndex(zIndex: number | string = '0') {\n if (this.div != null) {\n this.div.style.zIndex = zIndex.toString();\n }\n }\n\n render(children: React.ReactNode) {\n if (this.div == null) {\n return null;\n }\n\n return createPortal(children, this.div);\n }\n}\n\nexport class PortalPlatform {\n private _window: Window & typeof globalThis;\n private _root: HTMLElement;\n private _portals: PortalPresenter[] = [];\n\n readonly platform: HTMLDivElement;\n\n constructor(win = window, root: HTMLElement = win.document.body) {\n this._window = win;\n this._root = root;\n this.platform = this._getPlatformRoot();\n }\n\n private _getPlatformRoot() {\n const existingPlatformRoot = this._window.document.body.querySelector(\n '.tcn-platform-root'\n ) as HTMLDivElement | null;\n if (!existingPlatformRoot) {\n const root = this._window.document.createElement('div');\n const portalPlatform = this._window.document.createElement('div');\n portalPlatform.id = 'tcn-portal-platform';\n portalPlatform.classList.add('tcn-portal-platform');\n root.appendChild(portalPlatform);\n root.classList.add('tcn-platform-root');\n\n return root;\n } else {\n return existingPlatformRoot;\n }\n }\n\n setZIndex(zIndex: number | string = 'auto') {\n if (this.platform != null) {\n this.platform.style.zIndex = zIndex.toString();\n }\n }\n\n setRoot(root: HTMLElement | null) {\n if (root !== this._root) {\n this.platform?.parentNode?.removeChild(this.platform);\n this._root = root == null ? document.body : root;\n this.showPlatform();\n }\n }\n\n createPortal() {\n const portal = new PortalPresenter(this._window);\n this._portals.push(portal);\n return portal;\n }\n\n mountPortal(portal: PortalPresenter) {\n portal.hasMounted = true;\n this.platform.firstElementChild?.appendChild(portal.div);\n this.showPlatform();\n }\n\n unmountPortal(portal: PortalPresenter) {\n this.removePortal(portal);\n }\n\n removePortal(portal: PortalPresenter) {\n const index = this._portals.indexOf(portal);\n if (index > -1) {\n portal.hasMounted = false;\n this._portals.splice(index, 1);\n this.platform.firstElementChild?.removeChild(portal.div);\n this.hidePlatformIfNecessary();\n }\n }\n\n showPlatform() {\n if (this.platform != null && this.platform.parentElement == null) {\n this._root.appendChild(this.platform);\n }\n }\n\n hidePlatformIfNecessary() {\n if (this._portals.length === 0 && this.platform.parentElement != null) {\n this._root.removeChild(this.platform);\n }\n }\n\n dispose() {\n if (this.platform != null && this._root.contains(this.platform)) {\n this._root.removeChild(this.platform);\n }\n }\n}\n"],"names":["PortalPresenter","win","zIndex","children","createPortal","PortalPlatform","root","existingPlatformRoot","portalPlatform","portal","index"],"mappings":";;AAIO,MAAMA,EAAgB;AAAA,EACnB;AAAA,EACR;AAAA,EACA,aAAa;AAAA,EAEb,YAAYC,IAAM,QAAQC,IAA0B,KAAK;AACvD,SAAK,UAAUD,GACf,KAAK,MAAM,KAAK,QAAQ,SAAS,cAAc,KAAK,GACpD,KAAK,IAAI,YAAY,cACrB,KAAK,UAAUC,CAAM;AAAA,EACvB;AAAA,EAEA,UAAUA,IAA0B,KAAK;AACvC,IAAI,KAAK,OAAO,SACd,KAAK,IAAI,MAAM,SAASA,EAAO,SAAA;AAAA,EAEnC;AAAA,EAEA,OAAOC,GAA2B;AAChC,WAAI,KAAK,OAAO,OACP,OAGFC,EAAaD,GAAU,KAAK,GAAG;AAAA,EACxC;AACF;AAEO,MAAME,EAAe;AAAA,EAClB;AAAA,EACA;AAAA,EACA,WAA8B,CAAA;AAAA,EAE7B;AAAA,EAET,YAAYJ,IAAM,QAAQK,IAAoBL,EAAI,SAAS,MAAM;AAC/D,SAAK,UAAUA,GACf,KAAK,QAAQK,GACb,KAAK,WAAW,KAAK,iBAAA;AAAA,EACvB;AAAA,EAEQ,mBAAmB;AACzB,UAAMC,IAAuB,KAAK,QAAQ,SAAS,KAAK;AAAA,MACtD;AAAA,IAAA;AAEF,QAAKA;AAUH,aAAOA;AAVkB;AACzB,YAAMD,IAAO,KAAK,QAAQ,SAAS,cAAc,KAAK,GAChDE,IAAiB,KAAK,QAAQ,SAAS,cAAc,KAAK;AAChE,aAAAA,EAAe,KAAK,uBACpBA,EAAe,UAAU,IAAI,qBAAqB,GAClDF,EAAK,YAAYE,CAAc,GAC/BF,EAAK,UAAU,IAAI,mBAAmB,GAE/BA;AAAA,IACT;AAAA,EAGF;AAAA,EAEA,UAAUJ,IAA0B,QAAQ;AAC1C,IAAI,KAAK,YAAY,SACnB,KAAK,SAAS,MAAM,SAASA,EAAO,SAAA;AAAA,EAExC;AAAA,EAEA,QAAQI,GAA0B;AAChC,IAAIA,MAAS,KAAK,UAChB,KAAK,UAAU,YAAY,YAAY,KAAK,QAAQ,GACpD,KAAK,QAAQA,KAAe,SAAS,MACrC,KAAK,aAAA;AAAA,EAET;AAAA,EAEA,eAAe;AACb,UAAMG,IAAS,IAAIT,EAAgB,KAAK,OAAO;AAC/C,gBAAK,SAAS,KAAKS,CAAM,GAClBA;AAAA,EACT;AAAA,EAEA,YAAYA,GAAyB;AACnC,IAAAA,EAAO,aAAa,IACpB,KAAK,SAAS,mBAAmB,YAAYA,EAAO,GAAG,GACvD,KAAK,aAAA;AAAA,EACP;AAAA,EAEA,cAAcA,GAAyB;AACrC,SAAK,aAAaA,CAAM;AAAA,EAC1B;AAAA,EAEA,aAAaA,GAAyB;AACpC,UAAMC,IAAQ,KAAK,SAAS,QAAQD,CAAM;AAC1C,IAAIC,IAAQ,OACVD,EAAO,aAAa,IACpB,KAAK,SAAS,OAAOC,GAAO,CAAC,GAC7B,KAAK,SAAS,mBAAmB,YAAYD,EAAO,GAAG,GACvD,KAAK,wBAAA;AAAA,EAET;AAAA,EAEA,eAAe;AACb,IAAI,KAAK,YAAY,QAAQ,KAAK,SAAS,iBAAiB,QAC1D,KAAK,MAAM,YAAY,KAAK,QAAQ;AAAA,EAExC;AAAA,EAEA,0BAA0B;AACxB,IAAI,KAAK,SAAS,WAAW,KAAK,KAAK,SAAS,iBAAiB,QAC/D,KAAK,MAAM,YAAY,KAAK,QAAQ;AAAA,EAExC;AAAA,EAEA,UAAU;AACR,IAAI,KAAK,YAAY,QAAQ,KAAK,MAAM,SAAS,KAAK,QAAQ,KAC5D,KAAK,MAAM,YAAY,KAAK,QAAQ;AAAA,EAExC;AACF;"}
|
package/dist/page.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._page_b219ddf{width:100%;height:100%;overflow:auto;z-index:1;gap:var(--gap);padding:var(--padding)}._page_b219ddf>.stack{gap:var(--gap)}
|
|
1
|
+
@layer tcn-system{:where(._page_b219ddf){width:100%;height:100%;overflow:auto;z-index:1;gap:var(--gap);padding:var(--padding)}:where(._page_b219ddf>.stack){gap:var(--gap)}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._phone-number-input_5c4483d{position:relative;opacity:1;border-radius:0}._phone-number-input_5c4483d[data-has-phone-book=false]{border-end-end-radius:4px;border-start-end-radius:4px}._phone-number-input-select_a7b33ac{border-end-end-radius:0px;border-start-end-radius:0px}._phone-number-input_5c4483d>*{position:relative;z-index:1}._phone-number-input-select_a7b33ac:has(button){z-index:2}._phone-number-input-input_5b14556:has(input:focus)
|
|
1
|
+
@layer tcn-system{:where(._phone-number-input_5c4483d){position:relative;opacity:1;border-radius:0}:where(._phone-number-input_5c4483d[data-has-phone-book=false]){border-end-end-radius:4px;border-start-end-radius:4px}:where(._phone-number-input-select_a7b33ac){border-end-end-radius:0px;border-start-end-radius:0px}:where(._phone-number-input_5c4483d>*){position:relative;z-index:1}:where(._phone-number-input-select_a7b33ac:has(button)){z-index:2}:where(._phone-number-input-input_5b14556:has(input:focus)),:where(._phone-number-input-select_a7b33ac:focus),:where(._phone-number-input-input_5b14556:has(input:focus-visible)),:where(._phone-number-input-select_a7b33ac:focus-visible){z-index:3}:where(._phone-number-input-phone-book-popover_1511f35){border-radius:calc(4px * var(--scalar, 1));padding:8px;background-color:#fefefe;box-shadow:var(--raised-box-shadow),var(--drop-shadow-depth-3);min-width:calc(200px * var(--scalar, 1))}:where(._phone-number-input-phone-book_7999ca1){border-start-start-radius:0px;border-end-start-radius:0px;height:calc(26px * var(--scalar, 1))!important;width:calc(26px * var(--scalar, 1))!important;min-height:calc(26px * var(--scalar, 1))!important;min-width:calc(26px * var(--scalar, 1))!important;max-height:calc(26px * var(--scalar, 1))!important;max-width:calc(26px * var(--scalar, 1))!important}:where(._phone-number-input-obfuscated_5a0ed8c){user-select:none;-webkit-user-select:none;cursor:default;width:100%;height:100%}:where(._phone-number-input-obfuscated_5a0ed8c::selection){background:transparent}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._picture-placeholder_ec357fb{color:var(--color)}
|
|
1
|
+
@layer tcn-system{:where(._picture-placeholder_ec357fb){color:var(--color)}}
|
package/dist/popper.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._popover_fcfb66a{display:inline-block;position:absolute}._popover-veil_c56df66{position:fixed;inset:0;background-color:#0000}
|
|
1
|
+
@layer tcn-system{:where(._popover_fcfb66a){display:inline-block;position:absolute}:where(._popover-veil_c56df66){position:fixed;inset:0;background-color:#0000}}
|
package/dist/progress_bar.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--progress-bar-color: var(--accent-color)
|
|
1
|
+
@system{:root { --progress-bar-color: var(--accent-color); --progress-bar-background: #dadada; } :where(._progress-bar-container_014b4d9) {width: 100%;} :where(._progress-bar-background_9176cc0) {width: 100%; height: 100%; background-color: var(--progress-bar-background);} :where(._progress-bar_057c33d) {width: 100%; height: 100%; -webkit-appearance: none; appearance: none; background: transparent; user-select: none; overflow: hidden;} :where(._progress-bar-fill_00854f0) {height: 100%; overflow: hidden; width: var(--progress-percentage, 50%); background-color: var(--progress-bar-color); transition: width .2s ease-out;} :where(._progress-bar-fill_00854f0::before) {content: ""; position: absolute; top: 0px; left: -20px; height: 100%; width: calc(100% + 40px) ; background-size: 20px 20px; animation: _moveStripes_d219e85 .5s linear infinite;} :where(._progress-bar-fill_00854f0[data-finished="true"]::before) {animation: none; background-image: none;} @keyframes _moveStripes_d219e85 {0% {transform: translateX(0);} 100% {transform: translateX(20px);}}}
|
package/dist/radio.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._radio_ce5c4e1{appearance:none;-webkit-appearance:none;-moz-appearance:none;min-width:16px;min-height:16px;width:16px;height:16px;border-radius:50%;outline:none;outline-offset:0;cursor:pointer;margin:0;margin-inline-end:6px;background-color:#fff;border:1px solid var(--accent-color);box-sizing:border-box;-webkit-tap-highlight-color:transparent}._radio_ce5c4e1[data-is-disabled=true]{background-color:#0000000d;cursor:not-allowed;opacity:.5}._radio_ce5c4e1:checked
|
|
1
|
+
@layer tcn-system{:where(._radio_ce5c4e1){appearance:none;-webkit-appearance:none;-moz-appearance:none;min-width:16px;min-height:16px;width:16px;height:16px;border-radius:50%;outline:none;outline-offset:0;cursor:pointer;margin:0;margin-inline-end:6px;background-color:#fff;border:1px solid var(--accent-color);box-sizing:border-box;-webkit-tap-highlight-color:transparent}:where(._radio_ce5c4e1[data-is-disabled=true]){background-color:#0000000d;cursor:not-allowed;opacity:.5}:where(._radio_ce5c4e1:checked),:where(._radio_ce5c4e1[data-checked=true]){border:5px solid var(--accent-color);background-color:#fff}:where(._radio_ce5c4e1:focus){outline:3px solid color-mix(in srgb,var(--accent-color) 40%,transparent)}:where(._radio_ce5c4e1+label){font-size:14px;-webkit-user-select:none;user-select:none;cursor:pointer;-webkit-tap-highlight-color:transparent}:where(._radio_ce5c4e1[data-is-disabled=true]+label){font-size:14px;-webkit-user-select:none;user-select:none;cursor:pointer;opacity:.5}}
|
package/dist/rect.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._rect_60482cd{display:grid;place-items:center center;border:1px solid color-mix(in srgb,var(--color) 25%,rgba(0,0,0,.5));color:color-mix(in srgb,var(--color) 15%,rgba(0,0,0,.8));background-color:var(--color);flex-shrink:0}
|
|
1
|
+
@layer tcn-system{:where(._rect_60482cd){display:grid;place-items:center center;border:1px solid color-mix(in srgb,var(--color) 25%,rgba(0,0,0,.5));color:color-mix(in srgb,var(--color) 15%,rgba(0,0,0,.8));background-color:var(--color);flex-shrink:0}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._right-resize-handle_7f232b9{position:fixed;bottom:0;right:var(--resize-offset, -8px);height:100%;width:16px;z-index:1;cursor:ew-resize;pointer-events:auto}
|
|
1
|
+
@layer tcn-system{:where(._right-resize-handle_7f232b9){position:fixed;bottom:0;right:var(--resize-offset, -8px);height:100%;width:16px;z-index:1;cursor:ew-resize;pointer-events:auto}}
|
package/dist/scaffold.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._scaffold-stack_8f97a6a{width:100%;height:100%;overflow:auto}
|
|
1
|
+
@layer tcn-system{:where(._scaffold-stack_8f97a6a){width:100%;height:100%;overflow:auto}}
|
package/dist/select.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._select_aabe288{position:relative;box-sizing:border-box;padding-inline-end:calc(24px * var(--scalar, 1))}._select_aabe288
|
|
1
|
+
@layer tcn-system{._select_aabe288{position:relative;box-sizing:border-box;padding-inline-end:calc(24px * var(--scalar, 1))}._select_aabe288{border:1px solid #aaa;color:currentColor}._select_aabe288:focus{outline:3px solid color-mix(in srgb,var(--accent-color) 40%,transparent)}._select_aabe288:dir(ltr):after{content:"";position:absolute;right:calc(4px * var(--scalar, 1));top:50%;transform:translateY(-50%);width:calc(18px * var(--scalar, 1));height:calc(18px * var(--scalar, 1));background-color:currentColor;-webkit-mask-image:url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 24 24' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.46967 8.46967C5.76256 8.17678 6.23744 8.17678 6.53033 8.46967L12 13.9393L17.4697 8.46967C17.7626 8.17678 18.2374 8.17678 18.5303 8.46967C18.8232 8.76256 18.8232 9.23744 18.5303 9.53033L12.5303 15.5303C12.2374 15.8232 11.7626 15.8232 11.4697 15.5303L5.46967 9.53033C5.17678 9.23744 5.17678 8.76256 5.46967 8.46967Z'%3E%3C/path%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 24 24' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.46967 8.46967C5.76256 8.17678 6.23744 8.17678 6.53033 8.46967L12 13.9393L17.4697 8.46967C17.7626 8.17678 18.2374 8.17678 18.5303 8.46967C18.8232 8.76256 18.8232 9.23744 18.5303 9.53033L12.5303 15.5303C12.2374 15.8232 11.7626 15.8232 11.4697 15.5303L5.46967 9.53033C5.17678 9.23744 5.17678 8.76256 5.46967 8.46967Z'%3E%3C/path%3E%3C/svg%3E");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;pointer-events:none}._select_aabe288:dir(rtl):after{content:"";position:absolute;left:calc(4px * var(--scalar, 1));top:50%;transform:translateY(-50%);width:calc(18px * var(--scalar, 1));height:calc(18px * var(--scalar, 1));background-color:currentColor;-webkit-mask-image:url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 24 24' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.46967 8.46967C5.76256 8.17678 6.23744 8.17678 6.53033 8.46967L12 13.9393L17.4697 8.46967C17.7626 8.17678 18.2374 8.17678 18.5303 8.46967C18.8232 8.76256 18.8232 9.23744 18.5303 9.53033L12.5303 15.5303C12.2374 15.8232 11.7626 15.8232 11.4697 15.5303L5.46967 9.53033C5.17678 9.23744 5.17678 8.76256 5.46967 8.46967Z'%3E%3C/path%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 24 24' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.46967 8.46967C5.76256 8.17678 6.23744 8.17678 6.53033 8.46967L12 13.9393L17.4697 8.46967C17.7626 8.17678 18.2374 8.17678 18.5303 8.46967C18.8232 8.76256 18.8232 9.23744 18.5303 9.53033L12.5303 15.5303C12.2374 15.8232 11.7626 15.8232 11.4697 15.5303L5.46967 9.53033C5.17678 9.23744 5.17678 8.76256 5.46967 8.46967Z'%3E%3C/path%3E%3C/svg%3E");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;pointer-events:none}._select_aabe288:hover{color:var(--accent-color);border-color:var(--accent-color);background-color:transparent}._selectedLabel_b92ff3e{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start}}
|
package/dist/select_group.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._select-group_c24986f{--button-background: var(--surface-color, transparent);border-radius:4px}._select-group-option_28f4dfd{background-color:var(--button-background);z-index:1}._select-group-divider_b5b865b{display:none}._select-group-option_28f4dfd:not(:first-child){margin-left:-1px}._select-group-option_28f4dfd:is(:focus,:focus-visible,:hover,:active){z-index:2}._select-group-option_28f4dfd:not(:first-child)
|
|
1
|
+
@layer tcn-system{:where(._select-group_c24986f){--button-background: var(--surface-color, transparent);border-radius:4px}:where(._select-group-option_28f4dfd){background-color:var(--button-background);z-index:1}:where(._select-group-divider_b5b865b){display:none}:where(._select-group-option_28f4dfd:not(:first-child)){margin-left:-1px}:where(._select-group-option_28f4dfd:is(:focus,:focus-visible,:hover,:active)){z-index:2}:where(._select-group-option_28f4dfd:not(:first-child)),:where(._select-group-option_28f4dfd:not(:last-child)){border-radius:0}:where(._select-group-option_28f4dfd:last-child){border-end-end-radius:4px;border-start-end-radius:4px}:where(._select-group-option_28f4dfd:first-child){border-start-start-radius:4px;border-end-start-radius:4px}:where(._select-group-option_28f4dfd:last-child){border-inline-start-width:0}:where(._select-group-option_28f4dfd:first-child){border-inline-end-width:0}:where(._select-group-option_28f4dfd:only-child){border-inline-end-width:1px;border-inline-start-width:1px}:where(._select-group_c24986f[data-size=sm]){--button-height: calc(22px * var(--scalar, 1))}:where(._select-group_c24986f[data-size=md]){--button-height: calc(26px * var(--scalar, 1))}:where(._select-group_c24986f[data-size=lg]){--button-height: calc(32px * var(--scalar, 1))}:where(._select-group-option_28f4dfd[data-is-disabled=true]){z-index:0}}
|
package/dist/sidebar_end.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._sidebarEndBox_25f69cc{width:250px;height:100%;z-index:2}._sidebarEnd_cb253a2{width:100%;height:100%}._sidebarEnd_cb253a2[data-hierarchy=primary]{background:#fff;border-left:1px solid #e0e0e0;padding:16px}._sidebarEnd_cb253a2[data-hierarchy=secondary]{background:#f8f9fa;border-left:1px solid #e9ecef;padding:12px}._sidebarEnd_cb253a2[data-hierarchy=tertiary]{background:#f1f3f4;border-left:1px solid #dee2e6;padding:8px}
|
|
1
|
+
@layer tcn-system{:where(._sidebarEndBox_25f69cc){width:250px;height:100%;z-index:2}:where(._sidebarEnd_cb253a2){width:100%;height:100%}:where(._sidebarEnd_cb253a2[data-hierarchy=primary]){background:#fff;border-left:1px solid #e0e0e0;padding:16px}:where(._sidebarEnd_cb253a2[data-hierarchy=secondary]){background:#f8f9fa;border-left:1px solid #e9ecef;padding:12px}:where(._sidebarEnd_cb253a2[data-hierarchy=tertiary]){background:#f1f3f4;border-left:1px solid #dee2e6;padding:8px}}
|
package/dist/sidebar_start.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._sidebarStartBox_4353011{width:250px;height:100%;z-index:2}._sidebarStart_5b1e45b{width:100%;height:100%}._sidebarStart_5b1e45b[data-hierarchy=primary]{background:#fff;border-right:1px solid #e0e0e0;padding:16px}._sidebarStart_5b1e45b[data-hierarchy=secondary]{background:#f8f9fa;border-right:1px solid #e9ecef;padding:12px}._sidebarStart_5b1e45b[data-hierarchy=tertiary]{background:#f1f3f4;border-right:1px solid #dee2e6;padding:8px}
|
|
1
|
+
@layer tcn-system{:where(._sidebarStartBox_4353011){width:250px;height:100%;z-index:2}:where(._sidebarStart_5b1e45b){width:100%;height:100%}:where(._sidebarStart_5b1e45b[data-hierarchy=primary]){background:#fff;border-right:1px solid #e0e0e0;padding:16px}:where(._sidebarStart_5b1e45b[data-hierarchy=secondary]){background:#f8f9fa;border-right:1px solid #e9ecef;padding:12px}:where(._sidebarStart_5b1e45b[data-hierarchy=tertiary]){background:#f1f3f4;border-right:1px solid #dee2e6;padding:8px}}
|
package/dist/slider.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--disabled: #d3d3d3}._slider_eb84151{width:100%;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;height:calc(26px * var(--scalar, 1))}._slider_eb84151:focus{outline:none}._slider_eb84151::-webkit-slider-runnable-track{border-radius:4px;height:calc(1px * var(--scalar, 1))}._slider_eb84151:dir(ltr)::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)::-webkit-slider-runnable-track{background:linear-gradient(to left,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)[data-is-disabled=true]::-webkit-slider-runnable-track,._slider_eb84151:dir(ltr)[data-is-disabled=true]::-webkit-slider-runnable-track{background:var(--disabled);cursor:not-allowed}._slider_eb84151::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;cursor:ew-resize;position:relative;top:calc(-6px * var(--scalar, 1));width:calc(14px * var(--scalar, 1));height:calc(14px * var(--scalar, 1));border-radius:2px;background-color:var(--surface, #fff);border:1px solid var(--accent-color);box-sizing:border-box}._slider_eb84151[data-is-disabled=true]::-webkit-slider-thumb{border-color:#e3e3e3;cursor:not-allowed}._slider_eb84151:focus-visible::-webkit-slider-thumb{box-shadow:0 0 4px var(--accent-color);outline:3px solid color-mix(in srgb,var(--accent-color) 40%,transparent);outline-offset:1px}._slider_eb84151[data-is-disabled=false]:active::-webkit-slider-thumb{background:color-mix(in srgb,var(--accent-color) 10%,white)}._slider_eb84151::-moz-range-track{border-radius:4px;height:calc(1px * var(--scalar, 1))}._slider_eb84151:dir(ltr)::-moz-range-track{background:linear-gradient(to right,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)::-moz-range-track{background:linear-gradient(to left,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151[data-is-disabled=true]::-moz-range-track{background:var(--disabled);cursor:not-allowed}._slider_eb84151::-moz-range-thumb{cursor:ew-resize;border:none;top:calc(-6px * var(--scalar, 1));width:calc(14px * var(--scalar, 1));height:calc(14px * var(--scalar, 1));border-radius:2px;background-color:var(--surface, #fff);border:1px solid var(--accent-color);box-sizing:border-box}._slider_eb84151[data-is-disabled=true]::-moz-range-thumb{border-color:#e3e3e3;cursor:not-allowed}._slider_eb84151:focus::-moz-range-thumb{box-shadow:0 0 4px var(--accent-color);outline:1px dashed var(--accent-color);outline-offset:1px}._slider_eb84151[data-is-disabled=false]:active::-moz-range-thumb{background:color-mix(in srgb,var(--accent-color) 10%,white)}
|
|
1
|
+
@layer tcn-system{:root{--disabled: #d3d3d3}:where(._slider_eb84151){width:100%;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;height:calc(26px * var(--scalar, 1))}:where(._slider_eb84151:focus){outline:none}._slider_eb84151::-webkit-slider-runnable-track{border-radius:4px;height:calc(1px * var(--scalar, 1))}._slider_eb84151:dir(ltr)::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)::-webkit-slider-runnable-track{background:linear-gradient(to left,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)[data-is-disabled=true]::-webkit-slider-runnable-track,._slider_eb84151:dir(ltr)[data-is-disabled=true]::-webkit-slider-runnable-track{background:var(--disabled);cursor:not-allowed}._slider_eb84151::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;cursor:ew-resize;position:relative;top:calc(-6px * var(--scalar, 1));width:calc(14px * var(--scalar, 1));height:calc(14px * var(--scalar, 1));border-radius:2px;background-color:var(--surface, #fff);border:1px solid var(--accent-color);box-sizing:border-box}._slider_eb84151[data-is-disabled=true]::-webkit-slider-thumb{border-color:#e3e3e3;cursor:not-allowed}._slider_eb84151:focus-visible::-webkit-slider-thumb{box-shadow:0 0 4px var(--accent-color);outline:3px solid color-mix(in srgb,var(--accent-color) 40%,transparent);outline-offset:1px}._slider_eb84151[data-is-disabled=false]:active::-webkit-slider-thumb{background:color-mix(in srgb,var(--accent-color) 10%,white)}._slider_eb84151::-moz-range-track{border-radius:4px;height:calc(1px * var(--scalar, 1))}._slider_eb84151:dir(ltr)::-moz-range-track{background:linear-gradient(to right,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)::-moz-range-track{background:linear-gradient(to left,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151[data-is-disabled=true]::-moz-range-track{background:var(--disabled);cursor:not-allowed}._slider_eb84151::-moz-range-thumb{cursor:ew-resize;border:none;top:calc(-6px * var(--scalar, 1));width:calc(14px * var(--scalar, 1));height:calc(14px * var(--scalar, 1));border-radius:2px;background-color:var(--surface, #fff);border:1px solid var(--accent-color);box-sizing:border-box}._slider_eb84151[data-is-disabled=true]::-moz-range-thumb{border-color:#e3e3e3;cursor:not-allowed}._slider_eb84151:focus::-moz-range-thumb{box-shadow:0 0 4px var(--accent-color);outline:1px dashed var(--accent-color);outline-offset:1px}._slider_eb84151[data-is-disabled=false]:active::-moz-range-thumb{background:color-mix(in srgb,var(--accent-color) 10%,white)}}
|
package/dist/slim_button.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._slim-button_188fdc3{min-height:auto}._slim-button_188fdc3[data-is-disabled=true]{pointer-events:none}
|
|
1
|
+
@layer tcn-system{:where(._slim-button_188fdc3){min-height:auto}:where(._slim-button_188fdc3[data-is-disabled=true]){pointer-events:none}}
|