npm - @os-design/core - Versions diffs - 1.0.180 → 1.0.182 - Mend

@os-design/core 1.0.180 → 1.0.182

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.

Files changed (11) hide show

package/dist/cjs/Modal/index.js +1 -1
package/dist/cjs/Modal/index.js.map +1 -1
package/dist/cjs/PageHeaderInputSearch/index.js +23 -21
package/dist/cjs/PageHeaderInputSearch/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/PageHeaderInputSearch/index.js +8 -7
package/dist/esm/PageHeaderInputSearch/index.js.map +1 -1
package/dist/types/PageHeaderInputSearch/index.d.ts +1 -0
package/dist/types/PageHeaderInputSearch/index.d.ts.map +1 -1
package/package.json +2 -2

package/dist/cjs/Modal/index.js CHANGED Viewed

@@ -164,7 +164,7 @@ var Modal = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, ref) {
   return /*#__PURE__*/_react2["default"].createElement(_portal["default"], null, /*#__PURE__*/_react2["default"].createElement(ModalMask, {
     visible: visible
   }), /*#__PURE__*/_react2["default"].createElement(Container, {
-    onClick: clickHandler
+    onClick: onClose
   }, /*#__PURE__*/_react2["default"].createElement(_reactFocusLock["default"], {
     autoFocus: true
   }, /*#__PURE__*/_react2["default"].createElement(CloseModalContext.Provider, {

package/dist/cjs/Modal/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["MODAL_CONTAINER_Z_INDEX","MODAL_BOX_SHADOW_SIZE_EM","maskFadeIn","keyframes","maskFadeOut","maskVisibleStyles","p","visible","css","theme","transitionDelay","maskInvisibleStyles","ModalMask","styled","omitEmotionProps","clr","modalMaskColorBg","Container","div","m","min","xs","enableScrollingStyles","contentFadeIn","contentFadeOut","contentFadeInXs","contentFadeOutXs","contentVisibleStyles","contentInvisibleStyles","Content","colorBg","colorText","modalColorBoxShadow","borderRadius","modalWidth","sizeStyles","Header","modalHeaderHeight","modalHeaderColorBorderBottom","modalBodyPaddingHorizontal","Math","max","buttonPaddingHorizontal","Title","sizes","large","ellipsisStyles","Body","modalBodyPaddingVertical","Footer","CloseModalContext","React","createContext","useCloseModal","useContext","Modal","forwardRef","ref","title","okText","okDanger","okLoading","okDisabled","header","footer","locale","defaultLocale","onClose","onOk","size","id","onClick","children","rest","contentRef","useRef","useTheme","mounted","useClosable","useBodyScroll","titleId","useMemo","random","toString","slice","bodyId","clickHandler","useCallback","e","stopPropagation","keyDownHandler","key","ariaLabelledBy","undefined","t","modalCloseButtonPaddingHorizontal","closeLabel","displayName"],"sources":["../../../src/Modal/index.tsx"],"sourcesContent":["import { css, keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Close } from '@os-design/icons';\nimport { m } from '@os-design/media';\nimport Portal from '@os-design/portal';\nimport {\n ellipsisStyles,\n enableScrollingStyles,\n sizeStyles,\n WithSize,\n} from '@os-design/styles';\nimport { clr, ThemeOverrider, useTheme } from '@os-design/theming';\nimport { omitEmotionProps, useBodyScroll, useClosable } from '@os-design/utils';\nimport React, {\n forwardRef,\n useCallback,\n useContext,\n useMemo,\n useRef,\n} from 'react';\nimport FocusLock from 'react-focus-lock';\nimport Button from '../Button';\nimport defaultLocale, { ModalLocale } from './utils/defaultLocale';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface ModalProps extends JsxDivProps, WithSize {\n /*\n The title of the modal.\n * @default undefined\n /\n title?: string;\n /\n The text of the OK button.\n * @default OK\n /\n okText?: string;\n /\n Sets the danger styles to the OK button.\n * @default false\n /\n okDanger?: boolean;\n /\n Whether the OK button is loading.\n * @default false\n /\n okLoading?: boolean;\n /\n Whether the OK button is disabled.\n * @default false\n /\n okDisabled?: boolean;\n /\n The header component.\n * Set as null if you don't need the default header.\n * @default undefined\n /\n header?: React.ReactNode;\n /\n The footer component.\n * Set as null if you don't need the default footer.\n * @default undefined\n /\n footer?: React.ReactNode;\n /\n Whether the modal is visible.\n * @default false\n /\n visible?: boolean;\n /\n The locale of the modal.\n * @default undefined\n /\n locale?: ModalLocale;\n /\n Specifies a callback that will be called when a user clicks the mask or\n * the close button. The callback should set the visible state to false.\n * @default undefined\n /\n onClose?: () => void;\n /\n Specifies a callback that will be called when a user clicks the OK button.\n * @default undefined\n /\n onOk?: () => void;\n}\n\nconst MODAL_CONTAINER_Z_INDEX = 1000;\nconst MODAL_BOX_SHADOW_SIZE_EM = 1;\n\nconst maskFadeIn = keyframes`\n from { opacity: 0; }\n to { opacity: 1; }\n`;\n\nconst maskFadeOut = keyframes`\n from { opacity: 1; }\n to { opacity: 0; }\n`;\n\nconst maskVisibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${maskFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst maskInvisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${maskFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ntype MaskProps = Pick<ModalProps, 'visible'>;\nexport const ModalMask = styled('div', omitEmotionProps('visible'))<MaskProps>`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n background-color: ${(p) => clr(p.theme.modalMaskColorBg)};\n z-index: ${MODAL_CONTAINER_Z_INDEX};\n ${maskVisibleStyles};\n ${maskInvisibleStyles};\n`;\n\nconst Container = styled.div`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n z-index: ${MODAL_CONTAINER_Z_INDEX};\n\n ${m.min.xs} {\n ${enableScrollingStyles('y')};\n }\n`;\n\nconst contentFadeIn = keyframes`\n from { transform: translateY(calc(var(--vh, 1vh) 100 + ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateY(calc(var(--vh, 1vh) * 100 - 100%)); }\n`;\n\nconst contentFadeOut = keyframes`\n from { transform: translateY(calc(var(--vh, 1vh) * 100 - 100%)); }\n to { transform: translateY(calc(var(--vh, 1vh) * 100 + ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst contentFadeInXs = keyframes`\n from { transform: translateY(calc(-100% - ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateY(6em); }\n`;\n\nconst contentFadeOutXs = keyframes`\n from { transform: translateY(6em); }\n to { transform: translateY(calc(-100% - ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst contentVisibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${contentFadeIn} ${p.theme.transitionDelay}ms forwards;\n ${m.min.xs} {\n animation: ${contentFadeInXs} ${p.theme.transitionDelay}ms forwards;\n }\n `;\n\nconst contentInvisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${contentFadeOut} ${p.theme.transitionDelay}ms forwards;\n ${m.min.xs} {\n animation: ${contentFadeOutXs} ${p.theme.transitionDelay}ms forwards;\n }\n `;\n\ntype ContentProps = Pick<ModalProps, 'visible' \| 'size'>;\nconst Content = styled(\n 'div',\n omitEmotionProps('visible', 'size')\n)<ContentProps>`\n position: absolute;\n display: flex;\n flex-direction: column;\n padding-bottom: env(safe-area-inset-bottom);\n\n background-color: ${(p) => clr(p.theme.colorBg)};\n color: ${(p) => clr(p.theme.colorText)};\n box-shadow: 0 0 ${MODAL_BOX_SHADOW_SIZE_EM}em\n ${(p) => clr(p.theme.modalColorBoxShadow)};\n\n width: 100%;\n max-height: 100%;\n border-radius: ${(p) => p.theme.borderRadius}em\n ${(p) => p.theme.borderRadius}em 0 0;\n\n ${m.min.xs} {\n width: ${(p) => p.theme.modalWidth}em;\n max-height: unset;\n border-radius: ${(p) => p.theme.borderRadius}em;\n\n left: 50%;\n margin-left: ${(p) => -p.theme.modalWidth / 2}em;\n }\n\n ${contentVisibleStyles};\n ${contentInvisibleStyles}\n ${sizeStyles};\n`;\n\nconst Header = styled.div`\n flex-shrink: 0;\n height: ${(p) => p.theme.modalHeaderHeight}em;\n border-bottom: 1px solid ${(p) => clr(p.theme.modalHeaderColorBorderBottom)};\n box-sizing: border-box;\n\n display: flex;\n align-items: center;\n\n padding-left: ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em;\n padding-right: ${(p) =>\n Math.max(\n p.theme.modalBodyPaddingHorizontal[1] - p.theme.buttonPaddingHorizontal,\n 0\n )}em;\n\n ${m.min.xs} {\n padding-left: ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em;\n padding-right: ${(p) =>\n Math.max(\n p.theme.modalBodyPaddingHorizontal[1] - p.theme.buttonPaddingHorizontal,\n 0\n )}em;\n }\n`;\n\nconst Title = styled.div`\n flex: 1;\n font-size: ${(p) => p.theme.sizes.large}em;\n font-weight: 500;\n ${ellipsisStyles};\n`;\n\nconst Body = styled.div`\n flex-grow: 1;\n\n padding: ${(p) => p.theme.modalBodyPaddingVertical[0]}em\n ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em;\n\n ${m.min.xs} {\n padding: ${(p) => p.theme.modalBodyPaddingVertical[1]}em\n ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em;\n }\n\n ${enableScrollingStyles('y')};\n`;\n\nconst Footer = styled.div`\n padding: 0 ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em\n ${(p) => p.theme.modalBodyPaddingVertical[0]}em;\n\n ${m.min.xs} {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n\n padding: 0 ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em\n ${(p) => p.theme.modalBodyPaddingVertical[1]}em;\n }\n`;\n\nconst CloseModalContext = React.createContext<() => void>(() => {});\n\nexport const useCloseModal = () => useContext(CloseModalContext);\n\n/*\n The base pop-up window.\n */\nconst Modal = forwardRef<HTMLDivElement, ModalProps>(\n (\n {\n title,\n okText = 'OK',\n okDanger = false,\n okLoading = false,\n okDisabled = false,\n header,\n footer,\n visible = false,\n locale = defaultLocale,\n onClose = () => {},\n onOk,\n size,\n id,\n onClick = () => {},\n children,\n ...rest\n },\n ref\n ) => {\n const contentRef = useRef<HTMLDivElement>(null);\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n useBodyScroll(!visible);\n\n const titleId = useMemo(\n () => `modal-title-${Math.random().toString(36).slice(2, 11)}`,\n []\n );\n const bodyId = useMemo(\n () => id \|\| `modal-body-${Math.random().toString(36).slice(2, 11)}`,\n [id]\n );\n\n const clickHandler = useCallback(\n (e) => {\n e.stopPropagation();\n onClick(e);\n },\n [onClick]\n );\n\n const keyDownHandler = useCallback(\n (e) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onClose();\n }\n },\n [onClose]\n );\n\n const ariaLabelledBy = useMemo(\n () => (header === undefined ? titleId : undefined),\n [header, titleId]\n );\n\n if (!mounted) return null;\n\n return (\n <Portal>\n <ModalMask visible={visible} />\n <Container onClick={clickHandler}>\n <FocusLock autoFocus>\n <CloseModalContext.Provider value={onClose}>\n <Content\n visible={visible}\n size={size}\n tabIndex={-1}\n onKeyDown={keyDownHandler}\n onClick={clickHandler}\n role='dialog'\n aria-modal\n aria-labelledby={ariaLabelledBy}\n aria-describedby={bodyId}\n ref={contentRef}\n >\n {header === undefined ? (\n <ThemeOverrider\n overrides={(t) => ({\n buttonPaddingHorizontal:\n t.modalCloseButtonPaddingHorizontal,\n })}\n >\n <Header>\n <Title id={titleId}>{title}</Title>\n <Button\n type='ghost'\n wide='never'\n onClick={onClose}\n aria-label={locale.closeLabel}\n >\n <Close />\n </Button>\n </Header>\n </ThemeOverrider>\n ) : (\n header\n )}\n\n <Body id={bodyId} {...rest} ref={ref}>\n {children}\n </Body>\n\n {footer === undefined ? (\n <Footer>\n <Button\n danger={okDanger}\n loading={okLoading}\n disabled={okDisabled}\n onClick={onOk}\n >\n {okText}\n </Button>\n </Footer>\n ) : (\n footer\n )}\n </Content>\n </CloseModalContext.Provider>\n </FocusLock>\n </Container>\n </Portal>\n );\n }\n);\n\nModal.displayName = 'Modal';\n\nexport default Modal;\n"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","names":["MODAL_CONTAINER_Z_INDEX","MODAL_BOX_SHADOW_SIZE_EM","maskFadeIn","keyframes","maskFadeOut","maskVisibleStyles","p","visible","css","theme","transitionDelay","maskInvisibleStyles","ModalMask","styled","omitEmotionProps","clr","modalMaskColorBg","Container","div","m","min","xs","enableScrollingStyles","contentFadeIn","contentFadeOut","contentFadeInXs","contentFadeOutXs","contentVisibleStyles","contentInvisibleStyles","Content","colorBg","colorText","modalColorBoxShadow","borderRadius","modalWidth","sizeStyles","Header","modalHeaderHeight","modalHeaderColorBorderBottom","modalBodyPaddingHorizontal","Math","max","buttonPaddingHorizontal","Title","sizes","large","ellipsisStyles","Body","modalBodyPaddingVertical","Footer","CloseModalContext","React","createContext","useCloseModal","useContext","Modal","forwardRef","ref","title","okText","okDanger","okLoading","okDisabled","header","footer","locale","defaultLocale","onClose","onOk","size","id","onClick","children","rest","contentRef","useRef","useTheme","mounted","useClosable","useBodyScroll","titleId","useMemo","random","toString","slice","bodyId","clickHandler","useCallback","e","stopPropagation","keyDownHandler","key","ariaLabelledBy","undefined","t","modalCloseButtonPaddingHorizontal","closeLabel","displayName"],"sources":["../../../src/Modal/index.tsx"],"sourcesContent":["import { css, keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Close } from '@os-design/icons';\nimport { m } from '@os-design/media';\nimport Portal from '@os-design/portal';\nimport {\n ellipsisStyles,\n enableScrollingStyles,\n sizeStyles,\n WithSize,\n} from '@os-design/styles';\nimport { clr, ThemeOverrider, useTheme } from '@os-design/theming';\nimport { omitEmotionProps, useBodyScroll, useClosable } from '@os-design/utils';\nimport React, {\n forwardRef,\n useCallback,\n useContext,\n useMemo,\n useRef,\n} from 'react';\nimport FocusLock from 'react-focus-lock';\nimport Button from '../Button';\nimport defaultLocale, { ModalLocale } from './utils/defaultLocale';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface ModalProps extends JsxDivProps, WithSize {\n /*\n The title of the modal.\n * @default undefined\n /\n title?: string;\n /\n The text of the OK button.\n * @default OK\n /\n okText?: string;\n /\n Sets the danger styles to the OK button.\n * @default false\n /\n okDanger?: boolean;\n /\n Whether the OK button is loading.\n * @default false\n /\n okLoading?: boolean;\n /\n Whether the OK button is disabled.\n * @default false\n /\n okDisabled?: boolean;\n /\n The header component.\n * Set as null if you don't need the default header.\n * @default undefined\n /\n header?: React.ReactNode;\n /\n The footer component.\n * Set as null if you don't need the default footer.\n * @default undefined\n /\n footer?: React.ReactNode;\n /\n Whether the modal is visible.\n * @default false\n /\n visible?: boolean;\n /\n The locale of the modal.\n * @default undefined\n /\n locale?: ModalLocale;\n /\n Specifies a callback that will be called when a user clicks the mask or\n * the close button. The callback should set the visible state to false.\n * @default undefined\n /\n onClose?: () => void;\n /\n Specifies a callback that will be called when a user clicks the OK button.\n * @default undefined\n /\n onOk?: () => void;\n}\n\nconst MODAL_CONTAINER_Z_INDEX = 1000;\nconst MODAL_BOX_SHADOW_SIZE_EM = 1;\n\nconst maskFadeIn = keyframes`\n from { opacity: 0; }\n to { opacity: 1; }\n`;\n\nconst maskFadeOut = keyframes`\n from { opacity: 1; }\n to { opacity: 0; }\n`;\n\nconst maskVisibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${maskFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst maskInvisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${maskFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ntype MaskProps = Pick<ModalProps, 'visible'>;\nexport const ModalMask = styled('div', omitEmotionProps('visible'))<MaskProps>`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n background-color: ${(p) => clr(p.theme.modalMaskColorBg)};\n z-index: ${MODAL_CONTAINER_Z_INDEX};\n ${maskVisibleStyles};\n ${maskInvisibleStyles};\n`;\n\nconst Container = styled.div`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n z-index: ${MODAL_CONTAINER_Z_INDEX};\n\n ${m.min.xs} {\n ${enableScrollingStyles('y')};\n }\n`;\n\nconst contentFadeIn = keyframes`\n from { transform: translateY(calc(var(--vh, 1vh) 100 + ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateY(calc(var(--vh, 1vh) * 100 - 100%)); }\n`;\n\nconst contentFadeOut = keyframes`\n from { transform: translateY(calc(var(--vh, 1vh) * 100 - 100%)); }\n to { transform: translateY(calc(var(--vh, 1vh) * 100 + ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst contentFadeInXs = keyframes`\n from { transform: translateY(calc(-100% - ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateY(6em); }\n`;\n\nconst contentFadeOutXs = keyframes`\n from { transform: translateY(6em); }\n to { transform: translateY(calc(-100% - ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst contentVisibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${contentFadeIn} ${p.theme.transitionDelay}ms forwards;\n ${m.min.xs} {\n animation: ${contentFadeInXs} ${p.theme.transitionDelay}ms forwards;\n }\n `;\n\nconst contentInvisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${contentFadeOut} ${p.theme.transitionDelay}ms forwards;\n ${m.min.xs} {\n animation: ${contentFadeOutXs} ${p.theme.transitionDelay}ms forwards;\n }\n `;\n\ntype ContentProps = Pick<ModalProps, 'visible' \| 'size'>;\nconst Content = styled(\n 'div',\n omitEmotionProps('visible', 'size')\n)<ContentProps>`\n position: absolute;\n display: flex;\n flex-direction: column;\n padding-bottom: env(safe-area-inset-bottom);\n\n background-color: ${(p) => clr(p.theme.colorBg)};\n color: ${(p) => clr(p.theme.colorText)};\n box-shadow: 0 0 ${MODAL_BOX_SHADOW_SIZE_EM}em\n ${(p) => clr(p.theme.modalColorBoxShadow)};\n\n width: 100%;\n max-height: 100%;\n border-radius: ${(p) => p.theme.borderRadius}em\n ${(p) => p.theme.borderRadius}em 0 0;\n\n ${m.min.xs} {\n width: ${(p) => p.theme.modalWidth}em;\n max-height: unset;\n border-radius: ${(p) => p.theme.borderRadius}em;\n\n left: 50%;\n margin-left: ${(p) => -p.theme.modalWidth / 2}em;\n }\n\n ${contentVisibleStyles};\n ${contentInvisibleStyles}\n ${sizeStyles};\n`;\n\nconst Header = styled.div`\n flex-shrink: 0;\n height: ${(p) => p.theme.modalHeaderHeight}em;\n border-bottom: 1px solid ${(p) => clr(p.theme.modalHeaderColorBorderBottom)};\n box-sizing: border-box;\n\n display: flex;\n align-items: center;\n\n padding-left: ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em;\n padding-right: ${(p) =>\n Math.max(\n p.theme.modalBodyPaddingHorizontal[1] - p.theme.buttonPaddingHorizontal,\n 0\n )}em;\n\n ${m.min.xs} {\n padding-left: ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em;\n padding-right: ${(p) =>\n Math.max(\n p.theme.modalBodyPaddingHorizontal[1] - p.theme.buttonPaddingHorizontal,\n 0\n )}em;\n }\n`;\n\nconst Title = styled.div`\n flex: 1;\n font-size: ${(p) => p.theme.sizes.large}em;\n font-weight: 500;\n ${ellipsisStyles};\n`;\n\nconst Body = styled.div`\n flex-grow: 1;\n\n padding: ${(p) => p.theme.modalBodyPaddingVertical[0]}em\n ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em;\n\n ${m.min.xs} {\n padding: ${(p) => p.theme.modalBodyPaddingVertical[1]}em\n ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em;\n }\n\n ${enableScrollingStyles('y')};\n`;\n\nconst Footer = styled.div`\n padding: 0 ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em\n ${(p) => p.theme.modalBodyPaddingVertical[0]}em;\n\n ${m.min.xs} {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n\n padding: 0 ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em\n ${(p) => p.theme.modalBodyPaddingVertical[1]}em;\n }\n`;\n\nconst CloseModalContext = React.createContext<() => void>(() => {});\n\nexport const useCloseModal = () => useContext(CloseModalContext);\n\n/*\n The base pop-up window.\n */\nconst Modal = forwardRef<HTMLDivElement, ModalProps>(\n (\n {\n title,\n okText = 'OK',\n okDanger = false,\n okLoading = false,\n okDisabled = false,\n header,\n footer,\n visible = false,\n locale = defaultLocale,\n onClose = () => {},\n onOk,\n size,\n id,\n onClick = () => {},\n children,\n ...rest\n },\n ref\n ) => {\n const contentRef = useRef<HTMLDivElement>(null);\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n useBodyScroll(!visible);\n\n const titleId = useMemo(\n () => `modal-title-${Math.random().toString(36).slice(2, 11)}`,\n []\n );\n const bodyId = useMemo(\n () => id \|\| `modal-body-${Math.random().toString(36).slice(2, 11)}`,\n [id]\n );\n\n const clickHandler = useCallback(\n (e) => {\n e.stopPropagation();\n onClick(e);\n },\n [onClick]\n );\n\n const keyDownHandler = useCallback(\n (e) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onClose();\n }\n },\n [onClose]\n );\n\n const ariaLabelledBy = useMemo(\n () => (header === undefined ? titleId : undefined),\n [header, titleId]\n );\n\n if (!mounted) return null;\n\n return (\n <Portal>\n <ModalMask visible={visible} />\n <Container onClick={onClose}>\n <FocusLock autoFocus>\n <CloseModalContext.Provider value={onClose}>\n <Content\n visible={visible}\n size={size}\n tabIndex={-1}\n onKeyDown={keyDownHandler}\n onClick={clickHandler}\n role='dialog'\n aria-modal\n aria-labelledby={ariaLabelledBy}\n aria-describedby={bodyId}\n ref={contentRef}\n >\n {header === undefined ? (\n <ThemeOverrider\n overrides={(t) => ({\n buttonPaddingHorizontal:\n t.modalCloseButtonPaddingHorizontal,\n })}\n >\n <Header>\n <Title id={titleId}>{title}</Title>\n <Button\n type='ghost'\n wide='never'\n onClick={onClose}\n aria-label={locale.closeLabel}\n >\n <Close />\n </Button>\n </Header>\n </ThemeOverrider>\n ) : (\n header\n )}\n\n <Body id={bodyId} {...rest} ref={ref}>\n {children}\n </Body>\n\n {footer === undefined ? (\n <Footer>\n <Button\n danger={okDanger}\n loading={okLoading}\n disabled={okDisabled}\n onClick={onOk}\n >\n {okText}\n </Button>\n </Footer>\n ) : (\n footer\n )}\n </Content>\n </CloseModalContext.Provider>\n </FocusLock>\n </Container>\n </Portal>\n );\n }\n);\n\nModal.displayName = 'Modal';\n\nexport default Modal;\n"],"mappings":"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"}

package/dist/cjs/PageHeaderInputSearch/index.js CHANGED Viewed

@@ -5,22 +5,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _icons = require("@os-design/icons");
+var _react = require("@emotion/react");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _utils = require("@os-design/utils");
+var _icons = require("@os-design/icons");
 var _theming = require("@os-design/theming");
-var _react2 = require("@emotion/react");
-var _InputSearch = _interopRequireDefault(require("../InputSearch"));
+var _utils = require("@os-design/utils");
+var _react2 = _interopRequireWildcard(require("react"));
 var _Button = _interopRequireDefault(require("../Button"));
-var _PageHeader = require("../PageHeader");
+var _InputSearch = _interopRequireDefault(require("../InputSearch"));
 var _LayoutContext = _interopRequireDefault(require("../Layout/LayoutContext"));
+var _PageHeader = require("../PageHeader");
 var _defaultLocale = _interopRequireDefault(require("./utils/defaultLocale"));
-var _excluded = ["locale", "onClose", "loading"];
+var _excluded = ["locale", "autoOpen", "onClose", "loading"];
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 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; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 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); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -31,13 +31,13 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 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; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-var fadeIn = (0, _react2.keyframes)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  from { transform: translateY(-100%); }\n  to { transform: translateY(0); }\n"])));
-var fadeOut = (0, _react2.keyframes)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  from { transform: translateY(0); }\n  to { transform: translateY(-100%); }\n"])));
+var fadeIn = (0, _react.keyframes)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  from { transform: translateY(-100%); }\n  to { transform: translateY(0); }\n"])));
+var fadeOut = (0, _react.keyframes)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  from { transform: translateY(0); }\n  to { transform: translateY(-100%); }\n"])));
 var visibleStyles = function visibleStyles(p) {
-  return p.visible && (0, _react2.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    animation: ", " ", "ms forwards;\n  "])), fadeIn, p.theme.transitionDelay);
+  return p.visible && (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    animation: ", " ", "ms forwards;\n  "])), fadeIn, p.theme.transitionDelay);
 };
 var invisibleStyles = function invisibleStyles(p) {
-  return !p.visible && (0, _react2.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    animation: ", " ", "ms forwards;\n  "])), fadeOut, p.theme.transitionDelay);
+  return !p.visible && (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    animation: ", " ", "ms forwards;\n  "])), fadeOut, p.theme.transitionDelay);
 };
 var Container = (0, _styled["default"])(_PageHeader.PageHeaderContainer, (0, _utils.omitEmotionProps)('visible'))(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  z-index: 102; // After PageHeaderContainer\n  ", ";\n  ", ";\n"])), visibleStyles, invisibleStyles);
 var CloseButton = (0, _styled["default"])(_Button["default"])(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  margin-left: ", "em;\n"])), function (p) {
@@ -47,24 +47,26 @@ var CloseButton = (0, _styled["default"])(_Button["default"])(_templateObject6 |
 /**
  * The search input for the page header.
  */
-var PageHeaderInputSearch = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+var PageHeaderInputSearch = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, ref) {
   var _ref$locale = _ref.locale,
     locale = _ref$locale === void 0 ? _defaultLocale["default"] : _ref$locale,
+    _ref$autoOpen = _ref.autoOpen,
+    autoOpen = _ref$autoOpen === void 0 ? false : _ref$autoOpen,
     _ref$onClose = _ref.onClose,
     onClose = _ref$onClose === void 0 ? function () {} : _ref$onClose,
     _ref$loading = _ref.loading,
     loading = _ref$loading === void 0 ? false : _ref$loading,
     rest = _objectWithoutProperties(_ref, _excluded);
-  var _useState = (0, _react.useState)(false),
+  var _useState = (0, _react2.useState)(autoOpen),
     _useState2 = _slicedToArray(_useState, 2),
     visible = _useState2[0],
     setVisible = _useState2[1];
   var _useTheme = (0, _theming.useTheme)(),
     theme = _useTheme.theme;
   var mounted = (0, _utils.useClosable)(visible, theme.transitionDelay);
-  var _useContext = (0, _react.useContext)(_LayoutContext["default"]),
+  var _useContext = (0, _react2.useContext)(_LayoutContext["default"]),
     hasNavigation = _useContext.hasNavigation;
-  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+  return /*#__PURE__*/_react2["default"].createElement(_react2["default"].Fragment, null, /*#__PURE__*/_react2["default"].createElement(_Button["default"], {
     type: "ghost",
     wide: "never",
     loading: loading,
@@ -72,23 +74,23 @@ var PageHeaderInputSearch = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
       return setVisible(true);
     },
     "aria-label": locale.searchLabel
-  }, /*#__PURE__*/_react["default"].createElement(_icons.Search, null)), mounted && /*#__PURE__*/_react["default"].createElement(_theming.ThemeOverrider, {
+  }, /*#__PURE__*/_react2["default"].createElement(_icons.Search, null)), mounted && /*#__PURE__*/_react2["default"].createElement(_theming.ThemeOverrider, {
     overrides: function overrides(t) {
       return {
         buttonPaddingHorizontal: t.pageHeaderButtonPaddingHorizontal
       };
     }
-  }, /*#__PURE__*/_react["default"].createElement(Container, {
+  }, /*#__PURE__*/_react2["default"].createElement(Container, {
     visible: visible,
     rightIsGhostButton: true,
     hasNavigationIndent: hasNavigation
-  }, /*#__PURE__*/_react["default"].createElement(_InputSearch["default"], _extends({
+  }, /*#__PURE__*/_react2["default"].createElement(_InputSearch["default"], _extends({
     autoFocus: true,
     locale: locale,
     loading: loading
   }, rest, {
     ref: ref
-  })), /*#__PURE__*/_react["default"].createElement(CloseButton, {
+  })), /*#__PURE__*/_react2["default"].createElement(CloseButton, {
     type: "ghost",
     wide: "never",
     onClick: function onClick() {
@@ -96,7 +98,7 @@ var PageHeaderInputSearch = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
       onClose();
     },
     "aria-label": locale.closeLabel
-  }, /*#__PURE__*/_react["default"].createElement(_icons.Close, null)))));
+  }, /*#__PURE__*/_react2["default"].createElement(_icons.Close, null)))));
 });
 PageHeaderInputSearch.displayName = 'PageHeaderInputSearch';
 var _default = PageHeaderInputSearch;

package/dist/cjs/PageHeaderInputSearch/index.js.map CHANGED Viewed

	@@ -1 +1 @@
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","loading","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>(\n (\n { locale = defaultLocale, onClose = () => {}, loading = false, ...rest },\n ref\n ) => {\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 loading={loading}\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\n autoFocus\n locale={locale}\n loading={loading}\n {...rest}\n ref={ref}\n />\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);\n\nPageHeaderInputSearch.displayName = 'PageHeaderInputSearch';\n\nexport default PageHeaderInputSearch;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAE+B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;~~AAgB~~/B,IAAMA,MAAM,OAAGC,~~iBAAS~~,sJAGvB;AAED,IAAMC,OAAO,OAAGD,~~iBAAS~~,wJAGxB;AAED,IAAME,aAAa,GAAG,SAAhBA,aAAa,CAAIC,CAAC;EAAA,OACtBA,CAAC,CAACC,OAAO,QACTC,~~WAAG~~,mHACYN,MAAM,EAAII,CAAC,CAACG,KAAK,CAACC,eAAe,CAC/C;AAAA;AAEH,IAAMC,eAAe,GAAG,SAAlBA,eAAe,CAAIL,CAAC;EAAA,OACxB,CAACA,CAAC,CAACC,OAAO,QACVC,~~WAAG~~,mHACYJ,OAAO,EAAIE,CAAC,CAACG,KAAK,CAACC,eAAe,CAChD;AAAA;AAKH,IAAME,SAAS,GAAG,IAAAC,kBAAM,EACtBC,+BAAmB,EACnB,IAAAC,uBAAgB,EAAC,SAAS,CAAC,CAC5B,0IAEGV,aAAa,EACbM,eAAe,CAClB;AAED,IAAMK,WAAW,GAAG,IAAAH,kBAAM,EAACI,kBAAM,CAAC,kGACjB,UAACX,CAAC;EAAA,OAAKA,CAAC,CAACG,KAAK,CAACS,gCAAgC;AAAA,EAC/D;;AAED;AACA;AACA;AACA,IAAMC,qBAAqB,gBAAG,IAAAC,~~iBAAU~~,EAItC,~~gBAEEC~~,GAAG,EACA;EAAA,~~uBAFDC~~,MAAM;IAANA,MAAM,4BAAGC,yBAAa;IAAA,~~oBAAEC~~,OAAO;IAAPA,OAAO,6BAAG,YAAM,CAAC,CAAC;IAAA,~~oBAAEC~~,OAAO;IAAPA,OAAO,6BAAG,KAAK;~~IAAKC~~,IAAI;~~EAGtE~~,gBAA8B,IAAAC,~~eAAQ~~,~~EAAC~~,~~KAAK~~,CAAC;IAAA;~~IAAtCpB~~,OAAO;~~IAAEqB~~,UAAU;EAC1B,gBAAkB,IAAAC,iBAAQ,GAAE;~~IAApBpB~~,KAAK,aAALA,KAAK;EACb,~~IAAMqB~~,OAAO,GAAG,IAAAC,kBAAW,~~EAACxB~~,OAAO,EAAEE,KAAK,CAACC,eAAe,CAAC;EAC3D,kBAA0B,~~IAAAsB~~,~~iBAAU~~,EAACC,yBAAa,CAAC;IAA3CC,aAAa,eAAbA,aAAa;EAErB,oBACE~~,+EACE~~,~~gCAAC~~,kBAAM;IACL,IAAI,EAAC,OAAO;IACZ,IAAI,EAAC,OAAO;IACZ,OAAO,EAAET,OAAQ;IACjB,OAAO,EAAE;MAAA,OAAMG,UAAU,CAAC,IAAI,CAAC;IAAA,CAAC;IAChC,~~cAAYN~~,MAAM,~~CAACa~~;EAAY,gBAE/B,~~gCAAC~~,aAAM,OAAG,CACH,EAERL,OAAO,iBACN,~~gCAAC~~,uBAAc;IACb,SAAS,EAAE,mBAACM,CAAC;MAAA,OAAM;QACjBC,uBAAuB,EAAED,CAAC,CAACE;MAC7B,CAAC;IAAA;EAAE,gBAEH,~~gCAAC~~,SAAS;IACR,OAAO,~~EAAE/B~~,OAAQ;IACjB,kBAAkB;IAClB,mBAAmB,~~EAAE2B~~;EAAc,gBAEnC,~~gCAAC~~,uBAAW;IACV,SAAS;IACT,MAAM,~~EAAEZ~~,MAAO;IACf,OAAO,~~EAAEG~~;EAAQ,GACbC,IAAI;IACR,GAAG,~~EAAEL~~;EAAI,GACT,eACF,~~gCAAC~~,WAAW;IACV,IAAI,EAAC,OAAO;IACZ,IAAI,EAAC,OAAO;IACZ,OAAO,EAAE,mBAAM;~~MACbO~~,UAAU,CAAC,KAAK,CAAC;MACjBJ,OAAO,EAAE;IACX,CAAE;IACF,~~cAAYF~~,MAAM,~~CAACiB~~;EAAW,gBAE9B,~~gCAAC~~,YAAK,OAAG,CACG,CACJ,CAEf,CACA;AAEP,CAAC,CACF;~~AAEDpB~~,qBAAqB,~~CAACqB~~,WAAW,GAAG,uBAAuB;AAAC,~~eAE7CrB~~,qBAAqB;AAAA"}
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","autoOpen","onClose","loading","rest","useState","setVisible","useTheme","mounted","useClosable","useContext","LayoutContext","hasNavigation","searchLabel","t","buttonPaddingHorizontal","pageHeaderButtonPaddingHorizontal","closeLabel","displayName"],"sources":["../../../src/PageHeaderInputSearch/index.tsx"],"sourcesContent":["import { css, keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Close, Search } from '@os-design/icons';\nimport { ThemeOverrider, useTheme } from '@os-design/theming';\nimport { omitEmotionProps, useClosable } from '@os-design/utils';\nimport React, { forwardRef, useContext, useState } from 'react';\nimport Button from '../Button';\nimport InputSearch, { InputSearchProps } from '../InputSearch';\nimport LayoutContext from '../Layout/LayoutContext';\nimport { PageHeaderContainer } from '../PageHeader';\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 Whether the search input opens on mount.\n * @default false\n /\n autoOpen?: boolean;\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>(\n (\n {\n locale = defaultLocale,\n autoOpen = false,\n onClose = () => {},\n loading = false,\n ...rest\n },\n ref\n ) => {\n const [visible, setVisible] = useState(autoOpen);\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 loading={loading}\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\n autoFocus\n locale={locale}\n loading={loading}\n {...rest}\n ref={ref}\n />\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);\n\nPageHeaderInputSearch.displayName = 'PageHeaderInputSearch';\n\nexport default PageHeaderInputSearch;\n"],"mappings":"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"}

package/dist/esm/Modal/index.js CHANGED Viewed

@@ -203,7 +203,7 @@ const Modal = /*#__PURE__*/forwardRef(({
   return /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(ModalMask, {
     visible: visible
   }), /*#__PURE__*/React.createElement(Container, {
-    onClick: clickHandler
+    onClick: onClose
   }, /*#__PURE__*/React.createElement(FocusLock, {
     autoFocus: true
   }, /*#__PURE__*/React.createElement(CloseModalContext.Provider, {

package/dist/esm/Modal/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["css","keyframes","styled","Close","m","Portal","ellipsisStyles","enableScrollingStyles","sizeStyles","clr","ThemeOverrider","useTheme","omitEmotionProps","useBodyScroll","useClosable","React","forwardRef","useCallback","useContext","useMemo","useRef","FocusLock","Button","defaultLocale","MODAL_CONTAINER_Z_INDEX","MODAL_BOX_SHADOW_SIZE_EM","maskFadeIn","maskFadeOut","maskVisibleStyles","p","visible","theme","transitionDelay","maskInvisibleStyles","ModalMask","modalMaskColorBg","Container","div","min","xs","contentFadeIn","contentFadeOut","contentFadeInXs","contentFadeOutXs","contentVisibleStyles","contentInvisibleStyles","Content","colorBg","colorText","modalColorBoxShadow","borderRadius","modalWidth","Header","modalHeaderHeight","modalHeaderColorBorderBottom","modalBodyPaddingHorizontal","Math","max","buttonPaddingHorizontal","Title","sizes","large","Body","modalBodyPaddingVertical","Footer","CloseModalContext","createContext","useCloseModal","Modal","title","okText","okDanger","okLoading","okDisabled","header","footer","locale","onClose","onOk","size","id","onClick","children","rest","ref","contentRef","mounted","titleId","random","toString","slice","bodyId","clickHandler","e","stopPropagation","keyDownHandler","key","ariaLabelledBy","undefined","t","modalCloseButtonPaddingHorizontal","closeLabel","displayName"],"sources":["../../../src/Modal/index.tsx"],"sourcesContent":["import { css, keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Close } from '@os-design/icons';\nimport { m } from '@os-design/media';\nimport Portal from '@os-design/portal';\nimport {\n ellipsisStyles,\n enableScrollingStyles,\n sizeStyles,\n WithSize,\n} from '@os-design/styles';\nimport { clr, ThemeOverrider, useTheme } from '@os-design/theming';\nimport { omitEmotionProps, useBodyScroll, useClosable } from '@os-design/utils';\nimport React, {\n forwardRef,\n useCallback,\n useContext,\n useMemo,\n useRef,\n} from 'react';\nimport FocusLock from 'react-focus-lock';\nimport Button from '../Button';\nimport defaultLocale, { ModalLocale } from './utils/defaultLocale';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface ModalProps extends JsxDivProps, WithSize {\n /*\n The title of the modal.\n * @default undefined\n /\n title?: string;\n /\n The text of the OK button.\n * @default OK\n /\n okText?: string;\n /\n Sets the danger styles to the OK button.\n * @default false\n /\n okDanger?: boolean;\n /\n Whether the OK button is loading.\n * @default false\n /\n okLoading?: boolean;\n /\n Whether the OK button is disabled.\n * @default false\n /\n okDisabled?: boolean;\n /\n The header component.\n * Set as null if you don't need the default header.\n * @default undefined\n /\n header?: React.ReactNode;\n /\n The footer component.\n * Set as null if you don't need the default footer.\n * @default undefined\n /\n footer?: React.ReactNode;\n /\n Whether the modal is visible.\n * @default false\n /\n visible?: boolean;\n /\n The locale of the modal.\n * @default undefined\n /\n locale?: ModalLocale;\n /\n Specifies a callback that will be called when a user clicks the mask or\n * the close button. The callback should set the visible state to false.\n * @default undefined\n /\n onClose?: () => void;\n /\n Specifies a callback that will be called when a user clicks the OK button.\n * @default undefined\n /\n onOk?: () => void;\n}\n\nconst MODAL_CONTAINER_Z_INDEX = 1000;\nconst MODAL_BOX_SHADOW_SIZE_EM = 1;\n\nconst maskFadeIn = keyframes`\n from { opacity: 0; }\n to { opacity: 1; }\n`;\n\nconst maskFadeOut = keyframes`\n from { opacity: 1; }\n to { opacity: 0; }\n`;\n\nconst maskVisibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${maskFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst maskInvisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${maskFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ntype MaskProps = Pick<ModalProps, 'visible'>;\nexport const ModalMask = styled('div', omitEmotionProps('visible'))<MaskProps>`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n background-color: ${(p) => clr(p.theme.modalMaskColorBg)};\n z-index: ${MODAL_CONTAINER_Z_INDEX};\n ${maskVisibleStyles};\n ${maskInvisibleStyles};\n`;\n\nconst Container = styled.div`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n z-index: ${MODAL_CONTAINER_Z_INDEX};\n\n ${m.min.xs} {\n ${enableScrollingStyles('y')};\n }\n`;\n\nconst contentFadeIn = keyframes`\n from { transform: translateY(calc(var(--vh, 1vh) 100 + ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateY(calc(var(--vh, 1vh) * 100 - 100%)); }\n`;\n\nconst contentFadeOut = keyframes`\n from { transform: translateY(calc(var(--vh, 1vh) * 100 - 100%)); }\n to { transform: translateY(calc(var(--vh, 1vh) * 100 + ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst contentFadeInXs = keyframes`\n from { transform: translateY(calc(-100% - ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateY(6em); }\n`;\n\nconst contentFadeOutXs = keyframes`\n from { transform: translateY(6em); }\n to { transform: translateY(calc(-100% - ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst contentVisibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${contentFadeIn} ${p.theme.transitionDelay}ms forwards;\n ${m.min.xs} {\n animation: ${contentFadeInXs} ${p.theme.transitionDelay}ms forwards;\n }\n `;\n\nconst contentInvisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${contentFadeOut} ${p.theme.transitionDelay}ms forwards;\n ${m.min.xs} {\n animation: ${contentFadeOutXs} ${p.theme.transitionDelay}ms forwards;\n }\n `;\n\ntype ContentProps = Pick<ModalProps, 'visible' \| 'size'>;\nconst Content = styled(\n 'div',\n omitEmotionProps('visible', 'size')\n)<ContentProps>`\n position: absolute;\n display: flex;\n flex-direction: column;\n padding-bottom: env(safe-area-inset-bottom);\n\n background-color: ${(p) => clr(p.theme.colorBg)};\n color: ${(p) => clr(p.theme.colorText)};\n box-shadow: 0 0 ${MODAL_BOX_SHADOW_SIZE_EM}em\n ${(p) => clr(p.theme.modalColorBoxShadow)};\n\n width: 100%;\n max-height: 100%;\n border-radius: ${(p) => p.theme.borderRadius}em\n ${(p) => p.theme.borderRadius}em 0 0;\n\n ${m.min.xs} {\n width: ${(p) => p.theme.modalWidth}em;\n max-height: unset;\n border-radius: ${(p) => p.theme.borderRadius}em;\n\n left: 50%;\n margin-left: ${(p) => -p.theme.modalWidth / 2}em;\n }\n\n ${contentVisibleStyles};\n ${contentInvisibleStyles}\n ${sizeStyles};\n`;\n\nconst Header = styled.div`\n flex-shrink: 0;\n height: ${(p) => p.theme.modalHeaderHeight}em;\n border-bottom: 1px solid ${(p) => clr(p.theme.modalHeaderColorBorderBottom)};\n box-sizing: border-box;\n\n display: flex;\n align-items: center;\n\n padding-left: ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em;\n padding-right: ${(p) =>\n Math.max(\n p.theme.modalBodyPaddingHorizontal[1] - p.theme.buttonPaddingHorizontal,\n 0\n )}em;\n\n ${m.min.xs} {\n padding-left: ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em;\n padding-right: ${(p) =>\n Math.max(\n p.theme.modalBodyPaddingHorizontal[1] - p.theme.buttonPaddingHorizontal,\n 0\n )}em;\n }\n`;\n\nconst Title = styled.div`\n flex: 1;\n font-size: ${(p) => p.theme.sizes.large}em;\n font-weight: 500;\n ${ellipsisStyles};\n`;\n\nconst Body = styled.div`\n flex-grow: 1;\n\n padding: ${(p) => p.theme.modalBodyPaddingVertical[0]}em\n ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em;\n\n ${m.min.xs} {\n padding: ${(p) => p.theme.modalBodyPaddingVertical[1]}em\n ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em;\n }\n\n ${enableScrollingStyles('y')};\n`;\n\nconst Footer = styled.div`\n padding: 0 ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em\n ${(p) => p.theme.modalBodyPaddingVertical[0]}em;\n\n ${m.min.xs} {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n\n padding: 0 ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em\n ${(p) => p.theme.modalBodyPaddingVertical[1]}em;\n }\n`;\n\nconst CloseModalContext = React.createContext<() => void>(() => {});\n\nexport const useCloseModal = () => useContext(CloseModalContext);\n\n/*\n The base pop-up window.\n */\nconst Modal = forwardRef<HTMLDivElement, ModalProps>(\n (\n {\n title,\n okText = 'OK',\n okDanger = false,\n okLoading = false,\n okDisabled = false,\n header,\n footer,\n visible = false,\n locale = defaultLocale,\n onClose = () => {},\n onOk,\n size,\n id,\n onClick = () => {},\n children,\n ...rest\n },\n ref\n ) => {\n const contentRef = useRef<HTMLDivElement>(null);\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n useBodyScroll(!visible);\n\n const titleId = useMemo(\n () => `modal-title-${Math.random().toString(36).slice(2, 11)}`,\n []\n );\n const bodyId = useMemo(\n () => id \|\| `modal-body-${Math.random().toString(36).slice(2, 11)}`,\n [id]\n );\n\n const clickHandler = useCallback(\n (e) => {\n e.stopPropagation();\n onClick(e);\n },\n [onClick]\n );\n\n const keyDownHandler = useCallback(\n (e) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onClose();\n }\n },\n [onClose]\n );\n\n const ariaLabelledBy = useMemo(\n () => (header === undefined ? titleId : undefined),\n [header, titleId]\n );\n\n if (!mounted) return null;\n\n return (\n <Portal>\n <ModalMask visible={visible} />\n <Container onClick={clickHandler}>\n <FocusLock autoFocus>\n <CloseModalContext.Provider value={onClose}>\n <Content\n visible={visible}\n size={size}\n tabIndex={-1}\n onKeyDown={keyDownHandler}\n onClick={clickHandler}\n role='dialog'\n aria-modal\n aria-labelledby={ariaLabelledBy}\n aria-describedby={bodyId}\n ref={contentRef}\n >\n {header === undefined ? (\n <ThemeOverrider\n overrides={(t) => ({\n buttonPaddingHorizontal:\n t.modalCloseButtonPaddingHorizontal,\n })}\n >\n <Header>\n <Title id={titleId}>{title}</Title>\n <Button\n type='ghost'\n wide='never'\n onClick={onClose}\n aria-label={locale.closeLabel}\n >\n <Close />\n </Button>\n </Header>\n </ThemeOverrider>\n ) : (\n header\n )}\n\n <Body id={bodyId} {...rest} ref={ref}>\n {children}\n </Body>\n\n {footer === undefined ? (\n <Footer>\n <Button\n danger={okDanger}\n loading={okLoading}\n disabled={okDisabled}\n onClick={onOk}\n >\n {okText}\n </Button>\n </Footer>\n ) : (\n footer\n )}\n </Content>\n </CloseModalContext.Provider>\n </FocusLock>\n </Container>\n </Portal>\n );\n }\n);\n\nModal.displayName = 'Modal';\n\nexport default Modal;\n"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","names":["css","keyframes","styled","Close","m","Portal","ellipsisStyles","enableScrollingStyles","sizeStyles","clr","ThemeOverrider","useTheme","omitEmotionProps","useBodyScroll","useClosable","React","forwardRef","useCallback","useContext","useMemo","useRef","FocusLock","Button","defaultLocale","MODAL_CONTAINER_Z_INDEX","MODAL_BOX_SHADOW_SIZE_EM","maskFadeIn","maskFadeOut","maskVisibleStyles","p","visible","theme","transitionDelay","maskInvisibleStyles","ModalMask","modalMaskColorBg","Container","div","min","xs","contentFadeIn","contentFadeOut","contentFadeInXs","contentFadeOutXs","contentVisibleStyles","contentInvisibleStyles","Content","colorBg","colorText","modalColorBoxShadow","borderRadius","modalWidth","Header","modalHeaderHeight","modalHeaderColorBorderBottom","modalBodyPaddingHorizontal","Math","max","buttonPaddingHorizontal","Title","sizes","large","Body","modalBodyPaddingVertical","Footer","CloseModalContext","createContext","useCloseModal","Modal","title","okText","okDanger","okLoading","okDisabled","header","footer","locale","onClose","onOk","size","id","onClick","children","rest","ref","contentRef","mounted","titleId","random","toString","slice","bodyId","clickHandler","e","stopPropagation","keyDownHandler","key","ariaLabelledBy","undefined","t","modalCloseButtonPaddingHorizontal","closeLabel","displayName"],"sources":["../../../src/Modal/index.tsx"],"sourcesContent":["import { css, keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Close } from '@os-design/icons';\nimport { m } from '@os-design/media';\nimport Portal from '@os-design/portal';\nimport {\n ellipsisStyles,\n enableScrollingStyles,\n sizeStyles,\n WithSize,\n} from '@os-design/styles';\nimport { clr, ThemeOverrider, useTheme } from '@os-design/theming';\nimport { omitEmotionProps, useBodyScroll, useClosable } from '@os-design/utils';\nimport React, {\n forwardRef,\n useCallback,\n useContext,\n useMemo,\n useRef,\n} from 'react';\nimport FocusLock from 'react-focus-lock';\nimport Button from '../Button';\nimport defaultLocale, { ModalLocale } from './utils/defaultLocale';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface ModalProps extends JsxDivProps, WithSize {\n /*\n The title of the modal.\n * @default undefined\n /\n title?: string;\n /\n The text of the OK button.\n * @default OK\n /\n okText?: string;\n /\n Sets the danger styles to the OK button.\n * @default false\n /\n okDanger?: boolean;\n /\n Whether the OK button is loading.\n * @default false\n /\n okLoading?: boolean;\n /\n Whether the OK button is disabled.\n * @default false\n /\n okDisabled?: boolean;\n /\n The header component.\n * Set as null if you don't need the default header.\n * @default undefined\n /\n header?: React.ReactNode;\n /\n The footer component.\n * Set as null if you don't need the default footer.\n * @default undefined\n /\n footer?: React.ReactNode;\n /\n Whether the modal is visible.\n * @default false\n /\n visible?: boolean;\n /\n The locale of the modal.\n * @default undefined\n /\n locale?: ModalLocale;\n /\n Specifies a callback that will be called when a user clicks the mask or\n * the close button. The callback should set the visible state to false.\n * @default undefined\n /\n onClose?: () => void;\n /\n Specifies a callback that will be called when a user clicks the OK button.\n * @default undefined\n /\n onOk?: () => void;\n}\n\nconst MODAL_CONTAINER_Z_INDEX = 1000;\nconst MODAL_BOX_SHADOW_SIZE_EM = 1;\n\nconst maskFadeIn = keyframes`\n from { opacity: 0; }\n to { opacity: 1; }\n`;\n\nconst maskFadeOut = keyframes`\n from { opacity: 1; }\n to { opacity: 0; }\n`;\n\nconst maskVisibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${maskFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst maskInvisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${maskFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ntype MaskProps = Pick<ModalProps, 'visible'>;\nexport const ModalMask = styled('div', omitEmotionProps('visible'))<MaskProps>`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n background-color: ${(p) => clr(p.theme.modalMaskColorBg)};\n z-index: ${MODAL_CONTAINER_Z_INDEX};\n ${maskVisibleStyles};\n ${maskInvisibleStyles};\n`;\n\nconst Container = styled.div`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n z-index: ${MODAL_CONTAINER_Z_INDEX};\n\n ${m.min.xs} {\n ${enableScrollingStyles('y')};\n }\n`;\n\nconst contentFadeIn = keyframes`\n from { transform: translateY(calc(var(--vh, 1vh) 100 + ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateY(calc(var(--vh, 1vh) * 100 - 100%)); }\n`;\n\nconst contentFadeOut = keyframes`\n from { transform: translateY(calc(var(--vh, 1vh) * 100 - 100%)); }\n to { transform: translateY(calc(var(--vh, 1vh) * 100 + ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst contentFadeInXs = keyframes`\n from { transform: translateY(calc(-100% - ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateY(6em); }\n`;\n\nconst contentFadeOutXs = keyframes`\n from { transform: translateY(6em); }\n to { transform: translateY(calc(-100% - ${MODAL_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst contentVisibleStyles = (p) =>\n p.visible &&\n css`\n animation: ${contentFadeIn} ${p.theme.transitionDelay}ms forwards;\n ${m.min.xs} {\n animation: ${contentFadeInXs} ${p.theme.transitionDelay}ms forwards;\n }\n `;\n\nconst contentInvisibleStyles = (p) =>\n !p.visible &&\n css`\n animation: ${contentFadeOut} ${p.theme.transitionDelay}ms forwards;\n ${m.min.xs} {\n animation: ${contentFadeOutXs} ${p.theme.transitionDelay}ms forwards;\n }\n `;\n\ntype ContentProps = Pick<ModalProps, 'visible' \| 'size'>;\nconst Content = styled(\n 'div',\n omitEmotionProps('visible', 'size')\n)<ContentProps>`\n position: absolute;\n display: flex;\n flex-direction: column;\n padding-bottom: env(safe-area-inset-bottom);\n\n background-color: ${(p) => clr(p.theme.colorBg)};\n color: ${(p) => clr(p.theme.colorText)};\n box-shadow: 0 0 ${MODAL_BOX_SHADOW_SIZE_EM}em\n ${(p) => clr(p.theme.modalColorBoxShadow)};\n\n width: 100%;\n max-height: 100%;\n border-radius: ${(p) => p.theme.borderRadius}em\n ${(p) => p.theme.borderRadius}em 0 0;\n\n ${m.min.xs} {\n width: ${(p) => p.theme.modalWidth}em;\n max-height: unset;\n border-radius: ${(p) => p.theme.borderRadius}em;\n\n left: 50%;\n margin-left: ${(p) => -p.theme.modalWidth / 2}em;\n }\n\n ${contentVisibleStyles};\n ${contentInvisibleStyles}\n ${sizeStyles};\n`;\n\nconst Header = styled.div`\n flex-shrink: 0;\n height: ${(p) => p.theme.modalHeaderHeight}em;\n border-bottom: 1px solid ${(p) => clr(p.theme.modalHeaderColorBorderBottom)};\n box-sizing: border-box;\n\n display: flex;\n align-items: center;\n\n padding-left: ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em;\n padding-right: ${(p) =>\n Math.max(\n p.theme.modalBodyPaddingHorizontal[1] - p.theme.buttonPaddingHorizontal,\n 0\n )}em;\n\n ${m.min.xs} {\n padding-left: ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em;\n padding-right: ${(p) =>\n Math.max(\n p.theme.modalBodyPaddingHorizontal[1] - p.theme.buttonPaddingHorizontal,\n 0\n )}em;\n }\n`;\n\nconst Title = styled.div`\n flex: 1;\n font-size: ${(p) => p.theme.sizes.large}em;\n font-weight: 500;\n ${ellipsisStyles};\n`;\n\nconst Body = styled.div`\n flex-grow: 1;\n\n padding: ${(p) => p.theme.modalBodyPaddingVertical[0]}em\n ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em;\n\n ${m.min.xs} {\n padding: ${(p) => p.theme.modalBodyPaddingVertical[1]}em\n ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em;\n }\n\n ${enableScrollingStyles('y')};\n`;\n\nconst Footer = styled.div`\n padding: 0 ${(p) => p.theme.modalBodyPaddingHorizontal[0]}em\n ${(p) => p.theme.modalBodyPaddingVertical[0]}em;\n\n ${m.min.xs} {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n\n padding: 0 ${(p) => p.theme.modalBodyPaddingHorizontal[1]}em\n ${(p) => p.theme.modalBodyPaddingVertical[1]}em;\n }\n`;\n\nconst CloseModalContext = React.createContext<() => void>(() => {});\n\nexport const useCloseModal = () => useContext(CloseModalContext);\n\n/*\n The base pop-up window.\n */\nconst Modal = forwardRef<HTMLDivElement, ModalProps>(\n (\n {\n title,\n okText = 'OK',\n okDanger = false,\n okLoading = false,\n okDisabled = false,\n header,\n footer,\n visible = false,\n locale = defaultLocale,\n onClose = () => {},\n onOk,\n size,\n id,\n onClick = () => {},\n children,\n ...rest\n },\n ref\n ) => {\n const contentRef = useRef<HTMLDivElement>(null);\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n useBodyScroll(!visible);\n\n const titleId = useMemo(\n () => `modal-title-${Math.random().toString(36).slice(2, 11)}`,\n []\n );\n const bodyId = useMemo(\n () => id \|\| `modal-body-${Math.random().toString(36).slice(2, 11)}`,\n [id]\n );\n\n const clickHandler = useCallback(\n (e) => {\n e.stopPropagation();\n onClick(e);\n },\n [onClick]\n );\n\n const keyDownHandler = useCallback(\n (e) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n onClose();\n }\n },\n [onClose]\n );\n\n const ariaLabelledBy = useMemo(\n () => (header === undefined ? titleId : undefined),\n [header, titleId]\n );\n\n if (!mounted) return null;\n\n return (\n <Portal>\n <ModalMask visible={visible} />\n <Container onClick={onClose}>\n <FocusLock autoFocus>\n <CloseModalContext.Provider value={onClose}>\n <Content\n visible={visible}\n size={size}\n tabIndex={-1}\n onKeyDown={keyDownHandler}\n onClick={clickHandler}\n role='dialog'\n aria-modal\n aria-labelledby={ariaLabelledBy}\n aria-describedby={bodyId}\n ref={contentRef}\n >\n {header === undefined ? (\n <ThemeOverrider\n overrides={(t) => ({\n buttonPaddingHorizontal:\n t.modalCloseButtonPaddingHorizontal,\n })}\n >\n <Header>\n <Title id={titleId}>{title}</Title>\n <Button\n type='ghost'\n wide='never'\n onClick={onClose}\n aria-label={locale.closeLabel}\n >\n <Close />\n </Button>\n </Header>\n </ThemeOverrider>\n ) : (\n header\n )}\n\n <Body id={bodyId} {...rest} ref={ref}>\n {children}\n </Body>\n\n {footer === undefined ? (\n <Footer>\n <Button\n danger={okDanger}\n loading={okLoading}\n disabled={okDisabled}\n onClick={onOk}\n >\n {okText}\n </Button>\n </Footer>\n ) : (\n footer\n )}\n </Content>\n </CloseModalContext.Provider>\n </FocusLock>\n </Container>\n </Portal>\n );\n }\n);\n\nModal.displayName = 'Modal';\n\nexport default Modal;\n"],"mappings":"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"}

package/dist/esm/PageHeaderInputSearch/index.js CHANGED Viewed

@@ -1,14 +1,14 @@
 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); }
-import React, { forwardRef, useContext, useState } from 'react';
-import { Close, Search } from '@os-design/icons';
+import { css, keyframes } from '@emotion/react';
 import styled from '@emotion/styled';
-import { useClosable, omitEmotionProps } from '@os-design/utils';
+import { Close, Search } from '@os-design/icons';
 import { ThemeOverrider, useTheme } from '@os-design/theming';
-import { css, keyframes } from '@emotion/react';
-import InputSearch from '../InputSearch';
+import { omitEmotionProps, useClosable } from '@os-design/utils';
+import React, { forwardRef, useContext, useState } from 'react';
 import Button from '../Button';
-import { PageHeaderContainer } from '../PageHeader';
+import InputSearch from '../InputSearch';
 import LayoutContext from '../Layout/LayoutContext';
+import { PageHeaderContainer } from '../PageHeader';
 import defaultLocale from './utils/defaultLocale';
 const fadeIn = keyframes`
   from { transform: translateY(-100%); }
@@ -38,11 +38,12 @@ const CloseButton = styled(Button)`
  */
 const PageHeaderInputSearch = /*#__PURE__*/forwardRef(({
   locale = defaultLocale,
+  autoOpen = false,
   onClose = () => {},
   loading = false,
   ...rest
 }, ref) => {
-  const [visible, setVisible] = useState(false);
+  const [visible, setVisible] = useState(autoOpen);
   const {
     theme
   } = useTheme();

package/dist/esm/PageHeaderInputSearch/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":["~~React~~","~~forwardRef~~","~~useContext~~","~~useState","~~Close","Search","~~styled~~","~~useClosable~~","omitEmotionProps","~~ThemeOverrider~~","~~useTheme~~","~~css~~","~~keyframes~~","~~InputSearch~~","Button","~~PageHeaderContainer~~","LayoutContext","defaultLocale","fadeIn","fadeOut","visibleStyles","p","visible","theme","transitionDelay","invisibleStyles","Container","CloseButton","pageHeaderAddonPaddingHorizontal","PageHeaderInputSearch","locale","onClose","loading","rest","ref","setVisible","mounted","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>(\n (\n { locale = defaultLocale, onClose = () => {}, loading = false, ...rest },\n ref\n ) => {\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 loading={loading}\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\n autoFocus\n locale={locale}\n loading={loading}\n {...rest}\n ref={ref}\n />\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);\n\nPageHeaderInputSearch.displayName = 'PageHeaderInputSearch';\n\nexport default PageHeaderInputSearch;\n"],"mappings":";AAAA,~~OAAOA~~,~~KAAK~~,~~IAAIC,UAAU,~~EAAEC,~~UAAU~~,~~EAAEC,~~QAAQ,~~QAAQ,OAAO~~;AAC/D,~~SAASC,KAAK,EAAEC,MAAM,QAAQ,kBAAkB;AAChD,~~OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,~~WAAW~~,EAAEC,~~gBAAgB~~,QAAQ,kBAAkB;~~AAChE~~,SAASC,cAAc,EAAEC,QAAQ,QAAQ,oBAAoB;AAC7D,SAASC,~~GAAG~~,EAAEC,~~SAAS~~,QAAQ,~~gBAAgB~~;~~AAC/C~~,OAAOC,~~WAAW~~,~~MAA4B~~,~~gBAAgB~~;~~AAC9D~~,OAAOC,MAAM,MAAM,WAAW;AAC9B,~~SAASC~~,~~mBAAmB~~,~~QAAQ~~,~~eAAe~~;~~AACnD~~,OAAOC,aAAa,MAAM,yBAAyB;AACnD,OAAOC,aAAa,MAEb,uBAAuB;~~AAgB9B~~,MAAMC,MAAM,~~GAAGN~~,SAAU;AACzB;AACA;AACA,CAAC;AAED,~~MAAMO~~,OAAO,~~GAAGP~~,SAAU;AAC1B;AACA;AACA,CAAC;AAED,~~MAAMQ~~,aAAa,GAAIC,CAAC,IACtBA,CAAC,CAACC,OAAO,~~IACTX~~,GAAI;AACN,~~iBAAiBO~~,MAAO,IAAGG,CAAC,CAACE,KAAK,CAACC,eAAgB;AACnD,GAAG;AAEH,MAAMC,eAAe,GAAIJ,CAAC,IACxB,CAACA,CAAC,CAACC,OAAO,~~IACVX~~,GAAI;AACN,~~iBAAiBQ~~,OAAQ,IAAGE,CAAC,CAACE,KAAK,CAACC,eAAgB;AACpD,GAAG;AAKH,MAAME,SAAS,~~GAAGpB~~,MAAM,~~CACtBS~~,mBAAmB,~~EACnBP~~,gBAAgB,CAAC,SAAS,CAAC,CACX;AAClB;AACA,~~IAAIY~~,aAAc;AAClB,IAAIK,eAAgB;AACpB,CAAC;AAED,MAAME,WAAW,~~GAAGrB~~,MAAM,~~CAACQ~~,MAAM,CAAE;AACnC,~~iBAAkBO~~,CAAC,IAAKA,CAAC,CAACE,KAAK,CAACK,gCAAiC;AACjE,CAAC;;AAED;AACA;AACA;AACA,MAAMC,qBAAqB,~~gBAAG5B~~,UAAU,CAItC,CACE;~~EAAE6B~~,MAAM,GAAGb,aAAa;~~EAAEc~~,OAAO,GAAG,MAAM,CAAC,CAAC;~~EAAEC~~,OAAO,GAAG,KAAK;~~EAAE~~,GAAGC;~~AAAK~~,CAAC,~~EACxEC~~,GAAG,KACA;EACH,MAAM,~~CAACZ~~,OAAO,~~EAAEa~~,UAAU,CAAC,~~GAAGhC~~,QAAQ,~~CAAC~~,~~KAAK~~,CAAC;~~EAC7C~~,MAAM;~~IAAEoB~~;EAAM,CAAC,~~GAAGb~~,QAAQ,EAAE;EAC5B,~~MAAM0B~~,OAAO,GAAG7B,WAAW,~~CAACe~~,OAAO,EAAEC,KAAK,CAACC,eAAe,CAAC;EAC3D,MAAM;~~IAAEa~~;EAAc,CAAC,~~GAAGnC~~,UAAU,~~CAACc~~,aAAa,CAAC;EAEnD,oBACE,uDACE,oBAAC,MAAM;IACL,IAAI,EAAC,OAAO;IACZ,IAAI,EAAC,OAAO;IACZ,OAAO,~~EAAEgB~~,OAAQ;IACjB,OAAO,EAAE,MAAMG,UAAU,CAAC,IAAI,CAAE;IAChC,~~cAAYL~~,MAAM,~~CAACQ~~;EAAY,gBAE/B,oBAAC,MAAM,OAAG,CACH,EAERF,OAAO,iBACN,oBAAC,cAAc;IACb,SAAS,EAAGG,CAAC,KAAM;MACjBC,uBAAuB,EAAED,CAAC,CAACE;IAC7B,CAAC;EAAE,gBAEH,oBAAC,SAAS;IACR,OAAO,~~EAAEnB~~,OAAQ;IACjB,kBAAkB;IAClB,mBAAmB,~~EAAEe~~;EAAc,gBAEnC,oBAAC,WAAW;IACV,SAAS;IACT,MAAM,~~EAAEP~~,MAAO;IACf,OAAO,~~EAAEE~~;EAAQ,GACbC,IAAI;IACR,GAAG,EAAEC;EAAI,GACT,eACF,oBAAC,WAAW;IACV,IAAI,EAAC,OAAO;IACZ,IAAI,EAAC,OAAO;IACZ,OAAO,EAAE,MAAM;MACbC,UAAU,CAAC,KAAK,CAAC;MACjBJ,OAAO,EAAE;IACX,CAAE;IACF,~~cAAYD~~,MAAM,~~CAACY~~;EAAW,gBAE9B,oBAAC,KAAK,OAAG,CACG,CACJ,CAEf,CACA;AAEP,CAAC,CACF;~~AAEDb~~,qBAAqB,~~CAACc~~,WAAW,GAAG,uBAAuB;AAE3D,~~eAAed~~,qBAAqB"}
1	+ {"version":3,"file":"index.js","names":["css","keyframes","styled","Close","Search","ThemeOverrider","useTheme","omitEmotionProps","useClosable","React","forwardRef","useContext","useState","Button","InputSearch","LayoutContext","PageHeaderContainer","defaultLocale","fadeIn","fadeOut","visibleStyles","p","visible","theme","transitionDelay","invisibleStyles","Container","CloseButton","pageHeaderAddonPaddingHorizontal","PageHeaderInputSearch","locale","autoOpen","onClose","loading","rest","ref","setVisible","mounted","hasNavigation","searchLabel","t","buttonPaddingHorizontal","pageHeaderButtonPaddingHorizontal","closeLabel","displayName"],"sources":["../../../src/PageHeaderInputSearch/index.tsx"],"sourcesContent":["import { css, keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport { Close, Search } from '@os-design/icons';\nimport { ThemeOverrider, useTheme } from '@os-design/theming';\nimport { omitEmotionProps, useClosable } from '@os-design/utils';\nimport React, { forwardRef, useContext, useState } from 'react';\nimport Button from '../Button';\nimport InputSearch, { InputSearchProps } from '../InputSearch';\nimport LayoutContext from '../Layout/LayoutContext';\nimport { PageHeaderContainer } from '../PageHeader';\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 Whether the search input opens on mount.\n * @default false\n /\n autoOpen?: boolean;\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>(\n (\n {\n locale = defaultLocale,\n autoOpen = false,\n onClose = () => {},\n loading = false,\n ...rest\n },\n ref\n ) => {\n const [visible, setVisible] = useState(autoOpen);\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 loading={loading}\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\n autoFocus\n locale={locale}\n loading={loading}\n {...rest}\n ref={ref}\n />\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);\n\nPageHeaderInputSearch.displayName = 'PageHeaderInputSearch';\n\nexport default PageHeaderInputSearch;\n"],"mappings":"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"}

package/dist/types/PageHeaderInputSearch/index.d.ts CHANGED Viewed

@@ -3,6 +3,7 @@ import { InputSearchProps } from '../InputSearch';
 import { PageHeaderInputSearchLocale } from './utils/defaultLocale';
 export interface PageHeaderInputSearchProps extends Omit<InputSearchProps, 'size' | 'locale'> {
     locale?: PageHeaderInputSearchLocale;
+    autoOpen?: boolean;
     onClose?: () => void;
 }
 declare const PageHeaderInputSearch: React.ForwardRefExoticComponent<PageHeaderInputSearchProps & React.RefAttributes<HTMLInputElement>>;

package/dist/types/PageHeaderInputSearch/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/PageHeaderInputSearch/index.tsx"],"names":[],"mappings":"~~AAAA~~,OAAO,KAA2C,MAAM,OAAO,CAAC;~~AAMhE~~,OAAoB,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;~~AAI~~/D,OAAsB,EACpB,2BAA2B,EAC5B,MAAM,uBAAuB,CAAC;AAE/B,MAAM,WAAW,0BACf,SAAQ,IAAI,CAAC,gBAAgB,EAAE,MAAM,GAAG,QAAQ,CAAC;IAKjD,MAAM,CAAC,EAAE,2BAA2B,CAAC;IAKrC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AA2CD,QAAA,MAAM,qBAAqB,~~qGA4D1B~~,CAAC;AAIF,eAAe,qBAAqB,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/PageHeaderInputSearch/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAEhE,OAAoB,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAG/D,OAAsB,EACpB,2BAA2B,EAC5B,MAAM,uBAAuB,CAAC;AAE/B,MAAM,WAAW,0BACf,SAAQ,IAAI,CAAC,gBAAgB,EAAE,MAAM,GAAG,QAAQ,CAAC;IAKjD,MAAM,CAAC,EAAE,2BAA2B,CAAC;IAKrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAKnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AA2CD,QAAA,MAAM,qBAAqB,qGAkE1B,CAAC;AAIF,eAAe,qBAAqB,CAAC"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@os-design/core",
-  "version": "1.0.180",
+  "version": "1.0.182",
   "license": "UNLICENSED",
   "repository": "git@gitlab.com:os-team/libs/os-design.git",
   "main": "dist/cjs/index.js",
@@ -58,5 +58,5 @@
     "react": ">=18",
     "react-dom": ">=18"
   },
-  "gitHead": "11b900d189478819eaac6f8e9a5921f47fa87ea7"
+  "gitHead": "f474412e5f97b03b0768772e10a841a1d646f399"
 }