@pathscale/ui 2.1.1 → 2.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/components/accordion/Accordion.css +3 -3
- package/dist/components/accordion/Accordion.generated.d.ts +8 -8
- package/dist/components/accordion/Accordion.generated.js +9 -14
- package/dist/components/address/Address.css +66 -0
- package/dist/components/address/Address.generated.d.ts +35 -0
- package/dist/components/address/Address.generated.js +106 -0
- package/dist/components/address/Address.interactions.d.ts +48 -0
- package/dist/components/address/Address.interactions.js +25 -0
- package/dist/components/address/Address.recipe.d.ts +60 -0
- package/dist/components/address/Address.recipe.js +101 -0
- package/dist/components/address/index.d.ts +5 -0
- package/dist/components/address/index.js +3 -0
- package/dist/components/alert/Alert.css +125 -72
- package/dist/components/alert/Alert.generated.d.ts +12 -30
- package/dist/components/alert/Alert.generated.js +95 -191
- package/dist/components/alert/Alert.recipe.d.ts +57 -24
- package/dist/components/alert/Alert.recipe.js +90 -49
- package/dist/components/alert/index.d.ts +3 -1
- package/dist/components/alert/index.js +2 -1
- package/dist/components/auth-card/AuthCard.css +44 -0
- package/dist/components/auth-card/AuthCard.generated.d.ts +12 -0
- package/dist/components/auth-card/{AuthCard.js → AuthCard.generated.js} +33 -46
- package/dist/components/auth-card/AuthCard.recipe.d.ts +30 -0
- package/dist/components/auth-card/AuthCard.recipe.js +79 -0
- package/dist/components/auth-card/index.d.ts +2 -1
- package/dist/components/auth-card/index.js +1 -1
- package/dist/components/auth-field-group/AuthFieldGroup.css +19 -0
- package/dist/components/auth-field-group/AuthFieldGroup.generated.d.ts +10 -0
- package/dist/components/auth-field-group/AuthFieldGroup.generated.js +17 -0
- package/dist/components/auth-field-group/AuthFieldGroup.recipe.d.ts +19 -0
- package/dist/components/auth-field-group/AuthFieldGroup.recipe.js +39 -0
- package/dist/components/auth-field-group/index.d.ts +2 -1
- package/dist/components/auth-field-group/index.js +1 -1
- package/dist/components/auth-footer-links/AuthFooterLinks.css +53 -0
- package/dist/components/auth-footer-links/AuthFooterLinks.generated.d.ts +17 -0
- package/dist/components/auth-footer-links/AuthFooterLinks.generated.js +58 -0
- package/dist/components/auth-footer-links/AuthFooterLinks.recipe.d.ts +22 -0
- package/dist/components/auth-footer-links/AuthFooterLinks.recipe.js +47 -0
- package/dist/components/auth-footer-links/index.d.ts +2 -1
- package/dist/components/auth-footer-links/index.js +1 -1
- package/dist/components/auth-message/AuthMessage.css +6 -0
- package/dist/components/auth-message/AuthMessage.generated.d.ts +9 -0
- package/dist/components/auth-message/AuthMessage.generated.js +27 -0
- package/dist/components/auth-message/AuthMessage.recipe.d.ts +9 -0
- package/dist/components/auth-message/AuthMessage.recipe.js +23 -0
- package/dist/components/auth-message/index.d.ts +2 -0
- package/dist/components/auth-message/index.js +1 -0
- package/dist/components/auth-powered-by/AuthPoweredBy.css +61 -0
- package/dist/components/auth-powered-by/AuthPoweredBy.generated.d.ts +14 -0
- package/dist/components/auth-powered-by/AuthPoweredBy.generated.js +41 -0
- package/dist/components/auth-powered-by/AuthPoweredBy.recipe.d.ts +34 -0
- package/dist/components/auth-powered-by/AuthPoweredBy.recipe.js +74 -0
- package/dist/components/auth-powered-by/index.d.ts +2 -1
- package/dist/components/auth-powered-by/index.js +1 -1
- package/dist/components/auth-submit-button/AuthSubmitButton.css +5 -0
- package/dist/components/auth-submit-button/AuthSubmitButton.generated.d.ts +14 -0
- package/dist/components/auth-submit-button/AuthSubmitButton.generated.js +34 -0
- package/dist/components/auth-submit-button/AuthSubmitButton.recipe.d.ts +9 -0
- package/dist/components/auth-submit-button/AuthSubmitButton.recipe.js +23 -0
- package/dist/components/auth-submit-button/index.d.ts +2 -1
- package/dist/components/auth-submit-button/index.js +1 -1
- package/dist/components/avatar/Avatar.css +33 -16
- package/dist/components/avatar/Avatar.generated.d.ts +5 -6
- package/dist/components/avatar/Avatar.generated.js +6 -9
- package/dist/components/avatar/Avatar.recipe.d.ts +9 -6
- package/dist/components/avatar/Avatar.recipe.js +9 -6
- package/dist/components/avatar/AvatarGroup.generated.d.ts +2 -3
- package/dist/components/avatar/AvatarGroup.generated.js +1 -2
- package/dist/components/avatar/index.d.ts +1 -1
- package/dist/components/badge/Badge.css +81 -69
- package/dist/components/badge/Badge.generated.d.ts +4 -4
- package/dist/components/badge/Badge.generated.js +8 -4
- package/dist/components/badge/Badge.recipe.d.ts +20 -9
- package/dist/components/badge/Badge.recipe.js +20 -9
- package/dist/components/{breadcrumbs/Breadcrumbs.css → breadcrumb/Breadcrumb.css} +10 -10
- package/dist/components/breadcrumb/Breadcrumb.generated.d.ts +21 -0
- package/dist/components/{breadcrumbs/Breadcrumbs.generated.js → breadcrumb/Breadcrumb.generated.js} +29 -31
- package/dist/components/breadcrumb/Breadcrumb.recipe.d.ts +18 -0
- package/dist/components/{breadcrumbs/Breadcrumbs.recipe.js → breadcrumb/Breadcrumb.recipe.js} +17 -17
- package/dist/components/breadcrumb/index.d.ts +1 -0
- package/dist/components/breadcrumb/index.js +1 -0
- package/dist/components/button/Button.css +218 -81
- package/dist/components/button/Button.generated.d.ts +12 -16
- package/dist/components/button/Button.generated.js +31 -61
- package/dist/components/button/Button.recipe.d.ts +80 -33
- package/dist/components/button/Button.recipe.js +131 -52
- package/dist/components/button/index.d.ts +3 -2
- package/dist/components/button/index.js +2 -1
- package/dist/components/button-group/ButtonGroup.generated.d.ts +6 -7
- package/dist/components/button-group/ButtonGroup.generated.js +5 -7
- package/dist/components/button-group/context.d.ts +3 -3
- package/dist/components/calendar/Calendar.css +8 -8
- package/dist/components/calendar/Calendar.generated.d.ts +3 -3
- package/dist/components/calendar/Calendar.generated.js +3 -4
- package/dist/components/card/Card.css +170 -64
- package/dist/components/card/Card.generated.d.ts +22 -25
- package/dist/components/card/Card.generated.js +71 -144
- package/dist/components/card/Card.recipe.d.ts +110 -24
- package/dist/components/card/Card.recipe.js +171 -46
- package/dist/components/card/index.d.ts +16 -1
- package/dist/components/card/index.js +11 -1
- package/dist/components/chatbubble/ChatBubble.css +12 -12
- package/dist/components/chatbubble/ChatBubble.generated.d.ts +2 -2
- package/dist/components/chatbubble/ChatBubble.generated.js +1 -2
- package/dist/components/chatbubble/ChatBubble.recipe.d.ts +9 -9
- package/dist/components/chatbubble/ChatBubble.recipe.js +9 -9
- package/dist/components/chatbubble/ChatBubbleAvatar.generated.d.ts +2 -2
- package/dist/components/chatbubble/ChatBubbleAvatar.generated.js +3 -3
- package/dist/components/chatbubble/ChatBubbleFooter.generated.d.ts +2 -2
- package/dist/components/chatbubble/ChatBubbleFooter.generated.js +2 -3
- package/dist/components/chatbubble/ChatBubbleHeader.generated.d.ts +2 -2
- package/dist/components/chatbubble/ChatBubbleHeader.generated.js +2 -3
- package/dist/components/chatbubble/ChatBubbleMessage.generated.d.ts +3 -3
- package/dist/components/chatbubble/ChatBubbleMessage.generated.js +6 -6
- package/dist/components/chatbubble/ChatBubbleTime.generated.d.ts +2 -2
- package/dist/components/chatbubble/ChatBubbleTime.generated.js +2 -3
- package/dist/components/checkbox/Checkbox.css +2 -2
- package/dist/components/checkbox/Checkbox.generated.d.ts +4 -4
- package/dist/components/checkbox/Checkbox.generated.js +6 -6
- package/dist/components/checkbox-group/CheckboxGroup.generated.d.ts +4 -4
- package/dist/components/checkbox-group/CheckboxGroup.generated.js +6 -6
- package/dist/components/chip/Chip.css +76 -52
- package/dist/components/chip/Chip.generated.d.ts +3 -3
- package/dist/components/chip/Chip.generated.js +6 -7
- package/dist/components/chip/Chip.recipe.d.ts +9 -7
- package/dist/components/chip/Chip.recipe.js +9 -7
- package/dist/components/close-button/CloseButton.css +2 -2
- package/dist/components/close-button/CloseButton.generated.d.ts +3 -4
- package/dist/components/close-button/CloseButton.generated.js +3 -4
- package/dist/components/{disclosure/Disclosure.css → collapsible/Collapsible.css} +18 -18
- package/dist/components/collapsible/Collapsible.generated.d.ts +46 -0
- package/dist/components/{disclosure/Disclosure.generated.js → collapsible/Collapsible.generated.js} +59 -86
- package/dist/components/collapsible/Collapsible.recipe.d.ts +28 -0
- package/dist/components/collapsible/Collapsible.recipe.js +77 -0
- package/dist/components/collapsible/index.d.ts +11 -0
- package/dist/components/collapsible/index.js +4 -0
- package/dist/components/color-area/ColorArea.css +5 -5
- package/dist/components/color-area/ColorArea.generated.d.ts +3 -3
- package/dist/components/color-area/ColorArea.generated.js +3 -4
- package/dist/components/color-field/ColorField.css +1 -1
- package/dist/components/color-field/ColorField.generated.d.ts +3 -3
- package/dist/components/color-field/ColorField.generated.js +3 -4
- package/dist/components/color-picker/ColorPicker.generated.d.ts +3 -3
- package/dist/components/color-picker/ColorPicker.generated.js +16 -20
- package/dist/components/color-slider/ColorSlider.css +5 -5
- package/dist/components/color-slider/ColorSlider.generated.d.ts +3 -3
- package/dist/components/color-slider/ColorSlider.generated.js +3 -4
- package/dist/components/color-swatch/ColorSwatch.css +5 -5
- package/dist/components/color-swatch/ColorSwatch.generated.d.ts +3 -3
- package/dist/components/color-swatch/ColorSwatch.generated.js +3 -4
- package/dist/components/color-swatch-picker/ColorSwatchPicker.generated.d.ts +3 -3
- package/dist/components/color-swatch-picker/ColorSwatchPicker.generated.js +3 -4
- package/dist/components/color-wheel-flower/ColorWheelFlower.css +11 -11
- package/dist/components/color-wheel-flower/ColorWheelFlower.generated.d.ts +0 -1
- package/dist/components/color-wheel-flower/ColorWheelFlower.generated.js +5 -6
- package/dist/components/combo-box/ComboBox.css +5 -5
- package/dist/components/combo-box/ComboBox.generated.d.ts +11 -12
- package/dist/components/combo-box/ComboBox.generated.js +17 -23
- package/dist/components/composer/Composer.css +109 -0
- package/dist/components/composer/Composer.generated.d.ts +46 -0
- package/dist/components/composer/Composer.generated.js +153 -0
- package/dist/components/composer/Composer.interactions.d.ts +93 -0
- package/dist/components/composer/Composer.interactions.js +42 -0
- package/dist/components/composer/Composer.recipe.d.ts +80 -0
- package/dist/components/composer/Composer.recipe.js +146 -0
- package/dist/components/composer/index.d.ts +5 -0
- package/dist/components/composer/index.js +3 -0
- package/dist/components/date-field/DateField.generated.d.ts +12 -13
- package/dist/components/date-field/DateField.generated.js +15 -22
- package/dist/components/date-picker/DatePicker.css +1 -1
- package/dist/components/date-picker/DatePicker.generated.d.ts +4 -4
- package/dist/components/date-picker/DatePicker.generated.js +7 -8
- package/dist/components/date-range-picker/DateRangePicker.css +1 -1
- package/dist/components/date-range-picker/DateRangePicker.generated.d.ts +4 -4
- package/dist/components/date-range-picker/DateRangePicker.generated.js +7 -8
- package/dist/components/{modal/Modal.css → dialog/Dialog.css} +73 -73
- package/dist/components/dialog/Dialog.generated.d.ts +84 -0
- package/dist/components/{modal/Modal.generated.js → dialog/Dialog.generated.js} +81 -91
- package/dist/components/dialog/Dialog.recipe.d.ts +104 -0
- package/dist/components/dialog/Dialog.recipe.js +178 -0
- package/dist/components/dialog/index.d.ts +1 -0
- package/dist/components/dialog/index.js +1 -0
- package/dist/components/{floating-dock/FloatingDock.css → dock/Dock.css} +32 -32
- package/dist/components/{floating-dock/FloatingDock.generated.d.ts → dock/Dock.generated.d.ts} +11 -11
- package/dist/components/{floating-dock/FloatingDock.generated.js → dock/Dock.generated.js} +17 -18
- package/dist/components/dock/Dock.recipe.d.ts +31 -0
- package/dist/components/dock/Dock.recipe.js +45 -0
- package/dist/components/dock/index.d.ts +2 -0
- package/dist/components/dock/index.js +1 -0
- package/dist/components/drawer/Drawer.a11y.d.ts +1 -1
- package/dist/components/drawer/Drawer.css +9 -9
- package/dist/components/drawer/Drawer.generated.d.ts +13 -13
- package/dist/components/drawer/Drawer.generated.js +15 -26
- package/dist/components/dropdown/Dropdown.css +8 -8
- package/dist/components/dropdown/Dropdown.generated.d.ts +0 -1
- package/dist/components/dropdown/Dropdown.generated.js +1 -2
- package/dist/components/{empty-state/EmptyState.css → empty/Empty.css} +5 -5
- package/dist/components/empty/Empty.generated.d.ts +33 -0
- package/dist/components/{empty-state/EmptyState.generated.js → empty/Empty.generated.js} +36 -41
- package/dist/components/empty/Empty.recipe.d.ts +20 -0
- package/dist/components/{empty-state/EmptyState.recipe.js → empty/Empty.recipe.js} +21 -21
- package/dist/components/empty/index.d.ts +3 -0
- package/dist/components/empty/index.js +1 -0
- package/dist/components/fieldset/Fieldset.generated.d.ts +5 -5
- package/dist/components/fieldset/Fieldset.generated.js +4 -8
- package/dist/components/flex/Flex.generated.d.ts +2 -2
- package/dist/components/flex/Flex.generated.js +1 -2
- package/dist/components/footer/Footer.generated.d.ts +2 -2
- package/dist/components/footer/Footer.generated.js +1 -2
- package/dist/components/footer/FooterTitle.generated.d.ts +2 -2
- package/dist/components/footer/FooterTitle.generated.js +1 -2
- package/dist/components/form/FieldErrorMessage.generated.d.ts +0 -1
- package/dist/components/form/FieldErrorMessage.generated.js +1 -1
- package/dist/components/form/Form.generated.d.ts +3 -3
- package/dist/components/form/Form.generated.js +2 -4
- package/dist/components/form/FormField.generated.d.ts +0 -1
- package/dist/components/form/FormField.generated.js +9 -5
- package/dist/components/form/FormSubmitButton.generated.d.ts +1 -1
- package/dist/components/form/FormSubmitButton.generated.js +3 -6
- package/dist/components/glow-card/GlowCard.css +1 -1
- package/dist/components/glow-card/GlowCard.generated.d.ts +2 -2
- package/dist/components/glow-card/GlowCard.generated.js +1 -2
- package/dist/components/grid/Grid.generated.d.ts +2 -2
- package/dist/components/grid/Grid.generated.js +1 -2
- package/dist/components/header/Header.generated.d.ts +2 -2
- package/dist/components/header/Header.generated.js +1 -2
- package/dist/components/icon/Icon.css +37 -1
- package/dist/components/icon/Icon.generated.d.ts +17 -7
- package/dist/components/icon/Icon.generated.js +40 -22
- package/dist/components/icon/Icon.interactions.d.ts +8 -0
- package/dist/components/icon/Icon.interactions.js +10 -0
- package/dist/components/icon/Icon.recipe.d.ts +27 -6
- package/dist/components/icon/Icon.recipe.js +36 -8
- package/dist/components/icon/index.d.ts +2 -1
- package/dist/components/icon/index.js +2 -1
- package/dist/components/immersive-landing/ImmersiveLanding.css +12 -12
- package/dist/components/immersive-landing/ImmersiveLanding.generated.js +1 -2
- package/dist/components/immersive-landing/ImmersiveLandingArrows.generated.js +3 -4
- package/dist/components/immersive-landing/ImmersiveLandingNavigation.generated.js +1 -2
- package/dist/components/immersive-landing/ImmersiveLandingPage.generated.js +1 -2
- package/dist/components/immersive-landing/components/CookieConsent.js +3 -3
- package/dist/components/immersive-landing/components/FirefoxPWABanner.js +5 -5
- package/dist/components/immersive-landing/components/PWAInstallPrompt.js +3 -3
- package/dist/components/immersive-landing/types.d.ts +5 -5
- package/dist/components/input/Input.css +1 -1
- package/dist/components/input/Input.generated.d.ts +6 -10
- package/dist/components/input/Input.generated.js +25 -32
- package/dist/components/input-otp/InputOTP.generated.d.ts +7 -7
- package/dist/components/input-otp/InputOTP.generated.js +9 -12
- package/dist/components/join/Join.generated.d.ts +2 -2
- package/dist/components/join/Join.generated.js +1 -2
- package/dist/components/kbd/Kbd.css +2 -2
- package/dist/components/kbd/Kbd.generated.d.ts +4 -4
- package/dist/components/kbd/Kbd.generated.js +3 -6
- package/dist/components/label/Label.generated.d.ts +5 -5
- package/dist/components/label/Label.generated.js +10 -10
- package/dist/components/language-switcher/LanguageSwitcher.css +3 -3
- package/dist/components/language-switcher/LanguageSwitcher.generated.d.ts +2 -2
- package/dist/components/language-switcher/LanguageSwitcher.generated.js +2 -3
- package/dist/components/link/Link.css +2 -2
- package/dist/components/link/Link.generated.d.ts +4 -4
- package/dist/components/link/Link.generated.js +4 -6
- package/dist/components/list-box/ListBox.css +2 -2
- package/dist/components/list-box/ListBox.generated.d.ts +4 -4
- package/dist/components/list-box/ListBox.generated.js +5 -6
- package/dist/components/list-box/ListBoxItem.generated.d.ts +4 -4
- package/dist/components/list-box/ListBoxItem.generated.js +5 -7
- package/dist/components/list-box/ListBoxSection.generated.d.ts +2 -2
- package/dist/components/list-box/ListBoxSection.generated.js +1 -2
- package/dist/components/live-chat/LiveChat.css +8 -8
- package/dist/components/live-chat/LiveChatBubble.generated.d.ts +2 -2
- package/dist/components/live-chat/LiveChatBubble.generated.js +1 -2
- package/dist/components/live-chat/LiveChatPanel.generated.d.ts +2 -2
- package/dist/components/live-chat/LiveChatPanel.generated.js +5 -6
- package/dist/components/menu/Menu.css +2 -2
- package/dist/components/menu/Menu.generated.d.ts +4 -4
- package/dist/components/menu/Menu.generated.js +5 -6
- package/dist/components/menu/MenuItem.generated.d.ts +5 -5
- package/dist/components/menu/MenuItem.generated.js +6 -9
- package/dist/components/menu/MenuSection.generated.d.ts +2 -2
- package/dist/components/menu/MenuSection.generated.js +1 -2
- package/dist/components/metal-border/MetalBorder.generated.d.ts +2 -2
- package/dist/components/metal-border/MetalBorder.generated.js +1 -2
- package/dist/components/meter/Meter.css +34 -18
- package/dist/components/meter/Meter.generated.d.ts +7 -7
- package/dist/components/meter/Meter.generated.js +9 -13
- package/dist/components/meter/Meter.recipe.d.ts +9 -6
- package/dist/components/meter/Meter.recipe.js +9 -6
- package/dist/components/navbar/Navbar.css +13 -13
- package/dist/components/navbar/Navbar.generated.d.ts +2 -3
- package/dist/components/navbar/Navbar.generated.js +1 -2
- package/dist/components/navbar/Navbar.recipe.d.ts +12 -9
- package/dist/components/navbar/Navbar.recipe.js +13 -10
- package/dist/components/navbar/NavbarRow.generated.d.ts +5 -3
- package/dist/components/navbar/NavbarRow.generated.js +4 -4
- package/dist/components/navbar/NavbarSection.generated.d.ts +0 -1
- package/dist/components/navbar/NavbarSection.generated.js +1 -2
- package/dist/components/navbar/NavbarStack.generated.d.ts +2 -3
- package/dist/components/navbar/NavbarStack.generated.js +1 -2
- package/dist/components/noise-background/NoiseBackground.generated.d.ts +2 -2
- package/dist/components/noise-background/NoiseBackground.generated.js +1 -2
- package/dist/components/pagination/Pagination.css +1 -1
- package/dist/components/pagination/Pagination.generated.d.ts +3 -3
- package/dist/components/pagination/Pagination.generated.js +3 -4
- package/dist/components/password-field/PasswordField.css +12 -0
- package/dist/components/password-field/PasswordField.generated.d.ts +29 -0
- package/dist/components/password-field/PasswordField.generated.js +95 -0
- package/dist/components/password-field/{PasswordField.d.ts → PasswordField.interactions.d.ts} +40 -38
- package/dist/components/password-field/PasswordField.interactions.js +48 -0
- package/dist/components/password-field/PasswordField.recipe.d.ts +12 -0
- package/dist/components/password-field/PasswordField.recipe.js +31 -0
- package/dist/components/password-field/index.d.ts +3 -1
- package/dist/components/password-field/index.js +2 -1
- package/dist/components/password-requirements/PasswordRequirements.css +42 -0
- package/dist/components/password-requirements/PasswordRequirements.generated.d.ts +12 -0
- package/dist/components/password-requirements/PasswordRequirements.generated.js +69 -0
- package/dist/components/password-requirements/PasswordRequirements.recipe.d.ts +24 -0
- package/dist/components/password-requirements/PasswordRequirements.recipe.js +63 -0
- package/dist/components/password-requirements/index.d.ts +2 -1
- package/dist/components/password-requirements/index.js +1 -1
- package/dist/components/popover/Popover.css +3 -3
- package/dist/components/popover/Popover.generated.d.ts +8 -8
- package/dist/components/popover/Popover.generated.js +9 -15
- package/dist/components/progress/Progress.css +121 -0
- package/dist/components/progress/Progress.generated.d.ts +20 -0
- package/dist/components/{progress-bar/ProgressBar.generated.js → progress/Progress.generated.js} +12 -13
- package/dist/components/progress/Progress.recipe.d.ts +32 -0
- package/dist/components/progress/Progress.recipe.js +46 -0
- package/dist/components/progress/index.d.ts +2 -0
- package/dist/components/progress/index.js +1 -0
- package/dist/components/radial-progress/RadialProgress.css +99 -0
- package/dist/components/radial-progress/RadialProgress.generated.d.ts +19 -0
- package/dist/components/{progress-circle/ProgressCircle.generated.js → radial-progress/RadialProgress.generated.js} +12 -13
- package/dist/components/radial-progress/RadialProgress.recipe.d.ts +31 -0
- package/dist/components/radial-progress/RadialProgress.recipe.js +45 -0
- package/dist/components/radial-progress/index.d.ts +2 -0
- package/dist/components/radial-progress/index.js +1 -0
- package/dist/components/radio/Radio.css +3 -3
- package/dist/components/radio/Radio.generated.d.ts +4 -4
- package/dist/components/radio/Radio.generated.js +6 -6
- package/dist/components/radio-group/RadioGroup.generated.d.ts +4 -4
- package/dist/components/radio-group/RadioGroup.generated.js +6 -6
- package/dist/components/range-calendar/RangeCalendar.css +1 -1
- package/dist/components/range-calendar/RangeCalendar.generated.d.ts +3 -3
- package/dist/components/range-calendar/RangeCalendar.generated.js +5 -6
- package/dist/components/{scroll-shadow/ScrollShadow.css → scroll-area/ScrollArea.css} +20 -20
- package/dist/components/scroll-area/ScrollArea.generated.d.ts +19 -0
- package/dist/components/{scroll-shadow/ScrollShadow.generated.js → scroll-area/ScrollArea.generated.js} +15 -16
- package/dist/components/scroll-area/ScrollArea.recipe.d.ts +19 -0
- package/dist/components/{scroll-shadow/ScrollShadow.recipe.js → scroll-area/ScrollArea.recipe.js} +6 -6
- package/dist/components/scroll-area/index.d.ts +2 -0
- package/dist/components/scroll-area/index.js +1 -0
- package/dist/components/scroll-area/useScrollArea.d.ts +13 -0
- package/dist/components/{scroll-shadow/useScrollShadow.js → scroll-area/useScrollArea.js} +6 -6
- package/dist/components/select/Select.css +7 -7
- package/dist/components/select/Select.generated.d.ts +11 -11
- package/dist/components/select/Select.generated.js +16 -23
- package/dist/components/separator/Separator.generated.d.ts +2 -2
- package/dist/components/separator/Separator.generated.js +1 -2
- package/dist/components/size-picker/SizePicker.generated.d.ts +2 -2
- package/dist/components/size-picker/SizePicker.generated.js +5 -3
- package/dist/components/skeleton/Skeleton.css +71 -0
- package/dist/components/skeleton/Skeleton.generated.d.ts +13 -4
- package/dist/components/skeleton/Skeleton.generated.js +36 -6
- package/dist/components/skeleton/Skeleton.recipe.d.ts +39 -10
- package/dist/components/skeleton/Skeleton.recipe.js +88 -12
- package/dist/components/skeleton/index.d.ts +3 -2
- package/dist/components/skeleton/index.js +2 -1
- package/dist/components/slider/Slider.css +8 -8
- package/dist/components/slider/Slider.generated.d.ts +2 -3
- package/dist/components/slider/Slider.generated.js +1 -2
- package/dist/components/spinner/Spinner.generated.d.ts +6 -8
- package/dist/components/spinner/Spinner.generated.js +4 -4
- package/dist/components/spinner/Spinner.recipe.d.ts +15 -31
- package/dist/components/spinner/Spinner.recipe.js +67 -32
- package/dist/components/spinner/index.d.ts +3 -2
- package/dist/components/spinner/index.js +2 -1
- package/dist/components/status/index.d.ts +3 -0
- package/dist/components/status/index.js +1 -0
- package/dist/components/status/status.d.ts +167 -0
- package/dist/components/status/status.js +101 -0
- package/dist/components/{toggle/Toggle.css → switch/Switch.css} +83 -63
- package/dist/components/{toggle/Toggle.generated.d.ts → switch/Switch.generated.d.ts} +7 -7
- package/dist/components/{toggle/Toggle.generated.js → switch/Switch.generated.js} +18 -19
- package/dist/components/switch/Switch.recipe.d.ts +43 -0
- package/dist/components/switch/Switch.recipe.js +97 -0
- package/dist/components/{toggle → switch}/index.d.ts +1 -1
- package/dist/components/switch/index.js +1 -0
- package/dist/components/table/ExpandToggle.generated.d.ts +2 -2
- package/dist/components/table/ExpandToggle.generated.js +3 -4
- package/dist/components/table/InlineConfirm.generated.d.ts +3 -3
- package/dist/components/table/InlineConfirm.generated.js +13 -18
- package/dist/components/table/MobileListView.generated.d.ts +2 -2
- package/dist/components/table/MobileListView.generated.js +6 -7
- package/dist/components/table/SortIcon.generated.d.ts +2 -2
- package/dist/components/table/SortIcon.generated.js +2 -3
- package/dist/components/table/Table.css +7 -7
- package/dist/components/table/Table.generated.d.ts +16 -16
- package/dist/components/table/Table.generated.js +15 -30
- package/dist/components/table/VirtualSpacerRow.generated.d.ts +2 -2
- package/dist/components/table/VirtualSpacerRow.generated.js +1 -2
- package/dist/components/tabs/Tabs.css +5 -5
- package/dist/components/tabs/Tabs.generated.d.ts +2 -1
- package/dist/components/tabs/Tabs.generated.js +2 -2
- package/dist/components/text/Text.generated.d.ts +2 -2
- package/dist/components/text/Text.generated.js +1 -2
- package/dist/components/textarea/Textarea.generated.d.ts +16 -7
- package/dist/components/textarea/Textarea.generated.js +47 -7
- package/dist/components/textarea/Textarea.recipe.d.ts +9 -1
- package/dist/components/textarea/Textarea.recipe.js +16 -3
- package/dist/components/textarea/index.d.ts +1 -2
- package/dist/components/textarea/index.js +1 -1
- package/dist/components/theme-color-picker/ThemeColorPicker.generated.d.ts +2 -2
- package/dist/components/theme-color-picker/ThemeColorPicker.generated.js +2 -3
- package/dist/components/time-field/TimeField.generated.d.ts +12 -13
- package/dist/components/time-field/TimeField.generated.js +15 -22
- package/dist/components/toast/Toast.css +4 -4
- package/dist/components/toast/Toast.generated.d.ts +10 -10
- package/dist/components/toast/Toast.generated.js +16 -24
- package/dist/components/toolbar/Toolbar.css +2 -2
- package/dist/components/toolbar/Toolbar.generated.d.ts +2 -2
- package/dist/components/toolbar/Toolbar.generated.js +1 -2
- package/dist/components/tooltip/Tooltip.css +4 -4
- package/dist/components/tooltip/Tooltip.generated.d.ts +6 -6
- package/dist/components/tooltip/Tooltip.generated.js +7 -11
- package/dist/components/types.d.ts +0 -7
- package/dist/components/video-preview/VideoPreview.generated.d.ts +2 -2
- package/dist/components/video-preview/VideoPreview.generated.js +1 -2
- package/dist/components/vocabulary.d.ts +267 -0
- package/dist/components/vocabulary.js +46 -0
- package/dist/index.css +0 -1
- package/dist/index.d.ts +53 -113
- package/dist/index.js +32 -67
- package/dist/lab.d.ts +44 -0
- package/dist/lab.js +24 -0
- package/dist/layouts.manifest.json +77 -218
- package/dist/purge-manifest.json +13075 -17765
- package/dist/styles/themes/dark.css +27 -0
- package/dist/styles/themes/light.css +29 -0
- package/package.json +13 -12
- package/dist/components/auth-card/AuthCard.d.ts +0 -12
- package/dist/components/auth-error-message/AuthErrorMessage.d.ts +0 -7
- package/dist/components/auth-error-message/AuthErrorMessage.js +0 -35
- package/dist/components/auth-error-message/index.d.ts +0 -1
- package/dist/components/auth-error-message/index.js +0 -1
- package/dist/components/auth-field-group/AuthFieldGroup.d.ts +0 -8
- package/dist/components/auth-field-group/AuthFieldGroup.js +0 -33
- package/dist/components/auth-footer-links/AuthFooterLinks.d.ts +0 -15
- package/dist/components/auth-footer-links/AuthFooterLinks.js +0 -74
- package/dist/components/auth-form/AuthForm.d.ts +0 -9
- package/dist/components/auth-form/AuthForm.js +0 -36
- package/dist/components/auth-form/index.d.ts +0 -1
- package/dist/components/auth-form/index.js +0 -1
- package/dist/components/auth-powered-by/AuthPoweredBy.d.ts +0 -11
- package/dist/components/auth-powered-by/AuthPoweredBy.js +0 -59
- package/dist/components/auth-submit-button/AuthSubmitButton.d.ts +0 -11
- package/dist/components/auth-submit-button/AuthSubmitButton.js +0 -51
- package/dist/components/auth-success-message/AuthSuccessMessage.d.ts +0 -7
- package/dist/components/auth-success-message/AuthSuccessMessage.js +0 -36
- package/dist/components/auth-success-message/index.d.ts +0 -1
- package/dist/components/auth-success-message/index.js +0 -1
- package/dist/components/breadcrumbs/Breadcrumbs.generated.d.ts +0 -21
- package/dist/components/breadcrumbs/Breadcrumbs.recipe.d.ts +0 -18
- package/dist/components/breadcrumbs/index.d.ts +0 -1
- package/dist/components/breadcrumbs/index.js +0 -1
- package/dist/components/description/Description.css +0 -10
- package/dist/components/description/Description.generated.d.ts +0 -12
- package/dist/components/description/Description.generated.js +0 -47
- package/dist/components/description/Description.recipe.d.ts +0 -10
- package/dist/components/description/Description.recipe.js +0 -29
- package/dist/components/description/index.d.ts +0 -1
- package/dist/components/description/index.js +0 -1
- package/dist/components/disclosure/Disclosure.generated.d.ts +0 -46
- package/dist/components/disclosure/Disclosure.recipe.d.ts +0 -28
- package/dist/components/disclosure/Disclosure.recipe.js +0 -77
- package/dist/components/disclosure/index.d.ts +0 -11
- package/dist/components/disclosure/index.js +0 -4
- package/dist/components/disclosure-group/DisclosureGroup.css +0 -9
- package/dist/components/disclosure-group/DisclosureGroup.generated.d.ts +0 -26
- package/dist/components/disclosure-group/DisclosureGroup.generated.js +0 -80
- package/dist/components/disclosure-group/DisclosureGroup.recipe.d.ts +0 -10
- package/dist/components/disclosure-group/DisclosureGroup.recipe.js +0 -29
- package/dist/components/disclosure-group/index.d.ts +0 -9
- package/dist/components/disclosure-group/index.js +0 -5
- package/dist/components/disclosure-group/useDisclosureGroupNavigation.d.ts +0 -14
- package/dist/components/disclosure-group/useDisclosureGroupNavigation.js +0 -54
- package/dist/components/empty-state/EmptyState.generated.d.ts +0 -33
- package/dist/components/empty-state/EmptyState.recipe.d.ts +0 -20
- package/dist/components/empty-state/index.d.ts +0 -3
- package/dist/components/empty-state/index.js +0 -1
- package/dist/components/error-message/ErrorMessage.css +0 -20
- package/dist/components/error-message/ErrorMessage.generated.d.ts +0 -12
- package/dist/components/error-message/ErrorMessage.generated.js +0 -47
- package/dist/components/error-message/ErrorMessage.recipe.d.ts +0 -10
- package/dist/components/error-message/ErrorMessage.recipe.js +0 -29
- package/dist/components/error-message/index.d.ts +0 -1
- package/dist/components/error-message/index.js +0 -1
- package/dist/components/field-error/FieldError.css +0 -27
- package/dist/components/field-error/FieldError.generated.d.ts +0 -22
- package/dist/components/field-error/FieldError.generated.js +0 -76
- package/dist/components/field-error/FieldError.recipe.d.ts +0 -10
- package/dist/components/field-error/FieldError.recipe.js +0 -29
- package/dist/components/field-error/index.d.ts +0 -1
- package/dist/components/field-error/index.js +0 -1
- package/dist/components/floating-dock/FloatingDock.recipe.d.ts +0 -31
- package/dist/components/floating-dock/FloatingDock.recipe.js +0 -45
- package/dist/components/floating-dock/index.d.ts +0 -2
- package/dist/components/floating-dock/index.js +0 -1
- package/dist/components/glass-panel/GlassPanel.css +0 -359
- package/dist/components/glass-panel/GlassPanel.generated.d.ts +0 -21
- package/dist/components/glass-panel/GlassPanel.generated.js +0 -116
- package/dist/components/glass-panel/GlassPanel.recipe.d.ts +0 -33
- package/dist/components/glass-panel/GlassPanel.recipe.js +0 -47
- package/dist/components/glass-panel/index.d.ts +0 -1
- package/dist/components/glass-panel/index.js +0 -1
- package/dist/components/input-group/InputGroup.css +0 -172
- package/dist/components/input-group/InputGroup.generated.d.ts +0 -45
- package/dist/components/input-group/InputGroup.generated.js +0 -246
- package/dist/components/input-group/InputGroup.recipe.d.ts +0 -32
- package/dist/components/input-group/InputGroup.recipe.js +0 -71
- package/dist/components/input-group/index.d.ts +0 -1
- package/dist/components/input-group/index.js +0 -1
- package/dist/components/modal/Modal.generated.d.ts +0 -84
- package/dist/components/modal/Modal.recipe.d.ts +0 -104
- package/dist/components/modal/Modal.recipe.js +0 -178
- package/dist/components/modal/index.d.ts +0 -1
- package/dist/components/modal/index.js +0 -1
- package/dist/components/number-field/NumberField.css +0 -198
- package/dist/components/number-field/NumberField.generated.d.ts +0 -49
- package/dist/components/number-field/NumberField.generated.js +0 -372
- package/dist/components/number-field/NumberField.recipe.d.ts +0 -40
- package/dist/components/number-field/NumberField.recipe.js +0 -89
- package/dist/components/number-field/index.d.ts +0 -1
- package/dist/components/number-field/index.js +0 -1
- package/dist/components/password-field/PasswordField.js +0 -168
- package/dist/components/password-requirements/PasswordRequirements.d.ts +0 -12
- package/dist/components/password-requirements/PasswordRequirements.js +0 -79
- package/dist/components/password-rules/index.d.ts +0 -1
- package/dist/components/password-rules/index.js +0 -1
- package/dist/components/progress-bar/ProgressBar.css +0 -104
- package/dist/components/progress-bar/ProgressBar.generated.d.ts +0 -20
- package/dist/components/progress-bar/ProgressBar.recipe.d.ts +0 -29
- package/dist/components/progress-bar/ProgressBar.recipe.js +0 -43
- package/dist/components/progress-bar/index.d.ts +0 -2
- package/dist/components/progress-bar/index.js +0 -1
- package/dist/components/progress-circle/ProgressCircle.css +0 -82
- package/dist/components/progress-circle/ProgressCircle.generated.d.ts +0 -19
- package/dist/components/progress-circle/ProgressCircle.recipe.d.ts +0 -28
- package/dist/components/progress-circle/ProgressCircle.recipe.js +0 -42
- package/dist/components/progress-circle/index.d.ts +0 -2
- package/dist/components/progress-circle/index.js +0 -1
- package/dist/components/scroll-shadow/ScrollShadow.generated.d.ts +0 -19
- package/dist/components/scroll-shadow/ScrollShadow.recipe.d.ts +0 -19
- package/dist/components/scroll-shadow/index.d.ts +0 -2
- package/dist/components/scroll-shadow/index.js +0 -1
- package/dist/components/scroll-shadow/useScrollShadow.d.ts +0 -13
- package/dist/components/search-field/SearchField.css +0 -183
- package/dist/components/search-field/SearchField.generated.d.ts +0 -54
- package/dist/components/search-field/SearchField.generated.js +0 -323
- package/dist/components/search-field/SearchField.recipe.d.ts +0 -38
- package/dist/components/search-field/SearchField.recipe.js +0 -77
- package/dist/components/search-field/index.d.ts +0 -1
- package/dist/components/search-field/index.js +0 -1
- package/dist/components/surface/Surface.css +0 -37
- package/dist/components/surface/Surface.generated.d.ts +0 -13
- package/dist/components/surface/Surface.generated.js +0 -42
- package/dist/components/surface/Surface.recipe.d.ts +0 -16
- package/dist/components/surface/Surface.recipe.js +0 -35
- package/dist/components/surface/index.d.ts +0 -1
- package/dist/components/surface/index.js +0 -1
- package/dist/components/tag/Tag.css +0 -129
- package/dist/components/tag/Tag.generated.d.ts +0 -34
- package/dist/components/tag/Tag.generated.js +0 -254
- package/dist/components/tag/Tag.recipe.d.ts +0 -30
- package/dist/components/tag/Tag.recipe.js +0 -64
- package/dist/components/tag/index.d.ts +0 -1
- package/dist/components/tag/index.js +0 -1
- package/dist/components/tag-group/TagGroup.css +0 -22
- package/dist/components/tag-group/TagGroup.generated.d.ts +0 -33
- package/dist/components/tag-group/TagGroup.generated.js +0 -190
- package/dist/components/tag-group/TagGroup.recipe.d.ts +0 -16
- package/dist/components/tag-group/TagGroup.recipe.js +0 -40
- package/dist/components/tag-group/context.d.ts +0 -15
- package/dist/components/tag-group/context.js +0 -3
- package/dist/components/tag-group/index.d.ts +0 -2
- package/dist/components/tag-group/index.js +0 -1
- package/dist/components/text-area/TextArea.generated.d.ts +0 -20
- package/dist/components/text-area/TextArea.generated.js +0 -68
- package/dist/components/text-area/TextArea.recipe.d.ts +0 -17
- package/dist/components/text-area/TextArea.recipe.js +0 -36
- package/dist/components/text-area/index.d.ts +0 -1
- package/dist/components/text-area/index.js +0 -1
- package/dist/components/text-field/TextField.css +0 -33
- package/dist/components/text-field/TextField.generated.d.ts +0 -35
- package/dist/components/text-field/TextField.generated.js +0 -89
- package/dist/components/text-field/TextField.recipe.d.ts +0 -17
- package/dist/components/text-field/TextField.recipe.js +0 -36
- package/dist/components/text-field/index.d.ts +0 -1
- package/dist/components/text-field/index.js +0 -1
- package/dist/components/toggle/Toggle.recipe.d.ts +0 -40
- package/dist/components/toggle/Toggle.recipe.js +0 -94
- package/dist/components/toggle/index.js +0 -1
- package/dist/styles/icons/generated-icons.css +0 -1
- /package/dist/components/{text-area/TextArea.css → textarea/Textarea.css} +0 -0
|
@@ -4,6 +4,7 @@ import "./ComboBox.css";
|
|
|
4
4
|
import { For, Show, createContext, createEffect, createMemo, createSignal, createUniqueId, onCleanup, onMount, splitProps, useContext } from "solid-js";
|
|
5
5
|
import { twMerge } from "tailwind-merge";
|
|
6
6
|
import { CLASSES, componentRecipe } from "./ComboBox.recipe.js";
|
|
7
|
+
import { resolveState } from "../vocabulary.js";
|
|
7
8
|
var _tmpl$ = /*#__PURE__*/ template("<input type=hidden>"), _tmpl$2 = /*#__PURE__*/ template("<div>"), _tmpl$3 = /*#__PURE__*/ template("<span>"), _tmpl$4 = /*#__PURE__*/ template("<input>"), _tmpl$5 = /*#__PURE__*/ template("<button>"), _tmpl$6 = /*#__PURE__*/ template("<div>No matching options"), _tmpl$7 = /*#__PURE__*/ template("<div role=option tabindex=-1 data-slot=combobox-option><span>"), _tmpl$8 = /*#__PURE__*/ template("<span><span>");
|
|
8
9
|
const ComboBoxContext = createContext();
|
|
9
10
|
const invokeEventHandler = (handler, event)=>{
|
|
@@ -45,7 +46,6 @@ const __solidLayoutComboBoxRoot = (_stable, p)=>{
|
|
|
45
46
|
"startIcon",
|
|
46
47
|
"endIcon",
|
|
47
48
|
"class",
|
|
48
|
-
"className",
|
|
49
49
|
"dataTheme",
|
|
50
50
|
"style",
|
|
51
51
|
"items",
|
|
@@ -55,19 +55,18 @@ const __solidLayoutComboBoxRoot = (_stable, p)=>{
|
|
|
55
55
|
"inputValue",
|
|
56
56
|
"defaultInputValue",
|
|
57
57
|
"onInputChange",
|
|
58
|
-
"
|
|
58
|
+
"open",
|
|
59
59
|
"defaultOpen",
|
|
60
60
|
"onOpenChange",
|
|
61
61
|
"fullWidth",
|
|
62
62
|
"variant",
|
|
63
63
|
"menuTrigger",
|
|
64
|
-
"
|
|
64
|
+
"state",
|
|
65
65
|
"disabled",
|
|
66
|
-
"
|
|
66
|
+
"issues",
|
|
67
67
|
"allowsCustomValue",
|
|
68
68
|
"placeholder",
|
|
69
69
|
"name",
|
|
70
|
-
"isRequired",
|
|
71
70
|
"required",
|
|
72
71
|
"defaultFilter",
|
|
73
72
|
"itemKey",
|
|
@@ -86,10 +85,10 @@ const __solidLayoutComboBoxRoot = (_stable, p)=>{
|
|
|
86
85
|
const variant = ()=>local.variant ?? "primary";
|
|
87
86
|
const menuTrigger = ()=>local.menuTrigger ?? "focus";
|
|
88
87
|
const fullWidth = ()=>Boolean(local.fullWidth);
|
|
89
|
-
const isDisabled = ()=>Boolean(local.
|
|
90
|
-
const isInvalid = ()=>Boolean(local.
|
|
91
|
-
const isRequired = ()=>Boolean(local.
|
|
92
|
-
const isOpen = ()=>void 0 !== local.
|
|
88
|
+
const isDisabled = ()=>Boolean("disabled" === local.state) || Boolean(local.disabled);
|
|
89
|
+
const isInvalid = ()=>Boolean("invalid" === resolveState(local.state, local.issues));
|
|
90
|
+
const isRequired = ()=>Boolean(local.required) || Boolean(local.required);
|
|
91
|
+
const isOpen = ()=>void 0 !== local.open ? Boolean(local.open) : internalOpen();
|
|
93
92
|
const selectedKey = createMemo(()=>void 0 !== local.selectedKey ? normalizeKey(local.selectedKey) : internalSelectedKey());
|
|
94
93
|
const inputValue = createMemo(()=>void 0 !== local.inputValue ? local.inputValue : internalInputValue());
|
|
95
94
|
const normalizedItems = createMemo(()=>(local.items ?? []).map((item, index)=>{
|
|
@@ -124,7 +123,7 @@ const __solidLayoutComboBoxRoot = (_stable, p)=>{
|
|
|
124
123
|
};
|
|
125
124
|
const setOpen = (next, options)=>{
|
|
126
125
|
if (next && isDisabled()) return;
|
|
127
|
-
if (void 0 === local.
|
|
126
|
+
if (void 0 === local.open) setInternalOpen(next);
|
|
128
127
|
local.onOpenChange?.(next);
|
|
129
128
|
if (!next && options?.focusInput) queueMicrotask(()=>{
|
|
130
129
|
inputRef?.focus();
|
|
@@ -242,7 +241,7 @@ const __solidLayoutComboBoxRoot = (_stable, p)=>{
|
|
|
242
241
|
if ("function" == typeof local.ref) local.ref(node);
|
|
243
242
|
}, _el$);
|
|
244
243
|
spread(_el$, mergeProps(others, ()=>({
|
|
245
|
-
class: twMerge(CLASSES.Root.base, CLASSES.Root.variant[variant()], fullWidth() && CLASSES.Root.flag.fullWidth, local.class
|
|
244
|
+
class: twMerge(CLASSES.Root.base, CLASSES.Root.variant[variant()], fullWidth() && CLASSES.Root.flag.fullWidth, local.class)
|
|
246
245
|
}), {
|
|
247
246
|
"data-slot": "combobox",
|
|
248
247
|
get ["data-open"] () {
|
|
@@ -334,14 +333,13 @@ const __solidLayoutComboBoxInputGroup = (_stable, p)=>{
|
|
|
334
333
|
const [local, others] = splitProps(p, [
|
|
335
334
|
"children",
|
|
336
335
|
"class",
|
|
337
|
-
"className",
|
|
338
336
|
"dataTheme",
|
|
339
337
|
"style"
|
|
340
338
|
]);
|
|
341
339
|
return (()=>{
|
|
342
340
|
var _el$4 = _tmpl$2();
|
|
343
341
|
spread(_el$4, mergeProps(others, ()=>({
|
|
344
|
-
class: twMerge(CLASSES.InputGroup.base, context?.fullWidth() && CLASSES.InputGroup.flag.fullWidth, local.class
|
|
342
|
+
class: twMerge(CLASSES.InputGroup.base, context?.fullWidth() && CLASSES.InputGroup.flag.fullWidth, local.class)
|
|
345
343
|
}), {
|
|
346
344
|
"data-slot": "combobox-input-group",
|
|
347
345
|
get ["data-disabled"] () {
|
|
@@ -370,7 +368,6 @@ const __solidLayoutComboBoxInput = (_stable, p)=>{
|
|
|
370
368
|
const context = useContext(ComboBoxContext);
|
|
371
369
|
const [local, others] = splitProps(p, [
|
|
372
370
|
"class",
|
|
373
|
-
"className",
|
|
374
371
|
"dataTheme",
|
|
375
372
|
"style",
|
|
376
373
|
"onInput",
|
|
@@ -473,7 +470,7 @@ const __solidLayoutComboBoxInput = (_stable, p)=>{
|
|
|
473
470
|
return context?.isInvalid() ? "true" : void 0;
|
|
474
471
|
}
|
|
475
472
|
}, ()=>({
|
|
476
|
-
class: twMerge(CLASSES.Input.base, local.class
|
|
473
|
+
class: twMerge(CLASSES.Input.base, local.class)
|
|
477
474
|
}), {
|
|
478
475
|
"data-slot": "combobox-input",
|
|
479
476
|
get ["data-theme"] () {
|
|
@@ -509,7 +506,6 @@ const __solidLayoutComboBoxTrigger = (_stable, p)=>{
|
|
|
509
506
|
const [local, others] = splitProps(p, [
|
|
510
507
|
"children",
|
|
511
508
|
"class",
|
|
512
|
-
"className",
|
|
513
509
|
"dataTheme",
|
|
514
510
|
"style",
|
|
515
511
|
"startIcon",
|
|
@@ -526,7 +522,7 @@ const __solidLayoutComboBoxTrigger = (_stable, p)=>{
|
|
|
526
522
|
spread(_el$6, mergeProps(others, {
|
|
527
523
|
type: "button"
|
|
528
524
|
}, ()=>({
|
|
529
|
-
class: twMerge(CLASSES.Trigger.base, local.class
|
|
525
|
+
class: twMerge(CLASSES.Trigger.base, local.class)
|
|
530
526
|
}), {
|
|
531
527
|
"data-slot": "combobox-trigger",
|
|
532
528
|
get ["data-open"] () {
|
|
@@ -594,14 +590,13 @@ const __solidLayoutComboBoxPopover = (_stable, p)=>{
|
|
|
594
590
|
const [local, others] = splitProps(p, [
|
|
595
591
|
"children",
|
|
596
592
|
"class",
|
|
597
|
-
"className",
|
|
598
593
|
"dataTheme",
|
|
599
594
|
"style"
|
|
600
595
|
]);
|
|
601
596
|
return (()=>{
|
|
602
597
|
var _el$9 = _tmpl$2();
|
|
603
598
|
spread(_el$9, mergeProps(others, ()=>({
|
|
604
|
-
class: twMerge(CLASSES.Popover.base, local.class
|
|
599
|
+
class: twMerge(CLASSES.Popover.base, local.class)
|
|
605
600
|
}), {
|
|
606
601
|
"data-slot": "combobox-popover",
|
|
607
602
|
get ["data-open"] () {
|
|
@@ -628,10 +623,9 @@ const __solidLayoutComboBoxList = (_stable, p)=>{
|
|
|
628
623
|
const [local, others] = splitProps(p, [
|
|
629
624
|
"children",
|
|
630
625
|
"class",
|
|
631
|
-
"className",
|
|
632
626
|
"dataTheme",
|
|
633
627
|
"style",
|
|
634
|
-
"
|
|
628
|
+
"renderEmpty",
|
|
635
629
|
"endIcon"
|
|
636
630
|
]);
|
|
637
631
|
const items = ()=>context?.filteredItems() ?? [];
|
|
@@ -643,7 +637,7 @@ const __solidLayoutComboBoxList = (_stable, p)=>{
|
|
|
643
637
|
},
|
|
644
638
|
role: "listbox"
|
|
645
639
|
}, ()=>({
|
|
646
|
-
class: twMerge(CLASSES.List.base, local.class
|
|
640
|
+
class: twMerge(CLASSES.List.base, local.class)
|
|
647
641
|
}), {
|
|
648
642
|
"data-slot": "combobox-list",
|
|
649
643
|
get ["data-theme"] () {
|
|
@@ -658,7 +652,7 @@ const __solidLayoutComboBoxList = (_stable, p)=>{
|
|
|
658
652
|
return items().length > 0;
|
|
659
653
|
},
|
|
660
654
|
get fallback () {
|
|
661
|
-
return local.
|
|
655
|
+
return local.renderEmpty?.() ?? (()=>{
|
|
662
656
|
var _el$1 = _tmpl$6();
|
|
663
657
|
spread(_el$1, mergeProps(()=>({
|
|
664
658
|
class: CLASSES.List.empty
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
@layer components {
|
|
2
|
+
.composer {
|
|
3
|
+
display: flex;
|
|
4
|
+
flex-direction: column;
|
|
5
|
+
gap: 0.375rem;
|
|
6
|
+
width: 100%;
|
|
7
|
+
padding: 0.5rem;
|
|
8
|
+
background: var(--color-base-100);
|
|
9
|
+
border: var(--border, 1px) solid var(--color-base-300);
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.composer--solid { background: var(--color-base-200); border-color: transparent; }
|
|
13
|
+
.composer--soft { background: var(--color-base-200); }
|
|
14
|
+
.composer--outline { background: transparent; }
|
|
15
|
+
.composer--ghost { background: transparent; border-color: transparent; }
|
|
16
|
+
.composer--plain { background: none; border: 0; padding: 0; }
|
|
17
|
+
|
|
18
|
+
.composer--radius-none { border-radius: 0; }
|
|
19
|
+
.composer--radius-sm { border-radius: var(--radius-field, 0.25rem); }
|
|
20
|
+
.composer--radius-md { border-radius: 0.5rem; }
|
|
21
|
+
.composer--radius-lg { border-radius: 0.75rem; }
|
|
22
|
+
.composer--radius-full { border-radius: 1.5rem; }
|
|
23
|
+
|
|
24
|
+
.composer:focus-within {
|
|
25
|
+
border-color: var(--color-primary);
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
/* Height is written by autosize, so nothing here may fight it: no `rows`
|
|
29
|
+
driven min-height, no transition on height. A transition would animate
|
|
30
|
+
every keystroke that changes a line. */
|
|
31
|
+
.composer__field {
|
|
32
|
+
width: 100%;
|
|
33
|
+
resize: none;
|
|
34
|
+
overflow-y: auto;
|
|
35
|
+
border: 0;
|
|
36
|
+
padding: 0.25rem 0.25rem;
|
|
37
|
+
background: none;
|
|
38
|
+
color: inherit;
|
|
39
|
+
font: inherit;
|
|
40
|
+
line-height: 22px;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.composer__field:focus {
|
|
44
|
+
outline: none;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.composer__toolbar {
|
|
48
|
+
display: flex;
|
|
49
|
+
align-items: center;
|
|
50
|
+
gap: 0.5rem;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.composer__lead,
|
|
54
|
+
.composer__trail {
|
|
55
|
+
display: inline-flex;
|
|
56
|
+
align-items: center;
|
|
57
|
+
gap: 0.375rem;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
/* Pushes the submit button to the end and takes the slack, so a hint that
|
|
61
|
+
wraps does not move the button. */
|
|
62
|
+
.composer__hint {
|
|
63
|
+
flex: 1 1 auto;
|
|
64
|
+
min-width: 0;
|
|
65
|
+
color: var(--color-base-content);
|
|
66
|
+
opacity: 0.6;
|
|
67
|
+
font-size: 0.8125rem;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.composer__submit {
|
|
71
|
+
flex-shrink: 0;
|
|
72
|
+
margin-inline-start: auto;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.composer__submit:disabled {
|
|
76
|
+
opacity: 0.5;
|
|
77
|
+
cursor: not-allowed;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.composer__issues {
|
|
81
|
+
margin: 0;
|
|
82
|
+
padding: 0;
|
|
83
|
+
list-style: none;
|
|
84
|
+
font-size: 0.8125rem;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.composer__issues [data-severity="error"] { color: var(--color-error); }
|
|
88
|
+
.composer__issues [data-severity="warning"] { color: var(--color-warning); }
|
|
89
|
+
|
|
90
|
+
.composer--xs { font-size: 0.75rem; }
|
|
91
|
+
.composer--sm { font-size: 0.8125rem; }
|
|
92
|
+
.composer--md { font-size: 0.875rem; }
|
|
93
|
+
.composer--lg { font-size: 1rem; }
|
|
94
|
+
.composer--xl { font-size: 1.125rem; }
|
|
95
|
+
|
|
96
|
+
/* Sending keeps the text readable: a greyed-out box during a send reads as
|
|
97
|
+
"your message was lost" to anyone who looks away and back. */
|
|
98
|
+
.composer--loading .composer__field { opacity: 0.85; }
|
|
99
|
+
|
|
100
|
+
.composer--error,
|
|
101
|
+
.composer--invalid { border-color: var(--color-error); }
|
|
102
|
+
|
|
103
|
+
.composer--disabled {
|
|
104
|
+
opacity: 0.5;
|
|
105
|
+
pointer-events: none;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.composer--hidden { display: none; }
|
|
109
|
+
}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import type { Component as __LayoutComponent } from "solid-js";
|
|
2
|
+
import "./Composer.css";
|
|
3
|
+
import { type JSX } from "solid-js";
|
|
4
|
+
import type { ChangeReason, Issue, Radius, Size, State, UIBaseProps, Variant } from "../vocabulary";
|
|
5
|
+
export type ComposerProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, "onChange" | "onSubmit" | "children"> & UIBaseProps & {
|
|
6
|
+
value?: string;
|
|
7
|
+
defaultValue?: string;
|
|
8
|
+
onChange?: (value: string, reason?: ChangeReason) => void;
|
|
9
|
+
/** Fired with the trimmed message. Not fired while `state` is `loading`. */
|
|
10
|
+
onSubmit?: (value: string) => void;
|
|
11
|
+
placeholder?: string;
|
|
12
|
+
size?: Size;
|
|
13
|
+
variant?: Variant;
|
|
14
|
+
radius?: Radius;
|
|
15
|
+
/** `loading` means a send is in flight: the box stays readable and refuses to send again. */
|
|
16
|
+
state?: State;
|
|
17
|
+
/** Server-side or asynchronous problems, rendered under the box. */
|
|
18
|
+
issues?: Issue[];
|
|
19
|
+
minRows?: number;
|
|
20
|
+
maxRows?: number;
|
|
21
|
+
/**
|
|
22
|
+
* Enter sends. Set false where a newline is the common case and sending is
|
|
23
|
+
* an explicit act, which is what long-form editors want.
|
|
24
|
+
*/
|
|
25
|
+
submitOnEnter?: boolean;
|
|
26
|
+
/**
|
|
27
|
+
* Announced whenever the box changes height.
|
|
28
|
+
*
|
|
29
|
+
* A chat transcript that pins to the bottom has to know: the composer
|
|
30
|
+
* growing by a line moves the bottom, and a scroller that finds out by
|
|
31
|
+
* observing the DOM finds out a frame late and jitters.
|
|
32
|
+
*/
|
|
33
|
+
onHeightChange?: (height: number) => void;
|
|
34
|
+
/** Controls before the field: attachments, model pickers, mode switches. */
|
|
35
|
+
lead?: JSX.Element;
|
|
36
|
+
/** Controls after the field, before the submit button. */
|
|
37
|
+
trail?: JSX.Element;
|
|
38
|
+
submitLabel?: JSX.Element;
|
|
39
|
+
/** Shown beside the controls. Usually the Enter/Shift+Enter reminder. */
|
|
40
|
+
hint?: JSX.Element;
|
|
41
|
+
autofocus?: boolean;
|
|
42
|
+
name?: string;
|
|
43
|
+
/** Height of the window, for the ceiling. Injected for runtimes without one. */
|
|
44
|
+
viewportHeight?: number;
|
|
45
|
+
};
|
|
46
|
+
export declare const ComposerLayout: __LayoutComponent<ComposerProps>;
|
|
@@ -0,0 +1,153 @@
|
|
|
1
|
+
import { createComponent, effect, insert, mergeProps, setAttribute, spread, template, use } from "solid-js/web";
|
|
2
|
+
import { defineComponent } from "solid-layouts/application-boundary";
|
|
3
|
+
import "./Composer.css";
|
|
4
|
+
import { For, Show, createEffect, createSignal, onMount } from "solid-js";
|
|
5
|
+
import { isInvalid, resolveState } from "../vocabulary.js";
|
|
6
|
+
import { composer } from "./Composer.recipe.js";
|
|
7
|
+
import { afterValueLands, autosize, boundsFromRows, isSubmittable, newAutosizeMemo, shouldSubmit, viewportHeight } from "./Composer.interactions.js";
|
|
8
|
+
var _tmpl$ = /*#__PURE__*/ template("<span>"), _tmpl$2 = /*#__PURE__*/ template("<ul>"), _tmpl$3 = /*#__PURE__*/ template("<div><textarea></textarea><div><button>"), _tmpl$4 = /*#__PURE__*/ template("<li>");
|
|
9
|
+
const __solidLayoutComposerLayout = (_stable, p)=>{
|
|
10
|
+
const [internal, setInternal] = createSignal(p.defaultValue ?? "");
|
|
11
|
+
const value = ()=>p.value ?? internal();
|
|
12
|
+
const busy = ()=>"loading" === p.state || "disabled" === p.state;
|
|
13
|
+
const state = ()=>resolveState(p.state, p.issues);
|
|
14
|
+
let field;
|
|
15
|
+
const memo = newAutosizeMemo();
|
|
16
|
+
const measure = ()=>{
|
|
17
|
+
if (!field) return;
|
|
18
|
+
const bounds = boundsFromRows(p.minRows ?? 1, p.maxRows ?? 8, viewportHeight(p.viewportHeight));
|
|
19
|
+
p.onHeightChange?.(autosize(field, bounds, memo));
|
|
20
|
+
};
|
|
21
|
+
onMount(()=>{
|
|
22
|
+
if (p.autofocus) field?.focus();
|
|
23
|
+
measure();
|
|
24
|
+
});
|
|
25
|
+
createEffect(()=>{
|
|
26
|
+
value();
|
|
27
|
+
measure();
|
|
28
|
+
});
|
|
29
|
+
const write = (next, reason)=>{
|
|
30
|
+
if (void 0 === p.value) setInternal(next);
|
|
31
|
+
p.onChange?.(next, reason);
|
|
32
|
+
};
|
|
33
|
+
const submit = ()=>{
|
|
34
|
+
if (busy()) return;
|
|
35
|
+
const message = value().trim();
|
|
36
|
+
if (!isSubmittable(message)) return;
|
|
37
|
+
p.onSubmit?.(message);
|
|
38
|
+
if (void 0 === p.value) setInternal("");
|
|
39
|
+
};
|
|
40
|
+
return (()=>{
|
|
41
|
+
var _el$ = _tmpl$3(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$7 = _el$3.firstChild;
|
|
42
|
+
spread(_el$, mergeProps(()=>_stable.slot.root, {
|
|
43
|
+
get ["data-state"] () {
|
|
44
|
+
return state();
|
|
45
|
+
}
|
|
46
|
+
}), false, true);
|
|
47
|
+
var _ref$ = field;
|
|
48
|
+
"function" == typeof _ref$ ? use(_ref$, _el$2) : field = _el$2;
|
|
49
|
+
spread(_el$2, mergeProps(()=>_stable.slot.field, {
|
|
50
|
+
get name () {
|
|
51
|
+
return p.name;
|
|
52
|
+
},
|
|
53
|
+
get value () {
|
|
54
|
+
return value();
|
|
55
|
+
},
|
|
56
|
+
get rows () {
|
|
57
|
+
return p.minRows ?? 1;
|
|
58
|
+
},
|
|
59
|
+
get placeholder () {
|
|
60
|
+
return p.placeholder;
|
|
61
|
+
},
|
|
62
|
+
get disabled () {
|
|
63
|
+
return "disabled" === p.state;
|
|
64
|
+
},
|
|
65
|
+
get ["aria-invalid"] () {
|
|
66
|
+
return isInvalid(p.issues) ? "true" : void 0;
|
|
67
|
+
},
|
|
68
|
+
onInput: (event)=>{
|
|
69
|
+
write(event.currentTarget.value, "input");
|
|
70
|
+
measure();
|
|
71
|
+
},
|
|
72
|
+
onPaste: ()=>afterValueLands(measure),
|
|
73
|
+
onKeyDown: (event)=>{
|
|
74
|
+
if (!shouldSubmit(event, false !== p.submitOnEnter)) return;
|
|
75
|
+
event.preventDefault();
|
|
76
|
+
submit();
|
|
77
|
+
}
|
|
78
|
+
}), false, false);
|
|
79
|
+
spread(_el$3, mergeProps(()=>_stable.slot.toolbar), false, true);
|
|
80
|
+
insert(_el$3, createComponent(Show, {
|
|
81
|
+
get when () {
|
|
82
|
+
return p.lead;
|
|
83
|
+
},
|
|
84
|
+
get children () {
|
|
85
|
+
var _el$4 = _tmpl$();
|
|
86
|
+
spread(_el$4, mergeProps(()=>_stable.slot.lead), false, true);
|
|
87
|
+
insert(_el$4, ()=>p.lead);
|
|
88
|
+
return _el$4;
|
|
89
|
+
}
|
|
90
|
+
}), _el$7);
|
|
91
|
+
insert(_el$3, createComponent(Show, {
|
|
92
|
+
get when () {
|
|
93
|
+
return p.hint;
|
|
94
|
+
},
|
|
95
|
+
get children () {
|
|
96
|
+
var _el$5 = _tmpl$();
|
|
97
|
+
spread(_el$5, mergeProps(()=>_stable.slot.hint), false, true);
|
|
98
|
+
insert(_el$5, ()=>p.hint);
|
|
99
|
+
return _el$5;
|
|
100
|
+
}
|
|
101
|
+
}), _el$7);
|
|
102
|
+
insert(_el$3, createComponent(Show, {
|
|
103
|
+
get when () {
|
|
104
|
+
return p.trail;
|
|
105
|
+
},
|
|
106
|
+
get children () {
|
|
107
|
+
var _el$6 = _tmpl$();
|
|
108
|
+
spread(_el$6, mergeProps(()=>_stable.slot.trail), false, true);
|
|
109
|
+
insert(_el$6, ()=>p.trail);
|
|
110
|
+
return _el$6;
|
|
111
|
+
}
|
|
112
|
+
}), _el$7);
|
|
113
|
+
spread(_el$7, mergeProps(()=>_stable.slot.submit, {
|
|
114
|
+
type: "button",
|
|
115
|
+
onClick: submit,
|
|
116
|
+
get disabled () {
|
|
117
|
+
return busy() || !isSubmittable(value());
|
|
118
|
+
},
|
|
119
|
+
get ["data-loading"] () {
|
|
120
|
+
return "loading" === p.state ? "true" : "false";
|
|
121
|
+
}
|
|
122
|
+
}), false, true);
|
|
123
|
+
insert(_el$7, ()=>p.submitLabel ?? "Send");
|
|
124
|
+
insert(_el$, createComponent(Show, {
|
|
125
|
+
get when () {
|
|
126
|
+
return p.issues?.length;
|
|
127
|
+
},
|
|
128
|
+
get children () {
|
|
129
|
+
var _el$8 = _tmpl$2();
|
|
130
|
+
spread(_el$8, mergeProps(()=>_stable.slot.issues), false, true);
|
|
131
|
+
insert(_el$8, createComponent(For, {
|
|
132
|
+
get each () {
|
|
133
|
+
return p.issues;
|
|
134
|
+
},
|
|
135
|
+
children: (issue)=>(()=>{
|
|
136
|
+
var _el$9 = _tmpl$4();
|
|
137
|
+
insert(_el$9, ()=>issue.message ?? issue.code);
|
|
138
|
+
effect(()=>setAttribute(_el$9, "data-severity", issue.severity ?? "error"));
|
|
139
|
+
return _el$9;
|
|
140
|
+
})()
|
|
141
|
+
}));
|
|
142
|
+
return _el$8;
|
|
143
|
+
}
|
|
144
|
+
}), null);
|
|
145
|
+
return _el$;
|
|
146
|
+
})();
|
|
147
|
+
};
|
|
148
|
+
const ComposerLayout = defineComponent({
|
|
149
|
+
recipe: composer,
|
|
150
|
+
layout: __solidLayoutComposerLayout,
|
|
151
|
+
embedded: true
|
|
152
|
+
});
|
|
153
|
+
export { ComposerLayout };
|
|
@@ -0,0 +1,93 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Pure mechanics behind `Composer`.
|
|
3
|
+
*
|
|
4
|
+
* They live apart from the Layout because a `.layout.tsx` template resolves
|
|
5
|
+
* free identifiers against props, so a bare `setTimeout` or `window` in that
|
|
6
|
+
* file compiles to `props.setTimeout`. They are also the part worth testing
|
|
7
|
+
* directly: autosize is where a chat box gets slow, and submit resolution is
|
|
8
|
+
* where it gets rude.
|
|
9
|
+
*/
|
|
10
|
+
/** A textarea, reduced to what autosize actually touches. */
|
|
11
|
+
export type AutosizeField = {
|
|
12
|
+
value: string;
|
|
13
|
+
scrollHeight: number;
|
|
14
|
+
style: {
|
|
15
|
+
height: string;
|
|
16
|
+
maxHeight: string;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
export type AutosizeBounds = {
|
|
20
|
+
/** Smallest height to hold, in pixels. Keeps one writable line while layout settles. */
|
|
21
|
+
floor: number;
|
|
22
|
+
/** Largest height before the field scrolls instead of growing. */
|
|
23
|
+
ceiling: number;
|
|
24
|
+
};
|
|
25
|
+
/**
|
|
26
|
+
* State carried between measurements.
|
|
27
|
+
*
|
|
28
|
+
* Not decoration: without it every keystroke writes a style, and a style write
|
|
29
|
+
* marks layout stale, so the `scrollHeight` read that follows has to resolve
|
|
30
|
+
* the whole document before it can answer. Measured at 12.77ms per keystroke on
|
|
31
|
+
* a 3,599-node tree, which was 82 percent of the cost of typing a character.
|
|
32
|
+
*/
|
|
33
|
+
export type AutosizeMemo = {
|
|
34
|
+
length: number;
|
|
35
|
+
height: number;
|
|
36
|
+
ceiling: number;
|
|
37
|
+
};
|
|
38
|
+
export declare const newAutosizeMemo: () => AutosizeMemo;
|
|
39
|
+
/**
|
|
40
|
+
* Grow with the content up to a ceiling, then scroll.
|
|
41
|
+
*
|
|
42
|
+
* Returns the height applied, so a caller can tell a surrounding scroller what
|
|
43
|
+
* changed. Writes nothing when nothing moved, which is most keystrokes: text
|
|
44
|
+
* usually lands inside the current line.
|
|
45
|
+
*
|
|
46
|
+
* The `height = "auto"` reset is what lets the field *shrink* — with a fixed
|
|
47
|
+
* height larger than its content, `scrollHeight` reports the box rather than
|
|
48
|
+
* the text. It is also a style write, so it is skipped while the content is
|
|
49
|
+
* only getting longer, where the box is never taller than the text and the
|
|
50
|
+
* reset buys nothing.
|
|
51
|
+
*/
|
|
52
|
+
export declare const autosize: (field: AutosizeField, bounds: AutosizeBounds, memo: AutosizeMemo) => number;
|
|
53
|
+
/** Pixels per row, used only to turn a row count into a bound. */
|
|
54
|
+
export declare const ROW_HEIGHT = 22;
|
|
55
|
+
/**
|
|
56
|
+
* Turn rows into pixel bounds, never letting the box eat the window.
|
|
57
|
+
*
|
|
58
|
+
* `viewportHeight` is passed in rather than read, so this stays pure and so a
|
|
59
|
+
* runtime without a window can still call it.
|
|
60
|
+
*/
|
|
61
|
+
export declare const boundsFromRows: (minRows: number, maxRows: number, viewportHeight: number, fraction?: number) => AutosizeBounds;
|
|
62
|
+
export type SubmitKey = {
|
|
63
|
+
key: string;
|
|
64
|
+
shiftKey: boolean;
|
|
65
|
+
ctrlKey?: boolean;
|
|
66
|
+
metaKey?: boolean;
|
|
67
|
+
altKey?: boolean;
|
|
68
|
+
isComposing?: boolean;
|
|
69
|
+
};
|
|
70
|
+
/**
|
|
71
|
+
* Does this keystroke send?
|
|
72
|
+
*
|
|
73
|
+
* Enter sends and Shift+Enter is a newline, which is what a chat box has
|
|
74
|
+
* trained everyone to expect. `isComposing` is the part that is easy to miss:
|
|
75
|
+
* while an IME is open, Enter commits the candidate and must not also send the
|
|
76
|
+
* message. Skipping that check sends half a word in Japanese, Chinese and
|
|
77
|
+
* Korean and looks like the app is broken to everyone who uses one.
|
|
78
|
+
*/
|
|
79
|
+
export declare const shouldSubmit: (event: SubmitKey, submitOnEnter: boolean) => boolean;
|
|
80
|
+
/** Nothing but whitespace is not a message, so it never submits. */
|
|
81
|
+
export declare const isSubmittable: (value: string) => boolean;
|
|
82
|
+
/**
|
|
83
|
+
* Run after the pending value has landed in the field.
|
|
84
|
+
*
|
|
85
|
+
* A paste changes the value through the browser rather than through us, so
|
|
86
|
+
* measuring in the handler measures the box as it was. The deferral lives here
|
|
87
|
+
* because a bare `queueMicrotask` inside a `.layout.tsx` compiles to
|
|
88
|
+
* `props.queueMicrotask`: free identifiers in a template bind to props, and
|
|
89
|
+
* timers are not on the known-globals list.
|
|
90
|
+
*/
|
|
91
|
+
export declare const afterValueLands: (measure: () => void) => void;
|
|
92
|
+
/** The window height, or a sane stand-in where there is no window. */
|
|
93
|
+
export declare const viewportHeight: (override?: number) => number;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
const newAutosizeMemo = ()=>({
|
|
2
|
+
length: -1,
|
|
3
|
+
height: -1,
|
|
4
|
+
ceiling: -1
|
|
5
|
+
});
|
|
6
|
+
const autosize = (field, bounds, memo)=>{
|
|
7
|
+
if (bounds.ceiling !== memo.ceiling) {
|
|
8
|
+
field.style.maxHeight = `${bounds.ceiling}px`;
|
|
9
|
+
memo.ceiling = bounds.ceiling;
|
|
10
|
+
memo.length = -1;
|
|
11
|
+
}
|
|
12
|
+
const length = field.value.length;
|
|
13
|
+
if (length < memo.length || memo.length < 0) field.style.height = "auto";
|
|
14
|
+
memo.length = length;
|
|
15
|
+
const height = Math.max(bounds.floor, Math.min(field.scrollHeight || bounds.floor, bounds.ceiling));
|
|
16
|
+
if (height !== memo.height) {
|
|
17
|
+
field.style.height = `${height}px`;
|
|
18
|
+
memo.height = height;
|
|
19
|
+
}
|
|
20
|
+
return height;
|
|
21
|
+
};
|
|
22
|
+
const ROW_HEIGHT = 22;
|
|
23
|
+
const boundsFromRows = (minRows, maxRows, viewportHeight, fraction = 0.45)=>{
|
|
24
|
+
const floor = Math.max(1, minRows) * ROW_HEIGHT;
|
|
25
|
+
const viewportCeiling = Math.max(floor, Math.floor(viewportHeight * fraction));
|
|
26
|
+
return {
|
|
27
|
+
floor,
|
|
28
|
+
ceiling: Math.min(Math.max(1, maxRows) * ROW_HEIGHT, viewportCeiling)
|
|
29
|
+
};
|
|
30
|
+
};
|
|
31
|
+
const shouldSubmit = (event, submitOnEnter)=>{
|
|
32
|
+
if (!submitOnEnter) return false;
|
|
33
|
+
if ("Enter" !== event.key) return false;
|
|
34
|
+
if (event.isComposing) return false;
|
|
35
|
+
return !event.shiftKey && !event.ctrlKey && !event.metaKey && !event.altKey;
|
|
36
|
+
};
|
|
37
|
+
const isSubmittable = (value)=>value.trim().length > 0;
|
|
38
|
+
const afterValueLands = (measure)=>{
|
|
39
|
+
queueMicrotask(measure);
|
|
40
|
+
};
|
|
41
|
+
const Composer_interactions_viewportHeight = (override)=>override ?? globalThis.innerHeight ?? 800;
|
|
42
|
+
export { Composer_interactions_viewportHeight as viewportHeight, ROW_HEIGHT, afterValueLands, autosize, boundsFromRows, isSubmittable, newAutosizeMemo, shouldSubmit };
|