@os-design/core 1.0.135 → 1.0.138
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/dist/cjs/Alert/index.js +1 -1
- package/dist/cjs/Alert/index.js.map +1 -1
- package/dist/cjs/Avatar/index.js +1 -1
- package/dist/cjs/Avatar/index.js.map +1 -1
- package/dist/cjs/Avatar/utils/nameToInitials.js.map +1 -1
- package/dist/cjs/Avatar/utils/strToHue.js.map +1 -1
- package/dist/cjs/AvatarSkeleton/index.js +1 -1
- package/dist/cjs/AvatarSkeleton/index.js.map +1 -1
- package/dist/cjs/Breadcrumb/index.js +1 -1
- package/dist/cjs/Breadcrumb/index.js.map +1 -1
- package/dist/cjs/BreadcrumbItem/index.js +1 -1
- package/dist/cjs/BreadcrumbItem/index.js.map +1 -1
- package/dist/cjs/Button/ButtonContent.js.map +1 -1
- package/dist/cjs/Button/index.js +1 -1
- package/dist/cjs/Button/index.js.map +1 -1
- package/dist/cjs/Button/utils/useButtonColors.js.map +1 -1
- package/dist/cjs/Checkbox/index.js +1 -1
- package/dist/cjs/Checkbox/index.js.map +1 -1
- package/dist/cjs/CheckboxSkeleton/index.js +1 -1
- package/dist/cjs/CheckboxSkeleton/index.js.map +1 -1
- package/dist/cjs/DatePicker/DatePickerCalendar.js +1 -1
- package/dist/cjs/DatePicker/DatePickerCalendar.js.map +1 -1
- package/dist/cjs/DatePicker/index.js +1 -1
- package/dist/cjs/DatePicker/index.js.map +1 -1
- package/dist/cjs/Drawer/index.js +1 -1
- package/dist/cjs/Drawer/index.js.map +1 -1
- package/dist/cjs/Form/FormConfigContext.js.map +1 -1
- package/dist/cjs/Form/index.js +1 -1
- package/dist/cjs/Form/index.js.map +1 -1
- package/dist/cjs/FormDivider/index.js +1 -1
- package/dist/cjs/FormDivider/index.js.map +1 -1
- package/dist/cjs/FormItem/index.js +1 -1
- package/dist/cjs/FormItem/index.js.map +1 -1
- package/dist/cjs/FormItem/utils/firstChildHasType.js.map +1 -1
- package/dist/cjs/GlobalStyles/index.js.map +1 -1
- package/dist/cjs/GlobalStyles/resetStyles.js.map +1 -1
- package/dist/cjs/GlobalStyles/typographyStyles.js.map +1 -1
- package/dist/cjs/HeaderSkeleton/index.js +1 -1
- package/dist/cjs/HeaderSkeleton/index.js.map +1 -1
- package/dist/cjs/Image/index.js +1 -1
- package/dist/cjs/Image/index.js.map +1 -1
- package/dist/cjs/ImageSkeleton/index.js +1 -1
- package/dist/cjs/ImageSkeleton/index.js.map +1 -1
- package/dist/cjs/Input/index.js +1 -1
- package/dist/cjs/Input/index.js.map +1 -1
- package/dist/cjs/Input/utils/getFocusableElements.js.map +1 -1
- package/dist/cjs/InputNumber/index.js +1 -1
- package/dist/cjs/InputNumber/index.js.map +1 -1
- package/dist/cjs/InputNumber/utils/defaultLocale.js.map +1 -1
- package/dist/cjs/InputPassword/index.js +1 -1
- package/dist/cjs/InputPassword/index.js.map +1 -1
- package/dist/cjs/InputPassword/utils/defaultLocale.js.map +1 -1
- package/dist/cjs/InputSearch/index.js +1 -1
- package/dist/cjs/InputSearch/index.js.map +1 -1
- package/dist/cjs/InputSearch/utils/defaultLocale.js.map +1 -1
- package/dist/cjs/InputSkeleton/index.js +1 -1
- package/dist/cjs/InputSkeleton/index.js.map +1 -1
- package/dist/cjs/Layout/LayoutContext.js.map +1 -1
- package/dist/cjs/Layout/index.js.map +1 -1
- package/dist/cjs/Link/index.js +1 -1
- package/dist/cjs/Link/index.js.map +1 -1
- package/dist/cjs/LinkButton/index.js +1 -1
- package/dist/cjs/LinkButton/index.js.map +1 -1
- package/dist/cjs/List/WindowScroller.js.map +1 -1
- package/dist/cjs/List/index.js +3 -5
- package/dist/cjs/List/index.js.map +1 -1
- package/dist/cjs/List/utils/bodyPointerEvents.js.map +1 -1
- package/dist/cjs/List/utils/frameTimeout.js.map +1 -1
- package/dist/cjs/List/utils/useRWLoadNext.js.map +1 -1
- package/dist/cjs/ListItem/ListItemContent.js +1 -1
- package/dist/cjs/ListItem/ListItemContent.js.map +1 -1
- package/dist/cjs/ListItem/index.js +1 -1
- package/dist/cjs/ListItem/index.js.map +1 -1
- package/dist/cjs/ListItemLink/index.js +1 -1
- package/dist/cjs/ListItemLink/index.js.map +1 -1
- package/dist/cjs/ListSkeleton/index.js +1 -1
- package/dist/cjs/ListSkeleton/index.js.map +1 -1
- package/dist/cjs/LogoLink/index.js +1 -1
- package/dist/cjs/LogoLink/index.js.map +1 -1
- package/dist/cjs/Menu/index.js +1 -1
- package/dist/cjs/Menu/index.js.map +1 -1
- package/dist/cjs/Menu/utils/useFocusWithArrows.js.map +1 -1
- package/dist/cjs/MenuDivider/index.js +1 -1
- package/dist/cjs/MenuDivider/index.js.map +1 -1
- package/dist/cjs/MenuGroup/index.js +1 -1
- package/dist/cjs/MenuGroup/index.js.map +1 -1
- package/dist/cjs/MenuItem/index.js +1 -1
- package/dist/cjs/MenuItem/index.js.map +1 -1
- package/dist/cjs/Modal/index.js +1 -1
- package/dist/cjs/Modal/index.js.map +1 -1
- package/dist/cjs/Modal/utils/defaultLocale.js.map +1 -1
- package/dist/cjs/Navigation/index.js +1 -1
- package/dist/cjs/Navigation/index.js.map +1 -1
- package/dist/cjs/Navigation/utils/useScrollFlags.js.map +1 -1
- package/dist/cjs/NavigationItem/index.js +1 -1
- package/dist/cjs/NavigationItem/index.js.map +1 -1
- package/dist/cjs/PageContent/index.js +1 -1
- package/dist/cjs/PageContent/index.js.map +1 -1
- package/dist/cjs/PageHeader/index.js +1 -1
- package/dist/cjs/PageHeader/index.js.map +1 -1
- package/dist/cjs/PageHeader/utils/defaultLocale.js.map +1 -1
- package/dist/cjs/PageHeaderInputSearch/index.js +1 -1
- package/dist/cjs/PageHeaderInputSearch/index.js.map +1 -1
- package/dist/cjs/PageHeaderInputSearch/utils/defaultLocale.js.map +1 -1
- package/dist/cjs/PageHeaderSkeleton/index.js +1 -1
- package/dist/cjs/PageHeaderSkeleton/index.js.map +1 -1
- package/dist/cjs/ParagraphSkeleton/index.js +1 -1
- package/dist/cjs/ParagraphSkeleton/index.js.map +1 -1
- package/dist/cjs/Popover/index.js +1 -1
- package/dist/cjs/Popover/index.js.map +1 -1
- package/dist/cjs/Popover/utils/usePopoverPosition.js.map +1 -1
- package/dist/cjs/Progress/index.js +1 -1
- package/dist/cjs/Progress/index.js.map +1 -1
- package/dist/cjs/RadioGroup/index.js +1 -1
- package/dist/cjs/RadioGroup/index.js.map +1 -1
- package/dist/cjs/RadioGroupSkeleton/index.js +1 -1
- package/dist/cjs/RadioGroupSkeleton/index.js.map +1 -1
- package/dist/cjs/Result/index.js +1 -1
- package/dist/cjs/Result/index.js.map +1 -1
- package/dist/cjs/ScrollButton/index.js +1 -1
- package/dist/cjs/ScrollButton/index.js.map +1 -1
- package/dist/cjs/ScrollButton/utils/useContainerPosition.js.map +1 -1
- package/dist/cjs/ScrollButton/utils/useVisibility.js.map +1 -1
- package/dist/cjs/Select/SelectList.js +3 -5
- package/dist/cjs/Select/SelectList.js.map +1 -1
- package/dist/cjs/Select/SelectToggle.js.map +1 -1
- package/dist/cjs/Select/index.js +1 -1
- package/dist/cjs/Select/index.js.map +1 -1
- package/dist/cjs/Select/utils/defaultLocale.js.map +1 -1
- package/dist/cjs/Skeleton/index.js +1 -1
- package/dist/cjs/Skeleton/index.js.map +1 -1
- package/dist/cjs/Switch/index.js +1 -1
- package/dist/cjs/Switch/index.js.map +1 -1
- package/dist/cjs/SwitchSkeleton/index.js +1 -1
- package/dist/cjs/SwitchSkeleton/index.js.map +1 -1
- package/dist/cjs/Tag/index.js +1 -1
- package/dist/cjs/Tag/index.js.map +1 -1
- package/dist/cjs/TagLink/index.js +1 -1
- package/dist/cjs/TagLink/index.js.map +1 -1
- package/dist/cjs/TagList/index.js +1 -1
- package/dist/cjs/TagList/index.js.map +1 -1
- package/dist/cjs/TagListSkeleton/index.js +1 -1
- package/dist/cjs/TagListSkeleton/index.js.map +1 -1
- package/dist/cjs/TagSkeleton/index.js +1 -1
- package/dist/cjs/TagSkeleton/index.js.map +1 -1
- package/dist/cjs/TextArea/index.js +1 -1
- package/dist/cjs/TextArea/index.js.map +1 -1
- package/dist/cjs/TextAreaSkeleton/index.js +1 -1
- package/dist/cjs/TextAreaSkeleton/index.js.map +1 -1
- package/dist/cjs/ThemeSwitcher/index.js +1 -1
- package/dist/cjs/ThemeSwitcher/index.js.map +1 -1
- package/dist/cjs/YouTubeVideo/index.js +1 -1
- package/dist/cjs/YouTubeVideo/index.js.map +1 -1
- package/dist/cjs/emotion.d.js.map +1 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/message/AlertIcon.js.map +1 -1
- package/dist/cjs/message/Message.js.map +1 -1
- package/dist/cjs/message/index.js.map +1 -1
- package/dist/cjs/message/styles.js.map +1 -1
- package/dist/esm/Alert/index.js +1 -1
- package/dist/esm/Alert/index.js.map +1 -1
- package/dist/esm/Avatar/index.js +1 -1
- package/dist/esm/Avatar/index.js.map +1 -1
- package/dist/esm/Avatar/utils/nameToInitials.js.map +1 -1
- package/dist/esm/Avatar/utils/strToHue.js.map +1 -1
- package/dist/esm/AvatarSkeleton/index.js +1 -1
- package/dist/esm/AvatarSkeleton/index.js.map +1 -1
- package/dist/esm/Breadcrumb/index.js +1 -1
- package/dist/esm/Breadcrumb/index.js.map +1 -1
- package/dist/esm/BreadcrumbItem/index.js +1 -1
- package/dist/esm/BreadcrumbItem/index.js.map +1 -1
- package/dist/esm/Button/ButtonContent.js.map +1 -1
- package/dist/esm/Button/index.js +1 -1
- package/dist/esm/Button/index.js.map +1 -1
- package/dist/esm/Button/utils/useButtonColors.js.map +1 -1
- package/dist/esm/Checkbox/index.js +1 -1
- package/dist/esm/Checkbox/index.js.map +1 -1
- package/dist/esm/CheckboxSkeleton/index.js +1 -1
- package/dist/esm/CheckboxSkeleton/index.js.map +1 -1
- package/dist/esm/DatePicker/DatePickerCalendar.js +1 -1
- package/dist/esm/DatePicker/DatePickerCalendar.js.map +1 -1
- package/dist/esm/DatePicker/index.js +1 -1
- package/dist/esm/DatePicker/index.js.map +1 -1
- package/dist/esm/Drawer/index.js +1 -1
- package/dist/esm/Drawer/index.js.map +1 -1
- package/dist/esm/Form/FormConfigContext.js.map +1 -1
- package/dist/esm/Form/index.js +1 -1
- package/dist/esm/Form/index.js.map +1 -1
- package/dist/esm/FormDivider/index.js +1 -1
- package/dist/esm/FormDivider/index.js.map +1 -1
- package/dist/esm/FormItem/index.js +1 -1
- package/dist/esm/FormItem/index.js.map +1 -1
- package/dist/esm/FormItem/utils/firstChildHasType.js.map +1 -1
- package/dist/esm/GlobalStyles/index.js.map +1 -1
- package/dist/esm/GlobalStyles/resetStyles.js.map +1 -1
- package/dist/esm/GlobalStyles/typographyStyles.js.map +1 -1
- package/dist/esm/HeaderSkeleton/index.js +1 -1
- package/dist/esm/HeaderSkeleton/index.js.map +1 -1
- package/dist/esm/Image/index.js +1 -1
- package/dist/esm/Image/index.js.map +1 -1
- package/dist/esm/ImageSkeleton/index.js +1 -1
- package/dist/esm/ImageSkeleton/index.js.map +1 -1
- package/dist/esm/Input/index.js +1 -1
- package/dist/esm/Input/index.js.map +1 -1
- package/dist/esm/Input/utils/getFocusableElements.js.map +1 -1
- package/dist/esm/InputNumber/index.js +1 -1
- package/dist/esm/InputNumber/index.js.map +1 -1
- package/dist/esm/InputNumber/utils/defaultLocale.js.map +1 -1
- package/dist/esm/InputPassword/index.js +1 -1
- package/dist/esm/InputPassword/index.js.map +1 -1
- package/dist/esm/InputPassword/utils/defaultLocale.js.map +1 -1
- package/dist/esm/InputSearch/index.js +1 -1
- package/dist/esm/InputSearch/index.js.map +1 -1
- package/dist/esm/InputSearch/utils/defaultLocale.js.map +1 -1
- package/dist/esm/InputSkeleton/index.js +1 -1
- package/dist/esm/InputSkeleton/index.js.map +1 -1
- package/dist/esm/Layout/LayoutContext.js.map +1 -1
- package/dist/esm/Layout/index.js.map +1 -1
- package/dist/esm/Link/index.js +1 -1
- package/dist/esm/Link/index.js.map +1 -1
- package/dist/esm/LinkButton/index.js +1 -1
- package/dist/esm/LinkButton/index.js.map +1 -1
- package/dist/esm/List/WindowScroller.js.map +1 -1
- package/dist/esm/List/index.js +4 -6
- package/dist/esm/List/index.js.map +1 -1
- package/dist/esm/List/utils/bodyPointerEvents.js.map +1 -1
- package/dist/esm/List/utils/frameTimeout.js.map +1 -1
- package/dist/esm/List/utils/useRWLoadNext.js.map +1 -1
- package/dist/esm/ListItem/ListItemContent.js +1 -1
- package/dist/esm/ListItem/ListItemContent.js.map +1 -1
- package/dist/esm/ListItem/index.js +1 -1
- package/dist/esm/ListItem/index.js.map +1 -1
- package/dist/esm/ListItemLink/index.js +1 -1
- package/dist/esm/ListItemLink/index.js.map +1 -1
- package/dist/esm/ListSkeleton/index.js +1 -1
- package/dist/esm/ListSkeleton/index.js.map +1 -1
- package/dist/esm/LogoLink/index.js +1 -1
- package/dist/esm/LogoLink/index.js.map +1 -1
- package/dist/esm/Menu/index.js +1 -1
- package/dist/esm/Menu/index.js.map +1 -1
- package/dist/esm/Menu/utils/useFocusWithArrows.js.map +1 -1
- package/dist/esm/MenuDivider/index.js +1 -1
- package/dist/esm/MenuDivider/index.js.map +1 -1
- package/dist/esm/MenuGroup/index.js +1 -1
- package/dist/esm/MenuGroup/index.js.map +1 -1
- package/dist/esm/MenuItem/index.js +1 -1
- package/dist/esm/MenuItem/index.js.map +1 -1
- package/dist/esm/Modal/index.js +1 -1
- package/dist/esm/Modal/index.js.map +1 -1
- package/dist/esm/Modal/utils/defaultLocale.js.map +1 -1
- package/dist/esm/Navigation/index.js +1 -1
- package/dist/esm/Navigation/index.js.map +1 -1
- package/dist/esm/Navigation/utils/useScrollFlags.js.map +1 -1
- package/dist/esm/NavigationItem/index.js +1 -1
- package/dist/esm/NavigationItem/index.js.map +1 -1
- package/dist/esm/PageContent/index.js +1 -1
- package/dist/esm/PageContent/index.js.map +1 -1
- package/dist/esm/PageHeader/index.js +1 -1
- package/dist/esm/PageHeader/index.js.map +1 -1
- package/dist/esm/PageHeader/utils/defaultLocale.js.map +1 -1
- package/dist/esm/PageHeaderInputSearch/index.js +1 -1
- package/dist/esm/PageHeaderInputSearch/index.js.map +1 -1
- package/dist/esm/PageHeaderInputSearch/utils/defaultLocale.js.map +1 -1
- package/dist/esm/PageHeaderSkeleton/index.js +1 -1
- package/dist/esm/PageHeaderSkeleton/index.js.map +1 -1
- package/dist/esm/ParagraphSkeleton/index.js +1 -1
- package/dist/esm/ParagraphSkeleton/index.js.map +1 -1
- package/dist/esm/Popover/index.js +1 -1
- package/dist/esm/Popover/index.js.map +1 -1
- package/dist/esm/Popover/utils/usePopoverPosition.js.map +1 -1
- package/dist/esm/Progress/index.js +1 -1
- package/dist/esm/Progress/index.js.map +1 -1
- package/dist/esm/RadioGroup/index.js +1 -1
- package/dist/esm/RadioGroup/index.js.map +1 -1
- package/dist/esm/RadioGroupSkeleton/index.js +1 -1
- package/dist/esm/RadioGroupSkeleton/index.js.map +1 -1
- package/dist/esm/Result/index.js +1 -1
- package/dist/esm/Result/index.js.map +1 -1
- package/dist/esm/ScrollButton/index.js +1 -1
- package/dist/esm/ScrollButton/index.js.map +1 -1
- package/dist/esm/ScrollButton/utils/useContainerPosition.js.map +1 -1
- package/dist/esm/ScrollButton/utils/useVisibility.js.map +1 -1
- package/dist/esm/Select/SelectList.js +5 -7
- package/dist/esm/Select/SelectList.js.map +1 -1
- package/dist/esm/Select/SelectToggle.js.map +1 -1
- package/dist/esm/Select/index.js +1 -1
- package/dist/esm/Select/index.js.map +1 -1
- package/dist/esm/Select/utils/defaultLocale.js.map +1 -1
- package/dist/esm/Skeleton/index.js +1 -1
- package/dist/esm/Skeleton/index.js.map +1 -1
- package/dist/esm/Switch/index.js +1 -1
- package/dist/esm/Switch/index.js.map +1 -1
- package/dist/esm/SwitchSkeleton/index.js +1 -1
- package/dist/esm/SwitchSkeleton/index.js.map +1 -1
- package/dist/esm/Tag/index.js +1 -1
- package/dist/esm/Tag/index.js.map +1 -1
- package/dist/esm/TagLink/index.js +1 -1
- package/dist/esm/TagLink/index.js.map +1 -1
- package/dist/esm/TagList/index.js +1 -1
- package/dist/esm/TagList/index.js.map +1 -1
- package/dist/esm/TagListSkeleton/index.js +1 -1
- package/dist/esm/TagListSkeleton/index.js.map +1 -1
- package/dist/esm/TagSkeleton/index.js +1 -1
- package/dist/esm/TagSkeleton/index.js.map +1 -1
- package/dist/esm/TextArea/index.js +1 -1
- package/dist/esm/TextArea/index.js.map +1 -1
- package/dist/esm/TextAreaSkeleton/index.js +1 -1
- package/dist/esm/TextAreaSkeleton/index.js.map +1 -1
- package/dist/esm/ThemeSwitcher/index.js +1 -1
- package/dist/esm/ThemeSwitcher/index.js.map +1 -1
- package/dist/esm/YouTubeVideo/index.js +1 -1
- package/dist/esm/YouTubeVideo/index.js.map +1 -1
- package/dist/esm/emotion.d.js.map +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/message/AlertIcon.js.map +1 -1
- package/dist/esm/message/Message.js.map +1 -1
- package/dist/esm/message/index.js.map +1 -1
- package/dist/esm/message/styles.js.map +1 -1
- package/dist/types/AvatarSkeleton/index.d.ts +1 -1
- package/dist/types/AvatarSkeleton/index.d.ts.map +1 -1
- package/dist/types/Button/index.d.ts +2 -2
- package/dist/types/Button/index.d.ts.map +1 -1
- package/dist/types/CheckboxSkeleton/index.d.ts +1 -1
- package/dist/types/CheckboxSkeleton/index.d.ts.map +1 -1
- package/dist/types/ImageSkeleton/index.d.ts +1 -1
- package/dist/types/ImageSkeleton/index.d.ts.map +1 -1
- package/dist/types/Input/index.d.ts +4 -3
- package/dist/types/Input/index.d.ts.map +1 -1
- package/dist/types/InputSkeleton/index.d.ts +1 -1
- package/dist/types/InputSkeleton/index.d.ts.map +1 -1
- package/dist/types/LinkButton/index.d.ts +268 -1
- package/dist/types/LinkButton/index.d.ts.map +1 -1
- package/dist/types/List/index.d.ts.map +1 -1
- package/dist/types/ListItem/ListItemContent.d.ts +2 -2
- package/dist/types/ListItem/index.d.ts +2 -2
- package/dist/types/ListItem/index.d.ts.map +1 -1
- package/dist/types/ListItemLink/index.d.ts +1 -1
- package/dist/types/ListItemLink/index.d.ts.map +1 -1
- package/dist/types/MenuDivider/index.d.ts +1 -1
- package/dist/types/MenuDivider/index.d.ts.map +1 -1
- package/dist/types/Modal/index.d.ts +3 -2
- package/dist/types/Modal/index.d.ts.map +1 -1
- package/dist/types/PageHeader/index.d.ts +1 -1
- package/dist/types/ScrollButton/utils/useContainerPosition.d.ts +1 -1
- package/dist/types/ScrollButton/utils/useContainerPosition.d.ts.map +1 -1
- package/dist/types/Select/SelectList.d.ts.map +1 -1
- package/dist/types/Select/SelectToggle.d.ts +7 -6
- package/dist/types/Select/SelectToggle.d.ts.map +1 -1
- package/dist/types/Select/index.d.ts +5 -2
- package/dist/types/Select/index.d.ts.map +1 -1
- package/dist/types/SwitchSkeleton/index.d.ts +1 -1
- package/dist/types/SwitchSkeleton/index.d.ts.map +1 -1
- package/dist/types/Tag/index.d.ts +4 -4
- package/dist/types/Tag/index.d.ts.map +1 -1
- package/dist/types/TagLink/index.d.ts +1 -1
- package/dist/types/TagLink/index.d.ts.map +1 -1
- package/dist/types/TextAreaSkeleton/index.d.ts +1 -1
- package/dist/types/TextAreaSkeleton/index.d.ts.map +1 -1
- package/dist/types/ThemeSwitcher/index.d.ts +268 -1
- package/dist/types/ThemeSwitcher/index.d.ts.map +1 -1
- package/package.json +5 -5
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/PageHeader/index.tsx"],"names":["getReducedPadding","p","isMinSm","i","padding","theme","horizontalPadding","buttonPaddingHorizontal","horizontalPaddingStyles","reducedPadding","reducedPaddingSm","css","leftIsGhostButton","rightIsGhostButton","m","min","sm","hasNavigationIndentStyles","hasNavigationIndent","md","navigationSideWidth","PageHeaderContainer","pageHeaderHeight","pageHeaderColorBg","pageHeaderColorText","pageHeaderColorBorder","BackButton","Button","Content","styled","div","notHasSubtitleStyles","hasSubtitle","sizes","large","Title","ellipsisStyles","Subtitle","small","pageHeaderSubtitleColorText","Addon","LeftAddon","pageHeaderAddonPaddingHorizontal","RightAddon","PageHeader","ref","title","subtitle","left","right","onBack","locale","defaultLocale","rest","LayoutContext","hasNavigation","t","pageHeaderButtonPaddingHorizontal","backLabel","displayName"],"mappings":"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","sourcesContent":["import React, { forwardRef, useContext } from 'react';\nimport { ellipsisStyles } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport styled from '@emotion/styled';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { m } from '@os-design/media';\nimport { Left } from '@os-design/icons';\nimport { css } from '@emotion/react';\nimport Button from '../Button';\nimport LayoutContext from '../Layout/LayoutContext';\nimport defaultLocale, { PageHeaderLocale } from './utils/defaultLocale';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface PageHeaderProps extends JsxDivProps {\n /**\n * The title of the page.\n * @default undefined\n */\n title: string;\n /**\n * The subtitle of the page.\n * @default undefined\n */\n subtitle?: string;\n /**\n * The component located on the left side.\n * @default undefined\n */\n left?: React.ReactNode;\n /**\n * Reduces the left padding of the page header.\n * @default false\n */\n leftIsGhostButton?: boolean;\n /**\n * The component located on the right side.\n * @default undefined\n */\n right?: React.ReactNode;\n /**\n * Reduces the right padding of the page header.\n * @default false\n */\n rightIsGhostButton?: boolean;\n /**\n * The back event handler. If passed, the page header has the back button.\n * @default undefined\n */\n onBack?: () => void;\n /**\n * The locale.\n * @default undefined\n */\n locale?: PageHeaderLocale;\n}\n\nconst getReducedPadding = (p, isMinSm: boolean) => {\n const i = isMinSm ? 1 : 0;\n let padding = p.theme.horizontalPadding[i] - p.theme.buttonPaddingHorizontal;\n if (padding < 0) padding = 0;\n return padding;\n};\n\nconst horizontalPaddingStyles = (p) => {\n const reducedPadding = getReducedPadding(p, false);\n const reducedPaddingSm = getReducedPadding(p, true);\n return css`\n padding-left: ${p.leftIsGhostButton\n ? reducedPadding\n : p.theme.horizontalPadding[0]}em;\n padding-right: ${p.rightIsGhostButton\n ? reducedPadding\n : p.theme.horizontalPadding[0]}em;\n\n ${m.min.sm} {\n padding-left: ${p.leftIsGhostButton\n ? reducedPaddingSm\n : p.theme.horizontalPadding[1]}em;\n padding-right: ${p.rightIsGhostButton\n ? reducedPaddingSm\n : p.theme.horizontalPadding[1]}em;\n }\n `;\n};\n\nconst hasNavigationIndentStyles = (p) =>\n p.hasNavigationIndent &&\n css`\n ${m.min.md} {\n left: ${p.theme.navigationSideWidth}em;\n }\n `;\n\ninterface ContainerProps {\n leftIsGhostButton?: boolean;\n rightIsGhostButton?: boolean;\n hasNavigationIndent?: boolean;\n}\nexport const PageHeaderContainer = styled(\n 'div',\n omitEmotionProps(\n 'leftIsGhostButton',\n 'rightIsGhostButton',\n 'hasNavigationIndent'\n )\n)<ContainerProps>`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n\n height: ${(p) => p.theme.pageHeaderHeight[0]}em;\n ${m.min.md} {\n height: ${(p) => p.theme.pageHeaderHeight[1]}em;\n }\n\n display: flex;\n align-items: center;\n box-sizing: border-box;\n z-index: 101;\n\n background-color: ${(p) => clr(p.theme.pageHeaderColorBg)};\n color: ${(p) => clr(p.theme.pageHeaderColorText)};\n border-bottom: 1px solid ${(p) => clr(p.theme.pageHeaderColorBorder)};\n\n ${horizontalPaddingStyles};\n ${hasNavigationIndentStyles};\n`;\n\nconst BackButton = styled(Button)`\n margin-right: 0.2em;\n flex-shrink: 0;\n`;\n\nconst Content = styled.div`\n overflow: hidden; // For ellipsis\n`;\n\nconst notHasSubtitleStyles = (p) =>\n !p.hasSubtitle &&\n css`\n font-size: ${p.theme.sizes.large}em;\n `;\n\ninterface TitleProps {\n hasSubtitle: boolean;\n}\nconst Title = styled('h1', omitEmotionProps('hasSubtitle'))<TitleProps>`\n margin: 0;\n font-size: 1em;\n font-weight: 500;\n line-height: 1.2;\n ${notHasSubtitleStyles};\n ${ellipsisStyles};\n`;\n\nconst Subtitle = styled.div`\n font-size: ${(p) => p.theme.sizes.small}em;\n color: ${(p) => clr(p.theme.pageHeaderSubtitleColorText)};\n line-height: 1;\n margin-top: 0.2em;\n ${ellipsisStyles};\n`;\n\nconst Addon = styled.div`\n display: flex;\n align-items: center;\n`;\n\nconst LeftAddon = styled(Addon)`\n padding-right: ${(p) => p.theme.pageHeaderAddonPaddingHorizontal}em;\n`;\n\nconst RightAddon = styled(Addon)`\n padding-left: ${(p) => p.theme.pageHeaderAddonPaddingHorizontal}em;\n margin-left: auto;\n\n display: grid;\n grid-auto-flow: column;\n grid-column-gap: 0.4em;\n`;\n\n/**\n * The header of the page.\n */\nconst PageHeader = forwardRef<HTMLDivElement, PageHeaderProps>(\n (\n {\n title,\n subtitle,\n left,\n leftIsGhostButton = false,\n right,\n rightIsGhostButton = false,\n onBack,\n locale = defaultLocale,\n ...rest\n },\n ref\n ) => {\n const { hasNavigation } = useContext(LayoutContext);\n\n return (\n <ThemeOverrider\n overrides={(t) => ({\n buttonPaddingHorizontal: t.pageHeaderButtonPaddingHorizontal,\n })}\n >\n <PageHeaderContainer\n leftIsGhostButton={leftIsGhostButton || !!onBack}\n rightIsGhostButton={rightIsGhostButton}\n hasNavigationIndent={hasNavigation}\n {...rest}\n ref={ref}\n >\n {onBack && (\n <BackButton\n type='ghost'\n wide='never'\n onClick={onBack}\n aria-label={locale.backLabel}\n >\n <Left />\n </BackButton>\n )}\n\n {left && <LeftAddon>{left}</LeftAddon>}\n\n <Content>\n <Title hasSubtitle={!!subtitle}>{title}</Title>\n {subtitle && <Subtitle>{subtitle}</Subtitle>}\n </Content>\n\n {right && <RightAddon>{right}</RightAddon>}\n </PageHeaderContainer>\n </ThemeOverrider>\n );\n }\n);\n\nPageHeader.displayName = 'PageHeader';\n\nexport default PageHeader;\n"],"file":"index.js"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["getReducedPadding","p","isMinSm","i","padding","theme","horizontalPadding","buttonPaddingHorizontal","horizontalPaddingStyles","reducedPadding","reducedPaddingSm","css","leftIsGhostButton","rightIsGhostButton","m","min","sm","hasNavigationIndentStyles","hasNavigationIndent","md","navigationSideWidth","PageHeaderContainer","styled","omitEmotionProps","pageHeaderHeight","clr","pageHeaderColorBg","pageHeaderColorText","pageHeaderColorBorder","BackButton","Button","Content","div","notHasSubtitleStyles","hasSubtitle","sizes","large","Title","ellipsisStyles","Subtitle","small","pageHeaderSubtitleColorText","Addon","LeftAddon","pageHeaderAddonPaddingHorizontal","RightAddon","PageHeader","forwardRef","ref","title","subtitle","left","right","onBack","locale","defaultLocale","rest","useContext","LayoutContext","hasNavigation","t","pageHeaderButtonPaddingHorizontal","backLabel","displayName"],"sources":["../../../src/PageHeader/index.tsx"],"sourcesContent":["import React, { forwardRef, useContext } from 'react';\nimport { ellipsisStyles } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport styled from '@emotion/styled';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { m } from '@os-design/media';\nimport { Left } from '@os-design/icons';\nimport { css } from '@emotion/react';\nimport Button from '../Button';\nimport LayoutContext from '../Layout/LayoutContext';\nimport defaultLocale, { PageHeaderLocale } from './utils/defaultLocale';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface PageHeaderProps extends JsxDivProps {\n /**\n * The title of the page.\n * @default undefined\n */\n title: string;\n /**\n * The subtitle of the page.\n * @default undefined\n */\n subtitle?: string;\n /**\n * The component located on the left side.\n * @default undefined\n */\n left?: React.ReactNode;\n /**\n * Reduces the left padding of the page header.\n * @default false\n */\n leftIsGhostButton?: boolean;\n /**\n * The component located on the right side.\n * @default undefined\n */\n right?: React.ReactNode;\n /**\n * Reduces the right padding of the page header.\n * @default false\n */\n rightIsGhostButton?: boolean;\n /**\n * The back event handler. If passed, the page header has the back button.\n * @default undefined\n */\n onBack?: () => void;\n /**\n * The locale.\n * @default undefined\n */\n locale?: PageHeaderLocale;\n}\n\nconst getReducedPadding = (p, isMinSm: boolean) => {\n const i = isMinSm ? 1 : 0;\n let padding = p.theme.horizontalPadding[i] - p.theme.buttonPaddingHorizontal;\n if (padding < 0) padding = 0;\n return padding;\n};\n\nconst horizontalPaddingStyles = (p) => {\n const reducedPadding = getReducedPadding(p, false);\n const reducedPaddingSm = getReducedPadding(p, true);\n return css`\n padding-left: ${p.leftIsGhostButton\n ? reducedPadding\n : p.theme.horizontalPadding[0]}em;\n padding-right: ${p.rightIsGhostButton\n ? reducedPadding\n : p.theme.horizontalPadding[0]}em;\n\n ${m.min.sm} {\n padding-left: ${p.leftIsGhostButton\n ? reducedPaddingSm\n : p.theme.horizontalPadding[1]}em;\n padding-right: ${p.rightIsGhostButton\n ? reducedPaddingSm\n : p.theme.horizontalPadding[1]}em;\n }\n `;\n};\n\nconst hasNavigationIndentStyles = (p) =>\n p.hasNavigationIndent &&\n css`\n ${m.min.md} {\n left: ${p.theme.navigationSideWidth}em;\n }\n `;\n\ninterface ContainerProps {\n leftIsGhostButton?: boolean;\n rightIsGhostButton?: boolean;\n hasNavigationIndent?: boolean;\n}\nexport const PageHeaderContainer = styled(\n 'div',\n omitEmotionProps(\n 'leftIsGhostButton',\n 'rightIsGhostButton',\n 'hasNavigationIndent'\n )\n)<ContainerProps>`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n\n height: ${(p) => p.theme.pageHeaderHeight[0]}em;\n ${m.min.md} {\n height: ${(p) => p.theme.pageHeaderHeight[1]}em;\n }\n\n display: flex;\n align-items: center;\n box-sizing: border-box;\n z-index: 101;\n\n background-color: ${(p) => clr(p.theme.pageHeaderColorBg)};\n color: ${(p) => clr(p.theme.pageHeaderColorText)};\n border-bottom: 1px solid ${(p) => clr(p.theme.pageHeaderColorBorder)};\n\n ${horizontalPaddingStyles};\n ${hasNavigationIndentStyles};\n`;\n\nconst BackButton = styled(Button)`\n margin-right: 0.2em;\n flex-shrink: 0;\n`;\n\nconst Content = styled.div`\n overflow: hidden; // For ellipsis\n`;\n\nconst notHasSubtitleStyles = (p) =>\n !p.hasSubtitle &&\n css`\n font-size: ${p.theme.sizes.large}em;\n `;\n\ninterface TitleProps {\n hasSubtitle: boolean;\n}\nconst Title = styled('h1', omitEmotionProps('hasSubtitle'))<TitleProps>`\n margin: 0;\n font-size: 1em;\n font-weight: 500;\n line-height: 1.2;\n ${notHasSubtitleStyles};\n ${ellipsisStyles};\n`;\n\nconst Subtitle = styled.div`\n font-size: ${(p) => p.theme.sizes.small}em;\n color: ${(p) => clr(p.theme.pageHeaderSubtitleColorText)};\n line-height: 1;\n margin-top: 0.2em;\n ${ellipsisStyles};\n`;\n\nconst Addon = styled.div`\n display: flex;\n align-items: center;\n`;\n\nconst LeftAddon = styled(Addon)`\n padding-right: ${(p) => p.theme.pageHeaderAddonPaddingHorizontal}em;\n`;\n\nconst RightAddon = styled(Addon)`\n padding-left: ${(p) => p.theme.pageHeaderAddonPaddingHorizontal}em;\n margin-left: auto;\n\n display: grid;\n grid-auto-flow: column;\n grid-column-gap: 0.4em;\n`;\n\n/**\n * The header of the page.\n */\nconst PageHeader = forwardRef<HTMLDivElement, PageHeaderProps>(\n (\n {\n title,\n subtitle,\n left,\n leftIsGhostButton = false,\n right,\n rightIsGhostButton = false,\n onBack,\n locale = defaultLocale,\n ...rest\n },\n ref\n ) => {\n const { hasNavigation } = useContext(LayoutContext);\n\n return (\n <ThemeOverrider\n overrides={(t) => ({\n buttonPaddingHorizontal: t.pageHeaderButtonPaddingHorizontal,\n })}\n >\n <PageHeaderContainer\n leftIsGhostButton={leftIsGhostButton || !!onBack}\n rightIsGhostButton={rightIsGhostButton}\n hasNavigationIndent={hasNavigation}\n {...rest}\n ref={ref}\n >\n {onBack && (\n <BackButton\n type='ghost'\n wide='never'\n onClick={onBack}\n aria-label={locale.backLabel}\n >\n <Left />\n </BackButton>\n )}\n\n {left && <LeftAddon>{left}</LeftAddon>}\n\n <Content>\n <Title hasSubtitle={!!subtitle}>{title}</Title>\n {subtitle && <Subtitle>{subtitle}</Subtitle>}\n </Content>\n\n {right && <RightAddon>{right}</RightAddon>}\n </PageHeaderContainer>\n </ThemeOverrider>\n );\n }\n);\n\nPageHeader.displayName = 'PageHeader';\n\nexport default PageHeader;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;AA8CA,IAAMA,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,CAAD,EAAIC,OAAJ,EAAyB;EACjD,IAAMC,CAAC,GAAGD,OAAO,GAAG,CAAH,GAAO,CAAxB;EACA,IAAIE,OAAO,GAAGH,CAAC,CAACI,KAAF,CAAQC,iBAAR,CAA0BH,CAA1B,IAA+BF,CAAC,CAACI,KAAF,CAAQE,uBAArD;EACA,IAAIH,OAAO,GAAG,CAAd,EAAiBA,OAAO,GAAG,CAAV;EACjB,OAAOA,OAAP;AACD,CALD;;AAOA,IAAMI,uBAAuB,GAAG,SAA1BA,uBAA0B,CAACP,CAAD,EAAO;EACrC,IAAMQ,cAAc,GAAGT,iBAAiB,CAACC,CAAD,EAAI,KAAJ,CAAxC;EACA,IAAMS,gBAAgB,GAAGV,iBAAiB,CAACC,CAAD,EAAI,IAAJ,CAA1C;EACA,WAAOU,WAAP,kNACkBV,CAAC,CAACW,iBAAF,GACZH,cADY,GAEZR,CAAC,CAACI,KAAF,CAAQC,iBAAR,CAA0B,CAA1B,CAHN,EAImBL,CAAC,CAACY,kBAAF,GACbJ,cADa,GAEbR,CAAC,CAACI,KAAF,CAAQC,iBAAR,CAA0B,CAA1B,CANN,EAQIQ,QAAA,CAAEC,GAAF,CAAMC,EARV,EASoBf,CAAC,CAACW,iBAAF,GACZF,gBADY,GAEZT,CAAC,CAACI,KAAF,CAAQC,iBAAR,CAA0B,CAA1B,CAXR,EAYqBL,CAAC,CAACY,kBAAF,GACbH,gBADa,GAEbT,CAAC,CAACI,KAAF,CAAQC,iBAAR,CAA0B,CAA1B,CAdR;AAiBD,CApBD;;AAsBA,IAAMW,yBAAyB,GAAG,SAA5BA,yBAA4B,CAAChB,CAAD;EAAA,OAChCA,CAAC,CAACiB,mBAAF,QACAP,WADA,qHAEIG,QAAA,CAAEC,GAAF,CAAMI,EAFV,EAGYlB,CAAC,CAACI,KAAF,CAAQe,mBAHpB,CADgC;AAAA,CAAlC;;AAaO,IAAMC,mBAAmB,GAAG,IAAAC,kBAAA,EACjC,KADiC,EAEjC,IAAAC,uBAAA,EACE,mBADF,EAEE,oBAFF,EAGE,qBAHF,CAFiC,CAAH,sXAapB,UAACtB,CAAD;EAAA,OAAOA,CAAC,CAACI,KAAF,CAAQmB,gBAAR,CAAyB,CAAzB,CAAP;AAAA,CAboB,EAc5BV,QAAA,CAAEC,GAAF,CAAMI,EAdsB,EAelB,UAAClB,CAAD;EAAA,OAAOA,CAAC,CAACI,KAAF,CAAQmB,gBAAR,CAAyB,CAAzB,CAAP;AAAA,CAfkB,EAuBV,UAACvB,CAAD;EAAA,OAAO,IAAAwB,YAAA,EAAIxB,CAAC,CAACI,KAAF,CAAQqB,iBAAZ,CAAP;AAAA,CAvBU,EAwBrB,UAACzB,CAAD;EAAA,OAAO,IAAAwB,YAAA,EAAIxB,CAAC,CAACI,KAAF,CAAQsB,mBAAZ,CAAP;AAAA,CAxBqB,EAyBH,UAAC1B,CAAD;EAAA,OAAO,IAAAwB,YAAA,EAAIxB,CAAC,CAACI,KAAF,CAAQuB,qBAAZ,CAAP;AAAA,CAzBG,EA2B5BpB,uBA3B4B,EA4B5BS,yBA5B4B,CAAzB;;AA+BP,IAAMY,UAAU,GAAG,IAAAP,kBAAA,EAAOQ,kBAAP,CAAH,oHAAhB;;AAKA,IAAMC,OAAO,GAAGT,kBAAA,CAAOU,GAAV,8GAAb;;AAIA,IAAMC,oBAAoB,GAAG,SAAvBA,oBAAuB,CAAChC,CAAD;EAAA,OAC3B,CAACA,CAAC,CAACiC,WAAH,QACAvB,WADA,qGAEeV,CAAC,CAACI,KAAF,CAAQ8B,KAAR,CAAcC,KAF7B,CAD2B;AAAA,CAA7B;;AASA,IAAMC,KAAK,GAAG,IAAAf,kBAAA,EAAO,IAAP,EAAa,IAAAC,uBAAA,EAAiB,aAAjB,CAAb,CAAH,uKAKPU,oBALO,EAMPK,sBANO,CAAX;;AASA,IAAMC,QAAQ,GAAGjB,kBAAA,CAAOU,GAAV,kKACC,UAAC/B,CAAD;EAAA,OAAOA,CAAC,CAACI,KAAF,CAAQ8B,KAAR,CAAcK,KAArB;AAAA,CADD,EAEH,UAACvC,CAAD;EAAA,OAAO,IAAAwB,YAAA,EAAIxB,CAAC,CAACI,KAAF,CAAQoC,2BAAZ,CAAP;AAAA,CAFG,EAKVH,sBALU,CAAd;;AAQA,IAAMI,KAAK,GAAGpB,kBAAA,CAAOU,GAAV,mHAAX;;AAKA,IAAMW,SAAS,GAAG,IAAArB,kBAAA,EAAOoB,KAAP,CAAH,sGACI,UAACzC,CAAD;EAAA,OAAOA,CAAC,CAACI,KAAF,CAAQuC,gCAAf;AAAA,CADJ,CAAf;AAIA,IAAMC,UAAU,GAAG,IAAAvB,kBAAA,EAAOoB,KAAP,CAAH,qMACE,UAACzC,CAAD;EAAA,OAAOA,CAAC,CAACI,KAAF,CAAQuC,gCAAf;AAAA,CADF,CAAhB;AASA;AACA;AACA;;AACA,IAAME,UAAU,gBAAG,IAAAC,iBAAA,EACjB,gBAYEC,GAZF,EAaK;EAAA,IAXDC,KAWC,QAXDA,KAWC;EAAA,IAVDC,QAUC,QAVDA,QAUC;EAAA,IATDC,IASC,QATDA,IASC;EAAA,iCARDvC,iBAQC;EAAA,IARDA,iBAQC,sCARmB,KAQnB;EAAA,IAPDwC,KAOC,QAPDA,KAOC;EAAA,iCANDvC,kBAMC;EAAA,IANDA,kBAMC,sCANoB,KAMpB;EAAA,IALDwC,MAKC,QALDA,MAKC;EAAA,uBAJDC,MAIC;EAAA,IAJDA,MAIC,4BAJQC,yBAIR;EAAA,IAHEC,IAGF;;EACH,kBAA0B,IAAAC,iBAAA,EAAWC,yBAAX,CAA1B;EAAA,IAAQC,aAAR,eAAQA,aAAR;;EAEA,oBACE,gCAAC,uBAAD;IACE,SAAS,EAAE,mBAACC,CAAD;MAAA,OAAQ;QACjBrD,uBAAuB,EAAEqD,CAAC,CAACC;MADV,CAAR;IAAA;EADb,gBAKE,gCAAC,mBAAD;IACE,iBAAiB,EAAEjD,iBAAiB,IAAI,CAAC,CAACyC,MAD5C;IAEE,kBAAkB,EAAExC,kBAFtB;IAGE,mBAAmB,EAAE8C;EAHvB,GAIMH,IAJN;IAKE,GAAG,EAAER;EALP,IAOGK,MAAM,iBACL,gCAAC,UAAD;IACE,IAAI,EAAC,OADP;IAEE,IAAI,EAAC,OAFP;IAGE,OAAO,EAAEA,MAHX;IAIE,cAAYC,MAAM,CAACQ;EAJrB,gBAME,gCAAC,WAAD,OANF,CARJ,EAkBGX,IAAI,iBAAI,gCAAC,SAAD,QAAYA,IAAZ,CAlBX,eAoBE,gCAAC,OAAD,qBACE,gCAAC,KAAD;IAAO,WAAW,EAAE,CAAC,CAACD;EAAtB,GAAiCD,KAAjC,CADF,EAEGC,QAAQ,iBAAI,gCAAC,QAAD,QAAWA,QAAX,CAFf,CApBF,EAyBGE,KAAK,iBAAI,gCAAC,UAAD,QAAaA,KAAb,CAzBZ,CALF,CADF;AAmCD,CApDgB,CAAnB;AAuDAN,UAAU,CAACiB,WAAX,GAAyB,YAAzB;eAEejB,U"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"defaultLocale.js","names":["defaultLocale","backLabel"],"sources":["../../../../src/PageHeader/utils/defaultLocale.ts"],"sourcesContent":["export interface PageHeaderLocale {\n backLabel: string;\n}\n\nconst defaultLocale: PageHeaderLocale = {\n backLabel: 'Back',\n};\n\nexport default defaultLocale;\n"],"mappings":";;;;;;AAIA,IAAMA,aAA+B,GAAG;EACtCC,SAAS,EAAE;AAD2B,CAAxC;eAIeD,a"}
|
|
@@ -39,7 +39,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
39
39
|
|
|
40
40
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
41
41
|
|
|
42
|
-
function _extends() { _extends = Object.assign
|
|
42
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
43
43
|
|
|
44
44
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
45
45
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.js","names":["fadeIn","keyframes","fadeOut","visibleStyles","p","visible","css","theme","transitionDelay","invisibleStyles","Container","styled","PageHeaderContainer","omitEmotionProps","CloseButton","Button","pageHeaderAddonPaddingHorizontal","PageHeaderInputSearch","forwardRef","ref","locale","defaultLocale","onClose","rest","useState","setVisible","useTheme","mounted","useClosable","useContext","LayoutContext","hasNavigation","searchLabel","t","buttonPaddingHorizontal","pageHeaderButtonPaddingHorizontal","closeLabel","displayName"],"sources":["../../../src/PageHeaderInputSearch/index.tsx"],"sourcesContent":["import React, { forwardRef, useContext, useState } from 'react';\nimport { Close, Search } from '@os-design/icons';\nimport styled from '@emotion/styled';\nimport { useClosable, omitEmotionProps } from '@os-design/utils';\nimport { ThemeOverrider, useTheme } from '@os-design/theming';\nimport { css, keyframes } from '@emotion/react';\nimport InputSearch, { InputSearchProps } from '../InputSearch';\nimport Button from '../Button';\nimport { PageHeaderContainer } from '../PageHeader';\nimport LayoutContext from '../Layout/LayoutContext';\nimport defaultLocale, {\n PageHeaderInputSearchLocale,\n} from './utils/defaultLocale';\n\nexport interface PageHeaderInputSearchProps\n extends Omit<InputSearchProps, 'size' | 'locale'> {\n /**\n * The locale.\n * @default undefined\n */\n locale?: PageHeaderInputSearchLocale;\n /**\n * The close event handler.\n * @default undefined\n */\n onClose?: () => void;\n}\n\nconst fadeIn = keyframes`\n from { transform: translateY(-100%); }\n to { transform: translateY(0); }\n`;\n\nconst fadeOut = keyframes`\n from { transform: translateY(0); }\n to { transform: translateY(-100%); }\n`;\n\nconst visibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${fadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst invisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${fadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ninterface ContainerProps {\n visible: boolean;\n}\nconst Container = styled(\n PageHeaderContainer,\n omitEmotionProps('visible')\n)<ContainerProps>`\n z-index: 102; // After PageHeaderContainer\n ${visibleStyles};\n ${invisibleStyles};\n`;\n\nconst CloseButton = styled(Button)`\n margin-left: ${(p) => p.theme.pageHeaderAddonPaddingHorizontal}em;\n`;\n\n/**\n * The search input for the page header.\n */\nconst PageHeaderInputSearch = forwardRef<\n HTMLInputElement,\n PageHeaderInputSearchProps\n>(({ locale = defaultLocale, onClose = () => {}, ...rest }, ref) => {\n const [visible, setVisible] = useState(false);\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n const { hasNavigation } = useContext(LayoutContext);\n\n return (\n <>\n <Button\n type='ghost'\n wide='never'\n onClick={() => setVisible(true)}\n aria-label={locale.searchLabel}\n >\n <Search />\n </Button>\n\n {mounted && (\n <ThemeOverrider\n overrides={(t) => ({\n buttonPaddingHorizontal: t.pageHeaderButtonPaddingHorizontal,\n })}\n >\n <Container\n visible={visible}\n rightIsGhostButton\n hasNavigationIndent={hasNavigation}\n >\n <InputSearch autoFocus locale={locale} {...rest} ref={ref} />\n <CloseButton\n type='ghost'\n wide='never'\n onClick={() => {\n setVisible(false);\n onClose();\n }}\n aria-label={locale.closeLabel}\n >\n <Close />\n </CloseButton>\n </Container>\n </ThemeOverrider>\n )}\n </>\n );\n});\n\nPageHeaderInputSearch.displayName = 'PageHeaderInputSearch';\n\nexport default PageHeaderInputSearch;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,IAAMA,MAAM,OAAGC,iBAAH,sJAAZ;AAKA,IAAMC,OAAO,OAAGD,iBAAH,wJAAb;;AAKA,IAAME,aAAa,GAAG,SAAhBA,aAAgB,CAACC,CAAD;EAAA,OACpBA,CAAC,CAACC,OAAF,QACAC,WADA,mHAEeN,MAFf,EAEyBI,CAAC,CAACG,KAAF,CAAQC,eAFjC,CADoB;AAAA,CAAtB;;AAMA,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,CAACL,CAAD;EAAA,OACtB,CAACA,CAAC,CAACC,OAAH,QACAC,WADA,mHAEeJ,OAFf,EAE0BE,CAAC,CAACG,KAAF,CAAQC,eAFlC,CADsB;AAAA,CAAxB;;AASA,IAAME,SAAS,GAAG,IAAAC,kBAAA,EAChBC,+BADgB,EAEhB,IAAAC,uBAAA,EAAiB,SAAjB,CAFgB,CAAH,0IAKXV,aALW,EAMXM,eANW,CAAf;AASA,IAAMK,WAAW,GAAG,IAAAH,kBAAA,EAAOI,kBAAP,CAAH,kGACA,UAACX,CAAD;EAAA,OAAOA,CAAC,CAACG,KAAF,CAAQS,gCAAf;AAAA,CADA,CAAjB;AAIA;AACA;AACA;;AACA,IAAMC,qBAAqB,gBAAG,IAAAC,iBAAA,EAG5B,gBAA0DC,GAA1D,EAAkE;EAAA,uBAA/DC,MAA+D;EAAA,IAA/DA,MAA+D,4BAAtDC,yBAAsD;EAAA,wBAAvCC,OAAuC;EAAA,IAAvCA,OAAuC,6BAA7B,YAAM,CAAE,CAAqB;EAAA,IAAhBC,IAAgB;;EAClE,gBAA8B,IAAAC,eAAA,EAAS,KAAT,CAA9B;EAAA;EAAA,IAAOnB,OAAP;EAAA,IAAgBoB,UAAhB;;EACA,gBAAkB,IAAAC,iBAAA,GAAlB;EAAA,IAAQnB,KAAR,aAAQA,KAAR;;EACA,IAAMoB,OAAO,GAAG,IAAAC,kBAAA,EAAYvB,OAAZ,EAAqBE,KAAK,CAACC,eAA3B,CAAhB;;EACA,kBAA0B,IAAAqB,iBAAA,EAAWC,yBAAX,CAA1B;EAAA,IAAQC,aAAR,eAAQA,aAAR;;EAEA,oBACE,+EACE,gCAAC,kBAAD;IACE,IAAI,EAAC,OADP;IAEE,IAAI,EAAC,OAFP;IAGE,OAAO,EAAE;MAAA,OAAMN,UAAU,CAAC,IAAD,CAAhB;IAAA,CAHX;IAIE,cAAYL,MAAM,CAACY;EAJrB,gBAME,gCAAC,aAAD,OANF,CADF,EAUGL,OAAO,iBACN,gCAAC,uBAAD;IACE,SAAS,EAAE,mBAACM,CAAD;MAAA,OAAQ;QACjBC,uBAAuB,EAAED,CAAC,CAACE;MADV,CAAR;IAAA;EADb,gBAKE,gCAAC,SAAD;IACE,OAAO,EAAE9B,OADX;IAEE,kBAAkB,MAFpB;IAGE,mBAAmB,EAAE0B;EAHvB,gBAKE,gCAAC,uBAAD;IAAa,SAAS,MAAtB;IAAuB,MAAM,EAAEX;EAA/B,GAA2CG,IAA3C;IAAiD,GAAG,EAAEJ;EAAtD,GALF,eAME,gCAAC,WAAD;IACE,IAAI,EAAC,OADP;IAEE,IAAI,EAAC,OAFP;IAGE,OAAO,EAAE,mBAAM;MACbM,UAAU,CAAC,KAAD,CAAV;MACAH,OAAO;IACR,CANH;IAOE,cAAYF,MAAM,CAACgB;EAPrB,gBASE,gCAAC,YAAD,OATF,CANF,CALF,CAXJ,CADF;AAuCD,CAhD6B,CAA9B;AAkDAnB,qBAAqB,CAACoB,WAAtB,GAAoC,uBAApC;eAEepB,qB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"defaultLocale.js","names":["defaultLocale","inputSearchDefaultLocale","searchLabel","closeLabel"],"sources":["../../../../src/PageHeaderInputSearch/utils/defaultLocale.ts"],"sourcesContent":["import inputSearchDefaultLocale, {\n InputSearchLocale,\n} from '../../InputSearch/utils/defaultLocale';\n\nexport interface PageHeaderInputSearchLocale extends InputSearchLocale {\n searchLabel: string;\n closeLabel: string;\n}\n\nconst defaultLocale: PageHeaderInputSearchLocale = {\n ...inputSearchDefaultLocale,\n searchLabel: 'Search',\n closeLabel: 'Close search',\n};\n\nexport default defaultLocale;\n"],"mappings":";;;;;;;AAAA;;;;;;;;;;AASA,IAAMA,aAA0C,mCAC3CC,yBAD2C;EAE9CC,WAAW,EAAE,QAFiC;EAG9CC,UAAU,EAAE;AAHkC,EAAhD;;eAMeH,a"}
|
|
@@ -23,7 +23,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
23
23
|
|
|
24
24
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
25
25
|
|
|
26
|
-
function _extends() { _extends = Object.assign
|
|
26
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
27
27
|
|
|
28
28
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
29
29
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.js","names":["PageHeaderSkeleton","forwardRef","ref","width","rest","useContext","LayoutContext","hasNavigation","displayName"],"sources":["../../../src/PageHeaderSkeleton/index.tsx"],"sourcesContent":["import React, { forwardRef, useContext } from 'react';\nimport { WithSize } from '@os-design/styles';\nimport Skeleton, { SkeletonProps } from '../Skeleton';\nimport { PageHeaderContainer } from '../PageHeader';\nimport LayoutContext from '../Layout/LayoutContext';\n\nexport type PageHeaderSkeletonProps = SkeletonProps & WithSize;\n\n/**\n * Provides a page header placeholder while a user waits for\n * the content to load.\n */\nconst PageHeaderSkeleton = forwardRef<HTMLDivElement, PageHeaderSkeletonProps>(\n ({ width = '30%', ...rest }, ref) => {\n const { hasNavigation } = useContext(LayoutContext);\n\n return (\n <PageHeaderContainer\n hasNavigationIndent={hasNavigation}\n {...rest}\n ref={ref}\n >\n <Skeleton width={width} />\n </PageHeaderContainer>\n );\n }\n);\n\nPageHeaderSkeleton.displayName = 'PageHeaderSkeleton';\n\nexport default PageHeaderSkeleton;\n"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;;;;;;;;;;;;;;;AAIA;AACA;AACA;AACA;AACA,IAAMA,kBAAkB,gBAAG,IAAAC,iBAAA,EACzB,gBAA6BC,GAA7B,EAAqC;EAAA,sBAAlCC,KAAkC;EAAA,IAAlCA,KAAkC,2BAA1B,KAA0B;EAAA,IAAhBC,IAAgB;;EACnC,kBAA0B,IAAAC,iBAAA,EAAWC,yBAAX,CAA1B;EAAA,IAAQC,aAAR,eAAQA,aAAR;;EAEA,oBACE,gCAAC,+BAAD;IACE,mBAAmB,EAAEA;EADvB,GAEMH,IAFN;IAGE,GAAG,EAAEF;EAHP,iBAKE,gCAAC,oBAAD;IAAU,KAAK,EAAEC;EAAjB,EALF,CADF;AASD,CAbwB,CAA3B;AAgBAH,kBAAkB,CAACQ,WAAnB,GAAiC,oBAAjC;eAEeR,kB"}
|
|
@@ -27,7 +27,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
27
27
|
|
|
28
28
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
29
29
|
|
|
30
|
-
function _extends() { _extends = Object.assign
|
|
30
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
31
31
|
|
|
32
32
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
33
33
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.js","names":["hasMarginStyles","p","hasMargin","css","theme","paragraphMarginBottom","lineHeight","Container","styled","omitEmotionProps","key","ParagraphSkeleton","forwardRef","ref","rows","width","rest","Array","fill","map","_","index","displayName"],"sources":["../../../src/ParagraphSkeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport React, { forwardRef } from 'react';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { css } from '@emotion/react';\nimport Skeleton, { SkeletonProps } from '../Skeleton';\n\nexport interface ParagraphSkeletonProps extends SkeletonProps {\n /**\n * The number of rows.\n * @default 4\n */\n rows?: number;\n /**\n * The width of the last row.\n * @default 70%\n */\n width?: string;\n /**\n * Whether the paragraph has a bottom margin.\n * @default false\n */\n hasMargin?: boolean;\n}\n\nconst hasMarginStyles = (p) =>\n p.hasMargin &&\n css`\n margin-bottom: ${p.theme.paragraphMarginBottom +\n (p.theme.lineHeight - 1)}em;\n `;\n\ntype ContainerProps = Pick<ParagraphSkeletonProps, 'hasMargin'>;\nconst Container = styled('div', omitEmotionProps('hasMargin'))<ContainerProps>`\n & > *:not(:last-of-type) {\n margin-bottom: ${(p) => p.theme.lineHeight - 1}em;\n }\n ${hasMarginStyles};\n`;\n\nlet key = 0;\n\n/**\n * Provides a paragraph placeholder while a user waits for the content to load.\n */\nconst ParagraphSkeleton = forwardRef<HTMLDivElement, ParagraphSkeletonProps>(\n ({ rows = 4, width = '70%', hasMargin = false, ...rest }, ref) => (\n <Container hasMargin={hasMargin} {...rest} ref={ref}>\n {Array(rows)\n .fill({})\n .map((_, index) => {\n key += 1;\n return (\n <Skeleton key={key} width={index < rows - 1 ? '100%' : width} />\n );\n })}\n </Container>\n )\n);\n\nParagraphSkeleton.displayName = 'ParagraphSkeleton';\n\nexport default ParagraphSkeleton;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;AAoBA,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,CAACC,CAAD;EAAA,OACtBA,CAAC,CAACC,SAAF,QACAC,WADA,uGAEmBF,CAAC,CAACG,KAAF,CAAQC,qBAAR,IAChBJ,CAAC,CAACG,KAAF,CAAQE,UAAR,GAAqB,CADL,CAFnB,CADsB;AAAA,CAAxB;;AAQA,IAAMC,SAAS,GAAG,IAAAC,kBAAA,EAAO,KAAP,EAAc,IAAAC,uBAAA,EAAiB,WAAjB,CAAd,CAAH,kJAEM,UAACR,CAAD;EAAA,OAAOA,CAAC,CAACG,KAAF,CAAQE,UAAR,GAAqB,CAA5B;AAAA,CAFN,EAIXN,eAJW,CAAf;AAOA,IAAIU,GAAG,GAAG,CAAV;AAEA;AACA;AACA;;AACA,IAAMC,iBAAiB,gBAAG,IAAAC,iBAAA,EACxB,gBAA0DC,GAA1D;EAAA,qBAAGC,IAAH;EAAA,IAAGA,IAAH,0BAAU,CAAV;EAAA,sBAAaC,KAAb;EAAA,IAAaA,KAAb,2BAAqB,KAArB;EAAA,0BAA4Bb,SAA5B;EAAA,IAA4BA,SAA5B,+BAAwC,KAAxC;EAAA,IAAkDc,IAAlD;;EAAA,oBACE,gCAAC,SAAD;IAAW,SAAS,EAAEd;EAAtB,GAAqCc,IAArC;IAA2C,GAAG,EAAEH;EAAhD,IACGI,KAAK,CAACH,IAAD,CAAL,CACEI,IADF,CACO,EADP,EAEEC,GAFF,CAEM,UAACC,CAAD,EAAIC,KAAJ,EAAc;IACjBX,GAAG,IAAI,CAAP;IACA,oBACE,gCAAC,oBAAD;MAAU,GAAG,EAAEA,GAAf;MAAoB,KAAK,EAAEW,KAAK,GAAGP,IAAI,GAAG,CAAf,GAAmB,MAAnB,GAA4BC;IAAvD,EADF;EAGD,CAPF,CADH,CADF;AAAA,CADwB,CAA1B;AAeAJ,iBAAiB,CAACW,WAAlB,GAAgC,mBAAhC;eAEeX,iB"}
|
|
@@ -33,7 +33,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
33
33
|
|
|
34
34
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
35
35
|
|
|
36
|
-
function _extends() { _extends = Object.assign
|
|
36
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
37
37
|
|
|
38
38
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
39
39
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/Popover/index.tsx"],"names":["fadeIn","keyframes","fadeOut","visibleStyles","p","visible","css","theme","transitionDelay","invisibleStyles","Container","top","left","borderRadius","popoverColorBg","popoverColorText","popoverColorBorder","popoverColorBoxShadow","sizeStyles","emptyRect","width","height","Popover","ref","trigger","placement","gap","flip","onClose","id","children","rest","popoverRef","mergedPopoverRef","popoverRect","setPopoverRect","triggerRect","setTriggerRect","mounted","popoverResizeListener","current","getBoundingClientRect","measuredPopoverRef","node","triggerResizeListener","window","requestAnimationFrame","document","undefined","popoverId","Math","random","toString","slice","getAttribute","setAttribute","elementRect","displayName"],"mappings":"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","sourcesContent":["import React, {\n forwardRef,\n RefCallback,\n RefObject,\n useCallback,\n useEffect,\n useMemo,\n useState,\n} from 'react';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport {\n omitEmotionProps,\n useClickOutside,\n useClosable,\n useEvent,\n useForwardedRef,\n useResizeObserver,\n useBrowserLayoutEffect,\n} from '@os-design/utils';\nimport styled from '@emotion/styled';\nimport { clr, useTheme } from '@os-design/theming';\nimport { css, keyframes } from '@emotion/react';\nimport Portal from '@os-design/portal';\nimport usePopoverPosition, {\n Placement,\n Rect,\n} from './utils/usePopoverPosition';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface PopoverProps extends JsxDivProps, WithSize {\n /**\n * The element next to which the popover appears.\n * @default undefined\n */\n trigger?: RefObject<Element> | Rect;\n /**\n * On which side of the element the popover will appear.\n * @default top\n */\n placement?: Placement;\n /**\n * The gap between the element and the popover in em.\n * @default 0.2\n */\n gap?: number;\n /**\n * Whether the popover to flip if it does not fit in the window.\n * @default true\n */\n flip?: boolean;\n /**\n * Whether the popover is visible.\n * @default false\n */\n visible?: boolean;\n /**\n * The close event handler.\n * @default undefined\n */\n onClose?: () => void;\n}\n\nconst fadeIn = keyframes`\n from { opacity: 0; }\n to { opacity: 1; }\n`;\n\nconst fadeOut = keyframes`\n from { opacity: 1; }\n to { opacity: 0; }\n`;\n\nconst visibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${fadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst invisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${fadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ninterface ContainerProps extends Pick<PopoverProps, 'visible' | 'size'> {\n top: number;\n left: number;\n}\nconst Container = styled(\n 'div',\n omitEmotionProps('top', 'left', 'visible', 'size')\n)<ContainerProps>`\n position: absolute;\n top: ${(p) => p.top}px;\n left: ${(p) => p.left}px;\n\n border-radius: ${(p) => p.theme.borderRadius}em;\n background-color: ${(p) => clr(p.theme.popoverColorBg)};\n color: ${(p) => clr(p.theme.popoverColorText)};\n border: 1px solid ${(p) => clr(p.theme.popoverColorBorder)};\n box-shadow: 0 0.15em 0.8em ${(p) => clr(p.theme.popoverColorBoxShadow)};\n z-index: 1000; // Greater than the z-index of the Drawer\n\n ${visibleStyles};\n ${invisibleStyles};\n ${sizeStyles};\n`;\n\nconst emptyRect: Rect = {\n top: 0,\n left: 0,\n width: 0,\n height: 0,\n};\n\n/**\n * The pop-up window located next to the element.\n */\nconst Popover = forwardRef<HTMLDivElement, PopoverProps>(\n (\n {\n trigger,\n placement = 'top',\n gap = 0.2,\n flip = true,\n visible = false,\n onClose = () => {},\n id,\n children,\n ...rest\n },\n ref\n ) => {\n const [popoverRef, mergedPopoverRef] = useForwardedRef(ref);\n const [popoverRect, setPopoverRect] = useState(emptyRect);\n const [triggerRect, setTriggerRect] = useState(emptyRect);\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n // Init the rect of the popover and update it when the popover size changes\n const popoverResizeListener = useCallback(() => {\n if (!popoverRef.current) return;\n setPopoverRect(popoverRef.current.getBoundingClientRect());\n }, [popoverRef]);\n useResizeObserver(\n popoverRef.current as HTMLDivElement,\n popoverResizeListener\n );\n\n const measuredPopoverRef = useCallback<RefCallback<HTMLDivElement>>(\n (node) => {\n if (node === null) return;\n setPopoverRect(node.getBoundingClientRect());\n mergedPopoverRef(node);\n },\n [mergedPopoverRef]\n );\n\n // Init the rect of the trigger and update it when the window was resized\n // or scrolled\n const triggerResizeListener = useCallback(() => {\n window.requestAnimationFrame(() => {\n if (!trigger) return;\n const { current } = trigger as RefObject<Element>;\n if (!current) return;\n setTriggerRect(current.getBoundingClientRect());\n });\n }, [trigger]);\n useBrowserLayoutEffect(() => {\n if (!visible) return;\n triggerResizeListener();\n }, [triggerResizeListener, visible]);\n useResizeObserver(trigger as never, triggerResizeListener);\n useEvent(\n (typeof window === 'undefined' ? null : window) as never,\n 'resize',\n triggerResizeListener\n );\n useEvent(document, 'scroll', triggerResizeListener);\n\n useEffect(() => {\n if (!trigger || (trigger as RefObject<Element>).current !== undefined)\n return;\n setTriggerRect(trigger as Rect);\n }, [trigger]);\n\n const popoverId = useMemo(\n () => id || `popover-${Math.random().toString(36).slice(2, 11)}`,\n [id]\n );\n\n // Set the aria tags to support accessibility features\n useBrowserLayoutEffect(() => {\n if (!trigger) return;\n const { current } = trigger as RefObject<Element>;\n if (!current) return;\n if (current.getAttribute('aria-haspopup') === null) {\n current.setAttribute('aria-haspopup', 'dialog');\n }\n current.setAttribute('aria-controls', popoverId);\n }, []);\n useBrowserLayoutEffect(() => {\n if (!trigger) return;\n const { current } = trigger as RefObject<Element>;\n if (!current) return;\n current.setAttribute('aria-expanded', visible.toString());\n }, [visible]);\n\n // Get the popover coordinates\n const { top, left } = usePopoverPosition({\n elementRect: triggerRect,\n popoverRect,\n placement,\n gap,\n flip,\n });\n\n // Close the popover when the user clicks outside of it\n useClickOutside(popoverRef, onClose);\n\n if (!mounted) return null;\n\n return (\n <Portal>\n <Container\n top={top}\n left={left}\n visible={visible}\n id={popoverId}\n role='dialog'\n {...rest}\n ref={measuredPopoverRef}\n >\n {children}\n </Container>\n </Portal>\n );\n }\n);\n\nPopover.displayName = 'Popover';\n\nexport default Popover;\n"],"file":"index.js"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["fadeIn","keyframes","fadeOut","visibleStyles","p","visible","css","theme","transitionDelay","invisibleStyles","Container","styled","omitEmotionProps","top","left","borderRadius","clr","popoverColorBg","popoverColorText","popoverColorBorder","popoverColorBoxShadow","sizeStyles","emptyRect","width","height","Popover","forwardRef","ref","trigger","placement","gap","flip","onClose","id","children","rest","useForwardedRef","popoverRef","mergedPopoverRef","useState","popoverRect","setPopoverRect","triggerRect","setTriggerRect","useTheme","mounted","useClosable","popoverResizeListener","useCallback","current","getBoundingClientRect","useResizeObserver","measuredPopoverRef","node","triggerResizeListener","window","requestAnimationFrame","useBrowserLayoutEffect","useEvent","document","useEffect","undefined","popoverId","useMemo","Math","random","toString","slice","getAttribute","setAttribute","usePopoverPosition","elementRect","useClickOutside","displayName"],"sources":["../../../src/Popover/index.tsx"],"sourcesContent":["import React, {\n forwardRef,\n RefCallback,\n RefObject,\n useCallback,\n useEffect,\n useMemo,\n useState,\n} from 'react';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport {\n omitEmotionProps,\n useClickOutside,\n useClosable,\n useEvent,\n useForwardedRef,\n useResizeObserver,\n useBrowserLayoutEffect,\n} from '@os-design/utils';\nimport styled from '@emotion/styled';\nimport { clr, useTheme } from '@os-design/theming';\nimport { css, keyframes } from '@emotion/react';\nimport Portal from '@os-design/portal';\nimport usePopoverPosition, {\n Placement,\n Rect,\n} from './utils/usePopoverPosition';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface PopoverProps extends JsxDivProps, WithSize {\n /**\n * The element next to which the popover appears.\n * @default undefined\n */\n trigger?: RefObject<Element> | Rect;\n /**\n * On which side of the element the popover will appear.\n * @default top\n */\n placement?: Placement;\n /**\n * The gap between the element and the popover in em.\n * @default 0.2\n */\n gap?: number;\n /**\n * Whether the popover to flip if it does not fit in the window.\n * @default true\n */\n flip?: boolean;\n /**\n * Whether the popover is visible.\n * @default false\n */\n visible?: boolean;\n /**\n * The close event handler.\n * @default undefined\n */\n onClose?: () => void;\n}\n\nconst fadeIn = keyframes`\n from { opacity: 0; }\n to { opacity: 1; }\n`;\n\nconst fadeOut = keyframes`\n from { opacity: 1; }\n to { opacity: 0; }\n`;\n\nconst visibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${fadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst invisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${fadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ninterface ContainerProps extends Pick<PopoverProps, 'visible' | 'size'> {\n top: number;\n left: number;\n}\nconst Container = styled(\n 'div',\n omitEmotionProps('top', 'left', 'visible', 'size')\n)<ContainerProps>`\n position: absolute;\n top: ${(p) => p.top}px;\n left: ${(p) => p.left}px;\n\n border-radius: ${(p) => p.theme.borderRadius}em;\n background-color: ${(p) => clr(p.theme.popoverColorBg)};\n color: ${(p) => clr(p.theme.popoverColorText)};\n border: 1px solid ${(p) => clr(p.theme.popoverColorBorder)};\n box-shadow: 0 0.15em 0.8em ${(p) => clr(p.theme.popoverColorBoxShadow)};\n z-index: 1000; // Greater than the z-index of the Drawer\n\n ${visibleStyles};\n ${invisibleStyles};\n ${sizeStyles};\n`;\n\nconst emptyRect: Rect = {\n top: 0,\n left: 0,\n width: 0,\n height: 0,\n};\n\n/**\n * The pop-up window located next to the element.\n */\nconst Popover = forwardRef<HTMLDivElement, PopoverProps>(\n (\n {\n trigger,\n placement = 'top',\n gap = 0.2,\n flip = true,\n visible = false,\n onClose = () => {},\n id,\n children,\n ...rest\n },\n ref\n ) => {\n const [popoverRef, mergedPopoverRef] = useForwardedRef(ref);\n const [popoverRect, setPopoverRect] = useState(emptyRect);\n const [triggerRect, setTriggerRect] = useState(emptyRect);\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n // Init the rect of the popover and update it when the popover size changes\n const popoverResizeListener = useCallback(() => {\n if (!popoverRef.current) return;\n setPopoverRect(popoverRef.current.getBoundingClientRect());\n }, [popoverRef]);\n useResizeObserver(\n popoverRef.current as HTMLDivElement,\n popoverResizeListener\n );\n\n const measuredPopoverRef = useCallback<RefCallback<HTMLDivElement>>(\n (node) => {\n if (node === null) return;\n setPopoverRect(node.getBoundingClientRect());\n mergedPopoverRef(node);\n },\n [mergedPopoverRef]\n );\n\n // Init the rect of the trigger and update it when the window was resized\n // or scrolled\n const triggerResizeListener = useCallback(() => {\n window.requestAnimationFrame(() => {\n if (!trigger) return;\n const { current } = trigger as RefObject<Element>;\n if (!current) return;\n setTriggerRect(current.getBoundingClientRect());\n });\n }, [trigger]);\n useBrowserLayoutEffect(() => {\n if (!visible) return;\n triggerResizeListener();\n }, [triggerResizeListener, visible]);\n useResizeObserver(trigger as never, triggerResizeListener);\n useEvent(\n (typeof window === 'undefined' ? null : window) as never,\n 'resize',\n triggerResizeListener\n );\n useEvent(document, 'scroll', triggerResizeListener);\n\n useEffect(() => {\n if (!trigger || (trigger as RefObject<Element>).current !== undefined)\n return;\n setTriggerRect(trigger as Rect);\n }, [trigger]);\n\n const popoverId = useMemo(\n () => id || `popover-${Math.random().toString(36).slice(2, 11)}`,\n [id]\n );\n\n // Set the aria tags to support accessibility features\n useBrowserLayoutEffect(() => {\n if (!trigger) return;\n const { current } = trigger as RefObject<Element>;\n if (!current) return;\n if (current.getAttribute('aria-haspopup') === null) {\n current.setAttribute('aria-haspopup', 'dialog');\n }\n current.setAttribute('aria-controls', popoverId);\n }, []);\n useBrowserLayoutEffect(() => {\n if (!trigger) return;\n const { current } = trigger as RefObject<Element>;\n if (!current) return;\n current.setAttribute('aria-expanded', visible.toString());\n }, [visible]);\n\n // Get the popover coordinates\n const { top, left } = usePopoverPosition({\n elementRect: triggerRect,\n popoverRect,\n placement,\n gap,\n flip,\n });\n\n // Close the popover when the user clicks outside of it\n useClickOutside(popoverRef, onClose);\n\n if (!mounted) return null;\n\n return (\n <Portal>\n <Container\n top={top}\n left={left}\n visible={visible}\n id={popoverId}\n role='dialog'\n {...rest}\n ref={measuredPopoverRef}\n >\n {children}\n </Container>\n </Portal>\n );\n }\n);\n\nPopover.displayName = 'Popover';\n\nexport default Popover;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/Popover/utils/usePopoverPosition.ts"],"names":["popoverPositionGetters","rectKey","sizeKey","windowSizeKey","windowOffsetKey","fitToWindow","start","elementRect","popoverRect","popoverStart","windowStart","window","windowEnd","elementStart","elementEnd","popoverEnd","before","options","gap","flip","afterPopoverStart","after","afterPopoverEnd","diffStart","diffEnd","beforePopoverStart","end","center","getPopoverPosition","top","left","placementPositionKeysMap","bottom","right","usePopoverPosition","placement","bodyFontSize","document","body","gapPx","positionKeys"],"mappings":"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","sourcesContent":["import { useMemo } from 'react';\nimport { useFontSize } from '@os-design/utils';\n\nexport type Placement =\n | 'top'\n | 'bottom'\n | 'left'\n | 'right'\n | 'top-start'\n | 'top-end'\n | 'bottom-start'\n | 'bottom-end'\n | 'left-start'\n | 'left-end'\n | 'right-start'\n | 'right-end';\n\nexport interface Rect {\n top: number;\n left: number;\n width: number;\n height: number;\n}\n\ninterface UsePopoverPositionProps {\n /**\n * The rect of the element.\n */\n elementRect: Rect;\n /**\n * The rect of the popover.\n */\n popoverRect: Rect;\n /**\n * On which side of the element the popover will appear.\n * @default top\n */\n placement?: Placement;\n /**\n * The gap between the element and the popover in em.\n * @default 0.5\n */\n gap?: number;\n /**\n * Whether to flip the popover if it does not fit in the window.\n * @default true\n */\n flip?: boolean;\n}\n\ninterface PopoverPositionGetterOptions {\n elementRect: Rect;\n popoverRect: Rect;\n gap: number;\n flip: boolean;\n}\ntype PositionKeys = 'before' | 'after' | 'start' | 'end' | 'center';\ntype PopoverPositionGetterFn = (\n options: PopoverPositionGetterOptions\n) => number;\ntype PopoverPositionGetters = Record<PositionKeys, PopoverPositionGetterFn>;\ntype FitToWindow = Pick<\n PopoverPositionGetterOptions,\n 'elementRect' | 'popoverRect'\n>;\n\nconst popoverPositionGetters = (\n rectKey: 'top' | 'left'\n): PopoverPositionGetters => {\n const sizeKey = rectKey === 'top' ? 'height' : 'width';\n const windowSizeKey = rectKey === 'top' ? 'innerHeight' : 'innerWidth';\n const windowOffsetKey = rectKey === 'top' ? 'pageYOffset' : 'pageXOffset';\n\n const fitToWindow = (\n start: number,\n { elementRect, popoverRect }: FitToWindow\n ): number => {\n let popoverStart = start;\n const windowStart = window[windowOffsetKey];\n const windowEnd = windowStart + window[windowSizeKey];\n const elementStart = windowStart + elementRect[rectKey];\n const elementEnd = elementStart + elementRect[sizeKey];\n const popoverEnd = popoverStart + popoverRect[sizeKey];\n\n // Fit the popover to the end of the window\n if (popoverEnd > windowEnd) {\n if (elementEnd < windowEnd)\n popoverStart = windowEnd - popoverRect[sizeKey];\n else if (popoverRect[sizeKey] > elementRect[sizeKey])\n popoverStart = elementEnd - popoverRect[sizeKey];\n else if (windowEnd - elementStart > popoverRect[sizeKey])\n popoverStart = windowEnd - popoverRect[sizeKey];\n else popoverStart = elementStart;\n }\n\n // Fit the popover to the beginning of the window\n if (popoverStart < windowStart) {\n if (elementStart > windowStart) popoverStart = windowStart;\n else if (popoverRect[sizeKey] > elementRect[sizeKey])\n popoverStart = elementStart;\n else if (elementEnd - windowStart > popoverRect[sizeKey])\n popoverStart = windowStart;\n else popoverStart = elementEnd - popoverRect[sizeKey];\n }\n\n return popoverStart;\n };\n\n return {\n before(options) {\n const { elementRect, popoverRect, gap, flip } = options;\n const windowStart = window[windowOffsetKey];\n const windowEnd = windowStart + window[windowSizeKey];\n const elementStart = windowStart + elementRect[rectKey];\n const popoverStart = elementStart - popoverRect[sizeKey] - gap;\n if (flip && popoverStart < windowStart) {\n const afterPopoverStart = this.after({ ...options, flip: false });\n const afterPopoverEnd = afterPopoverStart + popoverRect[sizeKey];\n const diffStart = windowStart - popoverStart;\n const diffEnd = afterPopoverEnd - windowEnd;\n if (afterPopoverEnd <= windowEnd || diffStart > diffEnd)\n return afterPopoverStart;\n }\n return popoverStart;\n },\n after(options) {\n const { elementRect, popoverRect, gap, flip } = options;\n const windowStart = window[windowOffsetKey];\n const windowEnd = windowStart + window[windowSizeKey];\n const elementStart = windowStart + elementRect[rectKey];\n const elementEnd = elementStart + elementRect[sizeKey];\n const popoverStart = elementEnd + gap;\n const popoverEnd = popoverStart + popoverRect[sizeKey];\n if (flip && popoverEnd > windowEnd) {\n const beforePopoverStart = this.before({ ...options, flip: false });\n const diffStart = windowStart - beforePopoverStart;\n const diffEnd = popoverEnd - windowEnd;\n if (beforePopoverStart >= windowStart || diffEnd > diffStart)\n return beforePopoverStart;\n }\n return popoverStart;\n },\n start: ({ elementRect, popoverRect }) => {\n const windowStart = window[windowOffsetKey];\n const elementStart = windowStart + elementRect[rectKey];\n return fitToWindow(elementStart, { elementRect, popoverRect });\n },\n end: ({ elementRect, popoverRect }) => {\n const windowStart = window[windowOffsetKey];\n const elementStart = windowStart + elementRect[rectKey];\n const elementEnd = elementStart + elementRect[sizeKey];\n const popoverStart = elementEnd - popoverRect[sizeKey];\n return fitToWindow(popoverStart, { elementRect, popoverRect });\n },\n center: ({ elementRect, popoverRect }) => {\n const windowStart = window[windowOffsetKey];\n const elementStart = windowStart + elementRect[rectKey];\n const popoverStart =\n elementStart + (elementRect[sizeKey] - popoverRect[sizeKey]) / 2;\n return fitToWindow(popoverStart, { elementRect, popoverRect });\n },\n };\n};\n\nconst getPopoverPosition = (\n top: PositionKeys,\n left: PositionKeys,\n options: PopoverPositionGetterOptions\n) => ({\n top: popoverPositionGetters('top')[top](options),\n left: popoverPositionGetters('left')[left](options),\n});\n\ntype PlacementPositionKeysMap = Record<Placement, [PositionKeys, PositionKeys]>;\nconst placementPositionKeysMap: PlacementPositionKeysMap = {\n top: ['before', 'center'],\n bottom: ['after', 'center'],\n left: ['center', 'before'],\n right: ['center', 'after'],\n 'top-start': ['before', 'start'],\n 'top-end': ['before', 'end'],\n 'bottom-start': ['after', 'start'],\n 'bottom-end': ['after', 'end'],\n 'left-start': ['start', 'before'],\n 'left-end': ['end', 'before'],\n 'right-start': ['start', 'after'],\n 'right-end': ['end', 'after'],\n};\n\ninterface PopoverPosition {\n top: number;\n left: number;\n}\n\n/**\n * Computes the position of the popover.\n * Note that you must change the elementRect when the scroll and resize events of the parent scrollable container occur.\n * In most cases, it will be the window.\n */\nconst usePopoverPosition = ({\n elementRect,\n popoverRect,\n placement = 'top',\n gap = 0.5,\n flip = true,\n}: UsePopoverPositionProps): PopoverPosition => {\n const bodyFontSize = useFontSize(document.body);\n const gapPx = useMemo(() => gap * bodyFontSize, [gap, bodyFontSize]);\n\n const positionKeys = useMemo(() => {\n if (typeof placement === 'string' && !!placementPositionKeysMap[placement])\n return placementPositionKeysMap[placement];\n return placementPositionKeysMap.top;\n }, [placement]);\n\n return getPopoverPosition(...positionKeys, {\n elementRect,\n popoverRect,\n gap: gapPx,\n flip,\n });\n};\n\nexport default usePopoverPosition;\n"],"file":"usePopoverPosition.js"}
|
|
1
|
+
{"version":3,"file":"usePopoverPosition.js","names":["popoverPositionGetters","rectKey","sizeKey","windowSizeKey","windowOffsetKey","fitToWindow","start","elementRect","popoverRect","popoverStart","windowStart","window","windowEnd","elementStart","elementEnd","popoverEnd","before","options","gap","flip","afterPopoverStart","after","afterPopoverEnd","diffStart","diffEnd","beforePopoverStart","end","center","getPopoverPosition","top","left","placementPositionKeysMap","bottom","right","usePopoverPosition","placement","bodyFontSize","useFontSize","document","body","gapPx","useMemo","positionKeys"],"sources":["../../../../src/Popover/utils/usePopoverPosition.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { useFontSize } from '@os-design/utils';\n\nexport type Placement =\n | 'top'\n | 'bottom'\n | 'left'\n | 'right'\n | 'top-start'\n | 'top-end'\n | 'bottom-start'\n | 'bottom-end'\n | 'left-start'\n | 'left-end'\n | 'right-start'\n | 'right-end';\n\nexport interface Rect {\n top: number;\n left: number;\n width: number;\n height: number;\n}\n\ninterface UsePopoverPositionProps {\n /**\n * The rect of the element.\n */\n elementRect: Rect;\n /**\n * The rect of the popover.\n */\n popoverRect: Rect;\n /**\n * On which side of the element the popover will appear.\n * @default top\n */\n placement?: Placement;\n /**\n * The gap between the element and the popover in em.\n * @default 0.5\n */\n gap?: number;\n /**\n * Whether to flip the popover if it does not fit in the window.\n * @default true\n */\n flip?: boolean;\n}\n\ninterface PopoverPositionGetterOptions {\n elementRect: Rect;\n popoverRect: Rect;\n gap: number;\n flip: boolean;\n}\ntype PositionKeys = 'before' | 'after' | 'start' | 'end' | 'center';\ntype PopoverPositionGetterFn = (\n options: PopoverPositionGetterOptions\n) => number;\ntype PopoverPositionGetters = Record<PositionKeys, PopoverPositionGetterFn>;\ntype FitToWindow = Pick<\n PopoverPositionGetterOptions,\n 'elementRect' | 'popoverRect'\n>;\n\nconst popoverPositionGetters = (\n rectKey: 'top' | 'left'\n): PopoverPositionGetters => {\n const sizeKey = rectKey === 'top' ? 'height' : 'width';\n const windowSizeKey = rectKey === 'top' ? 'innerHeight' : 'innerWidth';\n const windowOffsetKey = rectKey === 'top' ? 'pageYOffset' : 'pageXOffset';\n\n const fitToWindow = (\n start: number,\n { elementRect, popoverRect }: FitToWindow\n ): number => {\n let popoverStart = start;\n const windowStart = window[windowOffsetKey];\n const windowEnd = windowStart + window[windowSizeKey];\n const elementStart = windowStart + elementRect[rectKey];\n const elementEnd = elementStart + elementRect[sizeKey];\n const popoverEnd = popoverStart + popoverRect[sizeKey];\n\n // Fit the popover to the end of the window\n if (popoverEnd > windowEnd) {\n if (elementEnd < windowEnd)\n popoverStart = windowEnd - popoverRect[sizeKey];\n else if (popoverRect[sizeKey] > elementRect[sizeKey])\n popoverStart = elementEnd - popoverRect[sizeKey];\n else if (windowEnd - elementStart > popoverRect[sizeKey])\n popoverStart = windowEnd - popoverRect[sizeKey];\n else popoverStart = elementStart;\n }\n\n // Fit the popover to the beginning of the window\n if (popoverStart < windowStart) {\n if (elementStart > windowStart) popoverStart = windowStart;\n else if (popoverRect[sizeKey] > elementRect[sizeKey])\n popoverStart = elementStart;\n else if (elementEnd - windowStart > popoverRect[sizeKey])\n popoverStart = windowStart;\n else popoverStart = elementEnd - popoverRect[sizeKey];\n }\n\n return popoverStart;\n };\n\n return {\n before(options) {\n const { elementRect, popoverRect, gap, flip } = options;\n const windowStart = window[windowOffsetKey];\n const windowEnd = windowStart + window[windowSizeKey];\n const elementStart = windowStart + elementRect[rectKey];\n const popoverStart = elementStart - popoverRect[sizeKey] - gap;\n if (flip && popoverStart < windowStart) {\n const afterPopoverStart = this.after({ ...options, flip: false });\n const afterPopoverEnd = afterPopoverStart + popoverRect[sizeKey];\n const diffStart = windowStart - popoverStart;\n const diffEnd = afterPopoverEnd - windowEnd;\n if (afterPopoverEnd <= windowEnd || diffStart > diffEnd)\n return afterPopoverStart;\n }\n return popoverStart;\n },\n after(options) {\n const { elementRect, popoverRect, gap, flip } = options;\n const windowStart = window[windowOffsetKey];\n const windowEnd = windowStart + window[windowSizeKey];\n const elementStart = windowStart + elementRect[rectKey];\n const elementEnd = elementStart + elementRect[sizeKey];\n const popoverStart = elementEnd + gap;\n const popoverEnd = popoverStart + popoverRect[sizeKey];\n if (flip && popoverEnd > windowEnd) {\n const beforePopoverStart = this.before({ ...options, flip: false });\n const diffStart = windowStart - beforePopoverStart;\n const diffEnd = popoverEnd - windowEnd;\n if (beforePopoverStart >= windowStart || diffEnd > diffStart)\n return beforePopoverStart;\n }\n return popoverStart;\n },\n start: ({ elementRect, popoverRect }) => {\n const windowStart = window[windowOffsetKey];\n const elementStart = windowStart + elementRect[rectKey];\n return fitToWindow(elementStart, { elementRect, popoverRect });\n },\n end: ({ elementRect, popoverRect }) => {\n const windowStart = window[windowOffsetKey];\n const elementStart = windowStart + elementRect[rectKey];\n const elementEnd = elementStart + elementRect[sizeKey];\n const popoverStart = elementEnd - popoverRect[sizeKey];\n return fitToWindow(popoverStart, { elementRect, popoverRect });\n },\n center: ({ elementRect, popoverRect }) => {\n const windowStart = window[windowOffsetKey];\n const elementStart = windowStart + elementRect[rectKey];\n const popoverStart =\n elementStart + (elementRect[sizeKey] - popoverRect[sizeKey]) / 2;\n return fitToWindow(popoverStart, { elementRect, popoverRect });\n },\n };\n};\n\nconst getPopoverPosition = (\n top: PositionKeys,\n left: PositionKeys,\n options: PopoverPositionGetterOptions\n) => ({\n top: popoverPositionGetters('top')[top](options),\n left: popoverPositionGetters('left')[left](options),\n});\n\ntype PlacementPositionKeysMap = Record<Placement, [PositionKeys, PositionKeys]>;\nconst placementPositionKeysMap: PlacementPositionKeysMap = {\n top: ['before', 'center'],\n bottom: ['after', 'center'],\n left: ['center', 'before'],\n right: ['center', 'after'],\n 'top-start': ['before', 'start'],\n 'top-end': ['before', 'end'],\n 'bottom-start': ['after', 'start'],\n 'bottom-end': ['after', 'end'],\n 'left-start': ['start', 'before'],\n 'left-end': ['end', 'before'],\n 'right-start': ['start', 'after'],\n 'right-end': ['end', 'after'],\n};\n\ninterface PopoverPosition {\n top: number;\n left: number;\n}\n\n/**\n * Computes the position of the popover.\n * Note that you must change the elementRect when the scroll and resize events of the parent scrollable container occur.\n * In most cases, it will be the window.\n */\nconst usePopoverPosition = ({\n elementRect,\n popoverRect,\n placement = 'top',\n gap = 0.5,\n flip = true,\n}: UsePopoverPositionProps): PopoverPosition => {\n const bodyFontSize = useFontSize(document.body);\n const gapPx = useMemo(() => gap * bodyFontSize, [gap, bodyFontSize]);\n\n const positionKeys = useMemo(() => {\n if (typeof placement === 'string' && !!placementPositionKeysMap[placement])\n return placementPositionKeysMap[placement];\n return placementPositionKeysMap.top;\n }, [placement]);\n\n return getPopoverPosition(...positionKeys, {\n elementRect,\n popoverRect,\n gap: gapPx,\n flip,\n });\n};\n\nexport default usePopoverPosition;\n"],"mappings":";;;;;;;AAAA;;AACA;;;;;;;;;;;;;;;;;;;;AAiEA,IAAMA,sBAAsB,GAAG,SAAzBA,sBAAyB,CAC7BC,OAD6B,EAEF;EAC3B,IAAMC,OAAO,GAAGD,OAAO,KAAK,KAAZ,GAAoB,QAApB,GAA+B,OAA/C;EACA,IAAME,aAAa,GAAGF,OAAO,KAAK,KAAZ,GAAoB,aAApB,GAAoC,YAA1D;EACA,IAAMG,eAAe,GAAGH,OAAO,KAAK,KAAZ,GAAoB,aAApB,GAAoC,aAA5D;;EAEA,IAAMI,WAAW,GAAG,SAAdA,WAAc,CAClBC,KADkB,QAGP;IAAA,IADTC,WACS,QADTA,WACS;IAAA,IADIC,WACJ,QADIA,WACJ;IACX,IAAIC,YAAY,GAAGH,KAAnB;IACA,IAAMI,WAAW,GAAGC,MAAM,CAACP,eAAD,CAA1B;IACA,IAAMQ,SAAS,GAAGF,WAAW,GAAGC,MAAM,CAACR,aAAD,CAAtC;IACA,IAAMU,YAAY,GAAGH,WAAW,GAAGH,WAAW,CAACN,OAAD,CAA9C;IACA,IAAMa,UAAU,GAAGD,YAAY,GAAGN,WAAW,CAACL,OAAD,CAA7C;IACA,IAAMa,UAAU,GAAGN,YAAY,GAAGD,WAAW,CAACN,OAAD,CAA7C,CANW,CAQX;;IACA,IAAIa,UAAU,GAAGH,SAAjB,EAA4B;MAC1B,IAAIE,UAAU,GAAGF,SAAjB,EACEH,YAAY,GAAGG,SAAS,GAAGJ,WAAW,CAACN,OAAD,CAAtC,CADF,KAEK,IAAIM,WAAW,CAACN,OAAD,CAAX,GAAuBK,WAAW,CAACL,OAAD,CAAtC,EACHO,YAAY,GAAGK,UAAU,GAAGN,WAAW,CAACN,OAAD,CAAvC,CADG,KAEA,IAAIU,SAAS,GAAGC,YAAZ,GAA2BL,WAAW,CAACN,OAAD,CAA1C,EACHO,YAAY,GAAGG,SAAS,GAAGJ,WAAW,CAACN,OAAD,CAAtC,CADG,KAEAO,YAAY,GAAGI,YAAf;IACN,CAjBU,CAmBX;;;IACA,IAAIJ,YAAY,GAAGC,WAAnB,EAAgC;MAC9B,IAAIG,YAAY,GAAGH,WAAnB,EAAgCD,YAAY,GAAGC,WAAf,CAAhC,KACK,IAAIF,WAAW,CAACN,OAAD,CAAX,GAAuBK,WAAW,CAACL,OAAD,CAAtC,EACHO,YAAY,GAAGI,YAAf,CADG,KAEA,IAAIC,UAAU,GAAGJ,WAAb,GAA2BF,WAAW,CAACN,OAAD,CAA1C,EACHO,YAAY,GAAGC,WAAf,CADG,KAEAD,YAAY,GAAGK,UAAU,GAAGN,WAAW,CAACN,OAAD,CAAvC;IACN;;IAED,OAAOO,YAAP;EACD,CAjCD;;EAmCA,OAAO;IACLO,MADK,kBACEC,OADF,EACW;MACd,IAAQV,WAAR,GAAgDU,OAAhD,CAAQV,WAAR;MAAA,IAAqBC,WAArB,GAAgDS,OAAhD,CAAqBT,WAArB;MAAA,IAAkCU,GAAlC,GAAgDD,OAAhD,CAAkCC,GAAlC;MAAA,IAAuCC,IAAvC,GAAgDF,OAAhD,CAAuCE,IAAvC;MACA,IAAMT,WAAW,GAAGC,MAAM,CAACP,eAAD,CAA1B;MACA,IAAMQ,SAAS,GAAGF,WAAW,GAAGC,MAAM,CAACR,aAAD,CAAtC;MACA,IAAMU,YAAY,GAAGH,WAAW,GAAGH,WAAW,CAACN,OAAD,CAA9C;MACA,IAAMQ,YAAY,GAAGI,YAAY,GAAGL,WAAW,CAACN,OAAD,CAA1B,GAAsCgB,GAA3D;;MACA,IAAIC,IAAI,IAAIV,YAAY,GAAGC,WAA3B,EAAwC;QACtC,IAAMU,iBAAiB,GAAG,KAAKC,KAAL,iCAAgBJ,OAAhB;UAAyBE,IAAI,EAAE;QAA/B,GAA1B;QACA,IAAMG,eAAe,GAAGF,iBAAiB,GAAGZ,WAAW,CAACN,OAAD,CAAvD;QACA,IAAMqB,SAAS,GAAGb,WAAW,GAAGD,YAAhC;QACA,IAAMe,OAAO,GAAGF,eAAe,GAAGV,SAAlC;QACA,IAAIU,eAAe,IAAIV,SAAnB,IAAgCW,SAAS,GAAGC,OAAhD,EACE,OAAOJ,iBAAP;MACH;;MACD,OAAOX,YAAP;IACD,CAhBI;IAiBLY,KAjBK,iBAiBCJ,OAjBD,EAiBU;MACb,IAAQV,WAAR,GAAgDU,OAAhD,CAAQV,WAAR;MAAA,IAAqBC,WAArB,GAAgDS,OAAhD,CAAqBT,WAArB;MAAA,IAAkCU,GAAlC,GAAgDD,OAAhD,CAAkCC,GAAlC;MAAA,IAAuCC,IAAvC,GAAgDF,OAAhD,CAAuCE,IAAvC;MACA,IAAMT,WAAW,GAAGC,MAAM,CAACP,eAAD,CAA1B;MACA,IAAMQ,SAAS,GAAGF,WAAW,GAAGC,MAAM,CAACR,aAAD,CAAtC;MACA,IAAMU,YAAY,GAAGH,WAAW,GAAGH,WAAW,CAACN,OAAD,CAA9C;MACA,IAAMa,UAAU,GAAGD,YAAY,GAAGN,WAAW,CAACL,OAAD,CAA7C;MACA,IAAMO,YAAY,GAAGK,UAAU,GAAGI,GAAlC;MACA,IAAMH,UAAU,GAAGN,YAAY,GAAGD,WAAW,CAACN,OAAD,CAA7C;;MACA,IAAIiB,IAAI,IAAIJ,UAAU,GAAGH,SAAzB,EAAoC;QAClC,IAAMa,kBAAkB,GAAG,KAAKT,MAAL,iCAAiBC,OAAjB;UAA0BE,IAAI,EAAE;QAAhC,GAA3B;QACA,IAAMI,SAAS,GAAGb,WAAW,GAAGe,kBAAhC;QACA,IAAMD,OAAO,GAAGT,UAAU,GAAGH,SAA7B;QACA,IAAIa,kBAAkB,IAAIf,WAAtB,IAAqCc,OAAO,GAAGD,SAAnD,EACE,OAAOE,kBAAP;MACH;;MACD,OAAOhB,YAAP;IACD,CAjCI;IAkCLH,KAAK,EAAE,sBAAkC;MAAA,IAA/BC,WAA+B,SAA/BA,WAA+B;MAAA,IAAlBC,WAAkB,SAAlBA,WAAkB;MACvC,IAAME,WAAW,GAAGC,MAAM,CAACP,eAAD,CAA1B;MACA,IAAMS,YAAY,GAAGH,WAAW,GAAGH,WAAW,CAACN,OAAD,CAA9C;MACA,OAAOI,WAAW,CAACQ,YAAD,EAAe;QAAEN,WAAW,EAAXA,WAAF;QAAeC,WAAW,EAAXA;MAAf,CAAf,CAAlB;IACD,CAtCI;IAuCLkB,GAAG,EAAE,oBAAkC;MAAA,IAA/BnB,WAA+B,SAA/BA,WAA+B;MAAA,IAAlBC,WAAkB,SAAlBA,WAAkB;MACrC,IAAME,WAAW,GAAGC,MAAM,CAACP,eAAD,CAA1B;MACA,IAAMS,YAAY,GAAGH,WAAW,GAAGH,WAAW,CAACN,OAAD,CAA9C;MACA,IAAMa,UAAU,GAAGD,YAAY,GAAGN,WAAW,CAACL,OAAD,CAA7C;MACA,IAAMO,YAAY,GAAGK,UAAU,GAAGN,WAAW,CAACN,OAAD,CAA7C;MACA,OAAOG,WAAW,CAACI,YAAD,EAAe;QAAEF,WAAW,EAAXA,WAAF;QAAeC,WAAW,EAAXA;MAAf,CAAf,CAAlB;IACD,CA7CI;IA8CLmB,MAAM,EAAE,uBAAkC;MAAA,IAA/BpB,WAA+B,SAA/BA,WAA+B;MAAA,IAAlBC,WAAkB,SAAlBA,WAAkB;MACxC,IAAME,WAAW,GAAGC,MAAM,CAACP,eAAD,CAA1B;MACA,IAAMS,YAAY,GAAGH,WAAW,GAAGH,WAAW,CAACN,OAAD,CAA9C;MACA,IAAMQ,YAAY,GAChBI,YAAY,GAAG,CAACN,WAAW,CAACL,OAAD,CAAX,GAAuBM,WAAW,CAACN,OAAD,CAAnC,IAAgD,CADjE;MAEA,OAAOG,WAAW,CAACI,YAAD,EAAe;QAAEF,WAAW,EAAXA,WAAF;QAAeC,WAAW,EAAXA;MAAf,CAAf,CAAlB;IACD;EApDI,CAAP;AAsDD,CAhGD;;AAkGA,IAAMoB,kBAAkB,GAAG,SAArBA,kBAAqB,CACzBC,GADyB,EAEzBC,IAFyB,EAGzBb,OAHyB;EAAA,OAIrB;IACJY,GAAG,EAAE7B,sBAAsB,CAAC,KAAD,CAAtB,CAA8B6B,GAA9B,EAAmCZ,OAAnC,CADD;IAEJa,IAAI,EAAE9B,sBAAsB,CAAC,MAAD,CAAtB,CAA+B8B,IAA/B,EAAqCb,OAArC;EAFF,CAJqB;AAAA,CAA3B;;AAUA,IAAMc,wBAAkD,GAAG;EACzDF,GAAG,EAAE,CAAC,QAAD,EAAW,QAAX,CADoD;EAEzDG,MAAM,EAAE,CAAC,OAAD,EAAU,QAAV,CAFiD;EAGzDF,IAAI,EAAE,CAAC,QAAD,EAAW,QAAX,CAHmD;EAIzDG,KAAK,EAAE,CAAC,QAAD,EAAW,OAAX,CAJkD;EAKzD,aAAa,CAAC,QAAD,EAAW,OAAX,CAL4C;EAMzD,WAAW,CAAC,QAAD,EAAW,KAAX,CAN8C;EAOzD,gBAAgB,CAAC,OAAD,EAAU,OAAV,CAPyC;EAQzD,cAAc,CAAC,OAAD,EAAU,KAAV,CAR2C;EASzD,cAAc,CAAC,OAAD,EAAU,QAAV,CAT2C;EAUzD,YAAY,CAAC,KAAD,EAAQ,QAAR,CAV6C;EAWzD,eAAe,CAAC,OAAD,EAAU,OAAV,CAX0C;EAYzD,aAAa,CAAC,KAAD,EAAQ,OAAR;AAZ4C,CAA3D;;AAoBA;AACA;AACA;AACA;AACA;AACA,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,QAMqB;EAAA,IAL9C3B,WAK8C,SAL9CA,WAK8C;EAAA,IAJ9CC,WAI8C,SAJ9CA,WAI8C;EAAA,4BAH9C2B,SAG8C;EAAA,IAH9CA,SAG8C,gCAHlC,KAGkC;EAAA,sBAF9CjB,GAE8C;EAAA,IAF9CA,GAE8C,0BAFxC,GAEwC;EAAA,uBAD9CC,IAC8C;EAAA,IAD9CA,IAC8C,2BADvC,IACuC;EAC9C,IAAMiB,YAAY,GAAG,IAAAC,kBAAA,EAAYC,QAAQ,CAACC,IAArB,CAArB;EACA,IAAMC,KAAK,GAAG,IAAAC,cAAA,EAAQ;IAAA,OAAMvB,GAAG,GAAGkB,YAAZ;EAAA,CAAR,EAAkC,CAAClB,GAAD,EAAMkB,YAAN,CAAlC,CAAd;EAEA,IAAMM,YAAY,GAAG,IAAAD,cAAA,EAAQ,YAAM;IACjC,IAAI,OAAON,SAAP,KAAqB,QAArB,IAAiC,CAAC,CAACJ,wBAAwB,CAACI,SAAD,CAA/D,EACE,OAAOJ,wBAAwB,CAACI,SAAD,CAA/B;IACF,OAAOJ,wBAAwB,CAACF,GAAhC;EACD,CAJoB,EAIlB,CAACM,SAAD,CAJkB,CAArB;EAMA,OAAOP,kBAAkB,MAAlB,4BAAsBc,YAAtB,UAAoC;IACzCnC,WAAW,EAAXA,WADyC;IAEzCC,WAAW,EAAXA,WAFyC;IAGzCU,GAAG,EAAEsB,KAHoC;IAIzCrB,IAAI,EAAJA;EAJyC,CAApC,GAAP;AAMD,CAtBD;;eAwBee,kB"}
|
|
@@ -27,7 +27,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
27
27
|
|
|
28
28
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
29
29
|
|
|
30
|
-
function _extends() { _extends = Object.assign
|
|
30
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
31
31
|
|
|
32
32
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
33
33
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.js","names":["Container","styled","omitEmotionProps","sizeStyles","Trail","p","clr","theme","progressColorTrail","height","Stroke","percent","progressColorStroke","progressColorStrokeSuccess","transitionStyles","Text","div","progressColorPercentage","Progress","forwardRef","ref","text","rest","validPercent","useMemo","textId","Math","random","toString","slice","displayName"],"sources":["../../../src/Progress/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport React, { forwardRef, useMemo } from 'react';\nimport { sizeStyles, transitionStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr } from '@os-design/theming';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface ProgressProps extends JsxDivProps, WithSize {\n /**\n * The percentage of completion.\n * @default 0\n */\n percent?: number;\n /**\n * The text that is displayed to the right of the progress bar.\n * @default undefined\n */\n text?: string;\n /**\n * The height of the progress bar.\n * @default 0.5em\n */\n height?: string;\n}\n\nconst Container = styled('div', omitEmotionProps('size'))<WithSize>`\n display: flex;\n align-items: center;\n ${sizeStyles};\n`;\n\ntype TrailProps = Required<Pick<ProgressProps, 'height'>>;\nconst Trail = styled('div', omitEmotionProps('height'))<TrailProps>`\n width: 100%;\n background-color: ${(p) => clr(p.theme.progressColorTrail)};\n border-radius: ${(p) => `calc(${p.height} / 2)`};\n overflow: hidden; // To hide the border of the progress bar\n`;\n\ntype StrokeProps = Required<Pick<ProgressProps, 'percent' | 'height'>>;\nconst Stroke = styled(\n 'div',\n omitEmotionProps('percent', 'height')\n)<StrokeProps>`\n width: ${(p) => p.percent}%;\n height: ${(p) => p.height};\n border-radius: 0 ${(p) => `calc(${p.height} / 2)`}\n ${(p) => `calc(${p.height} / 2)`} 0;\n background-color: ${(p) =>\n p.percent < 100\n ? clr(p.theme.progressColorStroke)\n : clr(p.theme.progressColorStrokeSuccess)};\n ${transitionStyles('width', 'background-color')};\n`;\n\nconst Text = styled.div`\n margin-left: 0.5em;\n color: ${(p) => clr(p.theme.progressColorPercentage)};\n line-height: 1;\n`;\n\n/**\n * The progress bar.\n */\nconst Progress = forwardRef<HTMLDivElement, ProgressProps>(\n ({ percent = 0, text, height = '0.5em', ...rest }, ref) => {\n const validPercent = useMemo(() => {\n if (percent < 0) return 0;\n if (percent > 100) return 100;\n return percent;\n }, [percent]);\n\n const textId = useMemo(\n () => `progress-bar-text-${Math.random().toString(36).slice(2, 11)}`,\n []\n );\n\n return (\n <Container\n role='progressbar'\n aria-valuenow={validPercent}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-describedby={textId}\n {...rest}\n ref={ref}\n >\n <Trail height={height}>\n <Stroke percent={validPercent} height={height} />\n </Trail>\n {text && <Text id={textId}>{text}</Text>}\n </Container>\n );\n }\n);\n\nProgress.displayName = 'Progress';\n\nexport default Progress;\n"],"mappings":"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"}
|
|
@@ -32,7 +32,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
32
32
|
|
|
33
33
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
34
34
|
|
|
35
|
-
function _extends() { _extends = Object.assign
|
|
35
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
36
36
|
|
|
37
37
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
38
38
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.js","names":["wideDefaultStyles","p","wide","css","m","max","xxs","wideAlwaysStyles","Container","styled","omitEmotionProps","theme","borderRadius","disabled","clr","buttonDisabledGhostColorText","colorPrimary","StyledButton","Button","RadioGroup","forwardRef","ref","options","value","defaultValue","onChange","size","rest","useForwardedState","forwardedValue","setForwardedValue","map","title","valueOption","disabledOption","onClick","buttonRest","e","displayName"],"sources":["../../../src/RadioGroup/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { WithSize } from '@os-design/styles';\nimport { omitEmotionProps, useForwardedState } from '@os-design/utils';\nimport styled from '@emotion/styled';\nimport { m } from '@os-design/media';\nimport { clr } from '@os-design/theming';\nimport { css } from '@emotion/react';\nimport Button, { ButtonProps } from '../Button';\n\nexport interface RadioGroupOption\n extends Omit<ButtonProps, 'type' | 'wide' | 'size'> {\n /**\n * The title of the option.\n */\n title: string;\n /**\n * The value of the option.\n */\n value: string;\n}\n\ntype JsxDivProps = Omit<\n JSX.IntrinsicElements['div'],\n 'value' | 'defaultValue' | 'onChange' | 'ref'\n>;\nexport interface RadioGroupProps extends JsxDivProps, WithSize {\n /**\n * Options of the radio group.\n * @default undefined\n */\n options?: RadioGroupOption[];\n /**\n * Whether the radio group has full width.\n * Possible values:\n * `default` – the radio group has full width if the screen width is less than xs;\n * `always` – the radio group always has full width;\n * `never` – the radio group never has full width.\n * @default default\n */\n wide?: 'default' | 'always' | 'never';\n /**\n * Whether the radio group is disabled.\n * @default false\n */\n disabled?: boolean;\n /**\n * Selected option.\n * @default false\n */\n value?: string;\n /**\n * The default value.\n * @default undefined\n */\n defaultValue?: string;\n /**\n * The change event handler.\n * @default undefined\n */\n onChange?: (value: string) => void;\n}\n\nconst wideDefaultStyles = (p) =>\n p.wide === 'default' &&\n css`\n ${m.max.xxs} {\n width: 100%;\n & > button {\n flex: 1;\n }\n }\n `;\n\nconst wideAlwaysStyles = (p) =>\n p.wide === 'always' &&\n css`\n width: 100%;\n & > button {\n flex: 1;\n }\n `;\n\ntype ContainerProps = Required<Pick<RadioGroupProps, 'wide' | 'disabled'>>;\nconst Container = styled(\n 'div',\n omitEmotionProps('wide', 'disabled')\n)<ContainerProps>`\n display: inline-flex;\n flex-wrap: wrap;\n\n border-radius: ${(p) => p.theme.borderRadius}em;\n overflow: hidden;\n border: 1px solid\n ${(p) =>\n p.disabled\n ? clr(p.theme.buttonDisabledGhostColorText)\n : clr(p.theme.colorPrimary)};\n\n ${wideDefaultStyles};\n ${wideAlwaysStyles};\n`;\n\nconst StyledButton = styled(Button)`\n border-radius: 0;\n`;\n\n/**\n * The radio buttons that allow a user to select only one of a limited number of options.\n */\nconst RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n (\n {\n options = [],\n wide = 'default',\n disabled = false,\n value,\n defaultValue,\n onChange = () => {},\n size,\n ...rest\n },\n ref\n ) => {\n const [forwardedValue, setForwardedValue] = useForwardedState({\n value,\n defaultValue,\n onChange,\n });\n\n return (\n <div>\n <Container wide={wide} disabled={disabled} {...rest} ref={ref}>\n {options?.map(\n ({\n title,\n value: valueOption,\n disabled: disabledOption,\n onClick = () => {},\n ...buttonRest\n }) => (\n <StyledButton\n key={valueOption}\n type={forwardedValue === valueOption ? 'primary' : 'ghost'}\n wide='never'\n disabled={disabled || disabledOption}\n size={size}\n onClick={(e) => {\n setForwardedValue(valueOption);\n onClick(e);\n }}\n {...buttonRest}\n >\n {title}\n </StyledButton>\n )\n )}\n </Container>\n </div>\n );\n }\n);\n\nRadioGroup.displayName = 'RadioGroup';\n\nexport default RadioGroup;\n"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDA,IAAMA,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,CAAD;EAAA,OACxBA,CAAC,CAACC,IAAF,KAAW,SAAX,QACAC,WADA,iKAEIC,QAAA,CAAEC,GAAF,CAAMC,GAFV,CADwB;AAAA,CAA1B;;AAWA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACN,CAAD;EAAA,OACvBA,CAAC,CAACC,IAAF,KAAW,QAAX,QACAC,WADA,uIADuB;AAAA,CAAzB;;AAUA,IAAMK,SAAS,GAAG,IAAAC,kBAAA,EAChB,KADgB,EAEhB,IAAAC,uBAAA,EAAiB,MAAjB,EAAyB,UAAzB,CAFgB,CAAH,4NAOI,UAACT,CAAD;EAAA,OAAOA,CAAC,CAACU,KAAF,CAAQC,YAAf;AAAA,CAPJ,EAUT,UAACX,CAAD;EAAA,OACAA,CAAC,CAACY,QAAF,GACI,IAAAC,YAAA,EAAIb,CAAC,CAACU,KAAF,CAAQI,4BAAZ,CADJ,GAEI,IAAAD,YAAA,EAAIb,CAAC,CAACU,KAAF,CAAQK,YAAZ,CAHJ;AAAA,CAVS,EAeXhB,iBAfW,EAgBXO,gBAhBW,CAAf;AAmBA,IAAMU,YAAY,GAAG,IAAAR,kBAAA,EAAOS,kBAAP,CAAH,8FAAlB;AAIA;AACA;AACA;;AACA,IAAMC,UAAU,gBAAG,IAAAC,iBAAA,EACjB,gBAWEC,GAXF,EAYK;EAAA,wBAVDC,OAUC;EAAA,IAVDA,OAUC,6BAVS,EAUT;EAAA,qBATDpB,IASC;EAAA,IATDA,IASC,0BATM,SASN;EAAA,yBARDW,QAQC;EAAA,IARDA,QAQC,8BARU,KAQV;EAAA,IAPDU,KAOC,QAPDA,KAOC;EAAA,IANDC,YAMC,QANDA,YAMC;EAAA,yBALDC,QAKC;EAAA,IALDA,QAKC,8BALU,YAAM,CAAE,CAKlB;EAAA,IAJDC,IAIC,QAJDA,IAIC;EAAA,IAHEC,IAGF;;EACH,yBAA4C,IAAAC,wBAAA,EAAkB;IAC5DL,KAAK,EAALA,KAD4D;IAE5DC,YAAY,EAAZA,YAF4D;IAG5DC,QAAQ,EAARA;EAH4D,CAAlB,CAA5C;EAAA;EAAA,IAAOI,cAAP;EAAA,IAAuBC,iBAAvB;;EAMA,oBACE,0DACE,gCAAC,SAAD;IAAW,IAAI,EAAE5B,IAAjB;IAAuB,QAAQ,EAAEW;EAAjC,GAA+Cc,IAA/C;IAAqD,GAAG,EAAEN;EAA1D,IACGC,OADH,aACGA,OADH,uBACGA,OAAO,CAAES,GAAT,CACC;IAAA,IACEC,KADF,SACEA,KADF;IAAA,IAESC,WAFT,SAEEV,KAFF;IAAA,IAGYW,cAHZ,SAGErB,QAHF;IAAA,0BAIEsB,OAJF;IAAA,IAIEA,QAJF,8BAIY,YAAM,CAAE,CAJpB;IAAA,IAKKC,UALL;;IAAA,oBAOE,gCAAC,YAAD;MACE,GAAG,EAAEH,WADP;MAEE,IAAI,EAAEJ,cAAc,KAAKI,WAAnB,GAAiC,SAAjC,GAA6C,OAFrD;MAGE,IAAI,EAAC,OAHP;MAIE,QAAQ,EAAEpB,QAAQ,IAAIqB,cAJxB;MAKE,IAAI,EAAER,IALR;MAME,OAAO,EAAE,iBAACW,CAAD,EAAO;QACdP,iBAAiB,CAACG,WAAD,CAAjB;;QACAE,QAAO,CAACE,CAAD,CAAP;MACD;IATH,GAUMD,UAVN,GAYGJ,KAZH,CAPF;EAAA,CADD,CADH,CADF,CADF;AA8BD,CAlDgB,CAAnB;AAqDAb,UAAU,CAACmB,WAAX,GAAyB,YAAzB;eAEenB,U"}
|
|
@@ -27,7 +27,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
27
27
|
|
|
28
28
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
29
29
|
|
|
30
|
-
function _extends() { _extends = Object.assign
|
|
30
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
31
31
|
|
|
32
32
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
33
33
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.js","names":["StyledRadioGroupSkeleton","styled","Skeleton","omitEmotionProps","p","theme","baseHeight","sizeStyles","RadioGroupSkeleton","forwardRef","ref","width","rest","displayName"],"sources":["../../../src/RadioGroupSkeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport React, { forwardRef } from 'react';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport Skeleton, { SkeletonProps } from '../Skeleton';\n\nexport interface RadioGroupSkeletonProps extends SkeletonProps, WithSize {\n /**\n * The width of the skeleton.\n * @default 10em\n */\n width?: string;\n}\n\nconst StyledRadioGroupSkeleton = styled(\n Skeleton,\n omitEmotionProps('size')\n)<WithSize>`\n height: calc(${(p) => p.theme.baseHeight}em + 2px);\n ${sizeStyles};\n`;\n\n/**\n * Provides a radio group placeholder while a user waits for the content to load.\n */\nconst RadioGroupSkeleton = forwardRef<HTMLDivElement, RadioGroupSkeletonProps>(\n ({ width = '10em', ...rest }, ref) => (\n <StyledRadioGroupSkeleton width={width} {...rest} ref={ref} />\n )\n);\n\nRadioGroupSkeleton.displayName = 'RadioGroupSkeleton';\n\nexport default RadioGroupSkeleton;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;AAUA,IAAMA,wBAAwB,GAAG,IAAAC,kBAAA,EAC/BC,oBAD+B,EAE/B,IAAAC,uBAAA,EAAiB,MAAjB,CAF+B,CAAH,gHAIb,UAACC,CAAD;EAAA,OAAOA,CAAC,CAACC,KAAF,CAAQC,UAAf;AAAA,CAJa,EAK1BC,kBAL0B,CAA9B;AAQA;AACA;AACA;;AACA,IAAMC,kBAAkB,gBAAG,IAAAC,iBAAA,EACzB,gBAA8BC,GAA9B;EAAA,sBAAGC,KAAH;EAAA,IAAGA,KAAH,2BAAW,MAAX;EAAA,IAAsBC,IAAtB;;EAAA,oBACE,gCAAC,wBAAD;IAA0B,KAAK,EAAED;EAAjC,GAA4CC,IAA5C;IAAkD,GAAG,EAAEF;EAAvD,GADF;AAAA,CADyB,CAA3B;AAMAF,kBAAkB,CAACK,WAAnB,GAAiC,oBAAjC;eAEeL,kB"}
|
package/dist/cjs/Result/index.js
CHANGED
|
@@ -29,7 +29,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
29
29
|
|
|
30
30
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
31
31
|
|
|
32
|
-
function _extends() { _extends = Object.assign
|
|
32
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
33
33
|
|
|
34
34
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
35
35
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.js","names":["Container","styled","omitEmotionProps","p","clr","theme","colorText","sizeStyles","IconContainer","div","resultColorIcon","Text","Title","sizes","large","Description","small","resultColorDescription","ActiveElements","m","min","sm","ChildrenContainer","Result","forwardRef","ref","title","description","icon","actions","children","rest","displayName"],"sources":["../../../src/Result/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport styled from '@emotion/styled';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr } from '@os-design/theming';\nimport { m } from '@os-design/media';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface ResultProps extends JsxDivProps, WithSize {\n /**\n * The title of the result.\n */\n title: string;\n /**\n * The description that is under the title.\n * @default undefined\n */\n description?: string;\n /**\n * The icon that is located above the title.\n * @default undefined\n */\n icon?: React.ReactElement;\n /**\n * Active elements.\n * @default undefined\n */\n actions?: React.ReactNode;\n}\n\nconst Container = styled('div', omitEmotionProps('size'))<WithSize>`\n display: flex;\n flex-direction: column;\n align-items: center;\n\n color: ${(p) => clr(p.theme.colorText)};\n padding: 2.6em 0;\n\n ${sizeStyles};\n`;\n\nconst IconContainer = styled.div`\n font-size: 6em;\n line-height: 1;\n color: ${(p) => clr(p.theme.resultColorIcon)};\n margin-bottom: 0.1em;\n`;\n\nconst Text = styled.div`\n text-align: center;\n max-width: 28em;\n`;\n\nconst Title = styled(Text)`\n font-size: ${(p) => p.theme.sizes.large}em;\n font-weight: 500;\n`;\n\nconst Description = styled(Text)`\n font-size: ${(p) => p.theme.sizes.small}em;\n color: ${(p) => clr(p.theme.resultColorDescription)};\n margin-top: 0.5em;\n`;\n\nconst ActiveElements = styled.div`\n margin-top: 2em;\n\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n\n & > *:not(:first-of-type) {\n margin-top: 0.5em;\n }\n\n ${m.min.sm} {\n flex-direction: row;\n\n & > *:not(:first-of-type) {\n margin-top: 0;\n margin-left: 0.5em;\n }\n }\n`;\n\nconst ChildrenContainer = styled.div`\n margin-top: 2em;\n`;\n\n/**\n * Used to give the user feedback instead of results.\n * For example, error happened, results not found, no results yet.\n */\nconst Result = forwardRef<HTMLDivElement, ResultProps>(\n ({ title, description, icon, actions, children, ...rest }, ref) => (\n <Container {...rest} ref={ref}>\n {icon && <IconContainer>{icon}</IconContainer>}\n <Title>{title}</Title>\n {description && <Description>{description}</Description>}\n {actions && <ActiveElements>{actions}</ActiveElements>}\n {children && <ChildrenContainer>{children}</ChildrenContainer>}\n </Container>\n )\n);\n\nResult.displayName = 'Result';\n\nexport default Result;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;AAyBA,IAAMA,SAAS,GAAG,IAAAC,kBAAA,EAAO,KAAP,EAAc,IAAAC,uBAAA,EAAiB,MAAjB,CAAd,CAAH,+LAKJ,UAACC,CAAD;EAAA,OAAO,IAAAC,YAAA,EAAID,CAAC,CAACE,KAAF,CAAQC,SAAZ,CAAP;AAAA,CALI,EAQXC,kBARW,CAAf;;AAWA,IAAMC,aAAa,GAAGP,kBAAA,CAAOQ,GAAV,yJAGR,UAACN,CAAD;EAAA,OAAO,IAAAC,YAAA,EAAID,CAAC,CAACE,KAAF,CAAQK,eAAZ,CAAP;AAAA,CAHQ,CAAnB;;AAOA,IAAMC,IAAI,GAAGV,kBAAA,CAAOQ,GAAV,oHAAV;;AAKA,IAAMG,KAAK,GAAG,IAAAX,kBAAA,EAAOU,IAAP,CAAH,qHACI,UAACR,CAAD;EAAA,OAAOA,CAAC,CAACE,KAAF,CAAQQ,KAAR,CAAcC,KAArB;AAAA,CADJ,CAAX;AAKA,IAAMC,WAAW,GAAG,IAAAd,kBAAA,EAAOU,IAAP,CAAH,sIACF,UAACR,CAAD;EAAA,OAAOA,CAAC,CAACE,KAAF,CAAQQ,KAAR,CAAcG,KAArB;AAAA,CADE,EAEN,UAACb,CAAD;EAAA,OAAO,IAAAC,YAAA,EAAID,CAAC,CAACE,KAAF,CAAQY,sBAAZ,CAAP;AAAA,CAFM,CAAjB;;AAMA,IAAMC,cAAc,GAAGjB,kBAAA,CAAOQ,GAAV,qYAYhBU,QAAA,CAAEC,GAAF,CAAMC,EAZU,CAApB;;AAsBA,IAAMC,iBAAiB,GAAGrB,kBAAA,CAAOQ,GAAV,6FAAvB;AAIA;AACA;AACA;AACA;;;AACA,IAAMc,MAAM,gBAAG,IAAAC,iBAAA,EACb,gBAA2DC,GAA3D;EAAA,IAAGC,KAAH,QAAGA,KAAH;EAAA,IAAUC,WAAV,QAAUA,WAAV;EAAA,IAAuBC,IAAvB,QAAuBA,IAAvB;EAAA,IAA6BC,OAA7B,QAA6BA,OAA7B;EAAA,IAAsCC,QAAtC,QAAsCA,QAAtC;EAAA,IAAmDC,IAAnD;;EAAA,oBACE,gCAAC,SAAD,eAAeA,IAAf;IAAqB,GAAG,EAAEN;EAA1B,IACGG,IAAI,iBAAI,gCAAC,aAAD,QAAgBA,IAAhB,CADX,eAEE,gCAAC,KAAD,QAAQF,KAAR,CAFF,EAGGC,WAAW,iBAAI,gCAAC,WAAD,QAAcA,WAAd,CAHlB,EAIGE,OAAO,iBAAI,gCAAC,cAAD,QAAiBA,OAAjB,CAJd,EAKGC,QAAQ,iBAAI,gCAAC,iBAAD,QAAoBA,QAApB,CALf,CADF;AAAA,CADa,CAAf;AAYAP,MAAM,CAACS,WAAP,GAAqB,QAArB;eAEeT,M"}
|
|
@@ -37,7 +37,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
37
37
|
|
|
38
38
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
39
39
|
|
|
40
|
-
function _extends() { _extends = Object.assign
|
|
40
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
41
41
|
|
|
42
42
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
43
43
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.js","names":["fadeIn","keyframes","fadeOut","visibleStyles","p","visible","css","theme","transitionDelay","invisibleStyles","StyledButton","styled","Button","omitEmotionProps","containerPosition","right","scrollButtonMargin","bottom","clr","scrollButtonColorBoxShadow","ScrollButton","forwardRef","ref","container","scrollTo","minOffset","onClick","rest","useVisibility","useContainerPosition","useTheme","mounted","useClosable","clickHandler","useCallback","e","window","top","document","body","scrollHeight","containerElement","Element","current","t","buttonPrimaryColorBg","scrollButtonColorBg","buttonPrimaryColorText","scrollButtonColorText","buttonPrimaryColorBgHover","scrollButtonColorBgHover","displayName"],"sources":["../../../src/ScrollButton/index.tsx"],"sourcesContent":["import React, {\n forwardRef,\n MouseEventHandler,\n RefObject,\n useCallback,\n} from 'react';\nimport { Up, Down } from '@os-design/icons';\nimport styled from '@emotion/styled';\nimport { useClosable, omitEmotionProps } from '@os-design/utils';\nimport { clr, ThemeOverrider, useTheme } from '@os-design/theming';\nimport { css, keyframes } from '@emotion/react';\nimport Portal from '@os-design/portal';\nimport Button, { ButtonProps } from '../Button';\nimport useContainerPosition, {\n ContainerPosition,\n} from './utils/useContainerPosition';\nimport useVisibility from './utils/useVisibility';\n\nexport interface ScrollButtonProps extends Omit<ButtonProps, 'type' | 'wide'> {\n /**\n * The container that needs to be scrolled.\n * @default undefined\n */\n container?: Element | RefObject<Element>;\n /**\n * Where the container should be scrolled.\n * @default top\n */\n scrollTo?: 'top' | 'bottom';\n /**\n * The min scroll offset when the button is visible.\n * @default 500\n */\n minOffset?: number;\n}\n\nconst fadeIn = keyframes`\n from { opacity: 0; }\n to { opacity: 1; }\n`;\n\nconst fadeOut = keyframes`\n from { opacity: 1; }\n to { opacity: 0; }\n`;\n\nconst visibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${fadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst invisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${fadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ninterface StyledButtonProps {\n visible: boolean;\n containerPosition: ContainerPosition;\n}\nconst StyledButton = styled(\n Button,\n omitEmotionProps('visible', 'containerPosition')\n)<StyledButtonProps>`\n position: fixed;\n right: ${(p) =>\n p.containerPosition.right > 0\n ? `calc(${p.containerPosition.right}px + ${p.theme.scrollButtonMargin}em)`\n : `${p.theme.scrollButtonMargin}em`};\n bottom: ${(p) =>\n `calc(${\n p.containerPosition.bottom > 0 ? `${p.containerPosition.bottom}px + ` : ''\n }${p.theme.scrollButtonMargin}em + env(safe-area-inset-bottom))`};\n box-shadow: 0 0.15em 0.8em ${(p) => clr(p.theme.scrollButtonColorBoxShadow)};\n\n ${visibleStyles};\n ${invisibleStyles};\n`;\n\n/**\n * The button to scroll to either the top or bottom of the container.\n */\nconst ScrollButton = forwardRef<HTMLButtonElement, ScrollButtonProps>(\n (\n {\n container,\n scrollTo = 'top',\n minOffset = 500,\n onClick = () => {},\n ...rest\n },\n ref\n ) => {\n const visible = useVisibility({ container, scrollTo, minOffset });\n const containerPosition = useContainerPosition(container);\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n // Scroll through the container when the user clicks the button\n const clickHandler = useCallback<MouseEventHandler<HTMLButtonElement>>(\n (e) => {\n // Scroll the window if the container is not defined\n if (!container) {\n window.scrollTo({\n top: scrollTo === 'top' ? 0 : document.body.scrollHeight,\n });\n return;\n }\n\n // Otherwise scroll the container\n const containerElement =\n container instanceof Element ? container : container.current;\n if (!containerElement) return;\n\n containerElement.scrollTo({\n top: scrollTo === 'top' ? 0 : containerElement.scrollHeight,\n });\n\n // Call the passed onClick handler\n onClick(e);\n },\n [container, scrollTo, onClick]\n );\n\n if (!mounted) return null;\n\n return (\n <Portal container={container}>\n <ThemeOverrider\n overrides={(t) => ({\n buttonPrimaryColorBg: t.scrollButtonColorBg,\n buttonPrimaryColorText: t.scrollButtonColorText,\n buttonPrimaryColorBgHover: t.scrollButtonColorBgHover,\n })}\n >\n <StyledButton\n visible={visible}\n containerPosition={containerPosition}\n wide='never'\n size='small'\n onClick={clickHandler}\n aria-label={`Scroll to ${scrollTo}`}\n {...rest}\n ref={ref}\n >\n {scrollTo === 'top' ? <Up /> : <Down />}\n </StyledButton>\n </ThemeOverrider>\n </Portal>\n );\n }\n);\n\nScrollButton.displayName = 'ScrollButton';\n\nexport default ScrollButton;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"useContainerPosition.js","names":["useContainerPosition","container","useState","right","bottom","position","setPosition","updatePosition","useCallback","element","Element","current","getBoundingClientRect","window","innerWidth","innerHeight","useBrowserLayoutEffect","useResizeObserver"],"sources":["../../../../src/ScrollButton/utils/useContainerPosition.ts"],"sourcesContent":["import { RefObject, useCallback, useState } from 'react';\nimport { useResizeObserver, useBrowserLayoutEffect } from '@os-design/utils';\n\nexport interface ContainerPosition {\n right: number;\n bottom: number;\n}\n\n/**\n * Calculates the position of the container.\n */\nconst useContainerPosition = (\n container?: Element | RefObject<Element>\n): ContainerPosition => {\n const [position, setPosition] = useState<ContainerPosition>({\n right: 0,\n bottom: 0,\n });\n\n const updatePosition = useCallback(() => {\n if (!container) return;\n const element =\n container instanceof Element ? container : container.current;\n if (!element) return;\n\n const { right, bottom } = element.getBoundingClientRect();\n const { innerWidth, innerHeight } = window;\n\n setPosition({\n right: innerWidth - right,\n bottom: innerHeight - bottom,\n });\n }, [container]);\n\n useBrowserLayoutEffect(() => updatePosition(), [updatePosition]);\n useResizeObserver(container as never, updatePosition);\n\n return position;\n};\n\nexport default useContainerPosition;\n"],"mappings":";;;;;;;AAAA;;AACA;;;;;;;;;;;;;;AAOA;AACA;AACA;AACA,IAAMA,oBAAoB,GAAG,SAAvBA,oBAAuB,CAC3BC,SAD2B,EAEL;EACtB,gBAAgC,IAAAC,eAAA,EAA4B;IAC1DC,KAAK,EAAE,CADmD;IAE1DC,MAAM,EAAE;EAFkD,CAA5B,CAAhC;EAAA;EAAA,IAAOC,QAAP;EAAA,IAAiBC,WAAjB;;EAKA,IAAMC,cAAc,GAAG,IAAAC,kBAAA,EAAY,YAAM;IACvC,IAAI,CAACP,SAAL,EAAgB;IAChB,IAAMQ,OAAO,GACXR,SAAS,YAAYS,OAArB,GAA+BT,SAA/B,GAA2CA,SAAS,CAACU,OADvD;IAEA,IAAI,CAACF,OAAL,EAAc;;IAEd,4BAA0BA,OAAO,CAACG,qBAAR,EAA1B;IAAA,IAAQT,KAAR,yBAAQA,KAAR;IAAA,IAAeC,MAAf,yBAAeA,MAAf;;IACA,cAAoCS,MAApC;IAAA,IAAQC,UAAR,WAAQA,UAAR;IAAA,IAAoBC,WAApB,WAAoBA,WAApB;IAEAT,WAAW,CAAC;MACVH,KAAK,EAAEW,UAAU,GAAGX,KADV;MAEVC,MAAM,EAAEW,WAAW,GAAGX;IAFZ,CAAD,CAAX;EAID,CAbsB,EAapB,CAACH,SAAD,CAboB,CAAvB;EAeA,IAAAe,6BAAA,EAAuB;IAAA,OAAMT,cAAc,EAApB;EAAA,CAAvB,EAA+C,CAACA,cAAD,CAA/C;EACA,IAAAU,wBAAA,EAAkBhB,SAAlB,EAAsCM,cAAtC;EAEA,OAAOF,QAAP;AACD,CA3BD;;eA6BeL,oB"}
|