@os-design/core 1.0.225 → 1.0.226
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/Drawer/index.js
CHANGED
|
@@ -43,7 +43,7 @@ var placementRightVisibleStyles = function placementRightVisibleStyles(p) {
|
|
|
43
43
|
var placementRightInvisibleStyles = function placementRightInvisibleStyles(p) {
|
|
44
44
|
return p.placement === 'right' && !p.visible && (0, _react.css)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n animation: ", " ", "ms forwards;\n "])), placementRightFadeOut, p.theme.transitionDelay);
|
|
45
45
|
};
|
|
46
|
-
var Content = (0, _styled["default"])('div', (0, _utils.omitEmotionProps)('placement', 'width', 'visible', 'size'))(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n ", ";\n\n position: absolute;\n top: 0;\n bottom: 0;\n width: ", ";\n padding-bottom: env(safe-area-inset-bottom);\n\n background-color: ", ";\n color: ", ";\n box-shadow: 0 0 ", "em\n ", ";\n\n ", ";\n ", ";\n ", ";\n ", ";\n\n ", ";\n ", ";\n"])), _styles.resetFocusStyles, function (p) {
|
|
46
|
+
var Content = (0, _styled["default"])('div', (0, _utils.omitEmotionProps)('placement', 'width', 'visible', 'size'))(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n ", ";\n\n position: absolute;\n top: 0;\n bottom: 0;\n width: ", ";\n max-width: 90%;\n padding-bottom: env(safe-area-inset-bottom);\n\n background-color: ", ";\n color: ", ";\n box-shadow: 0 0 ", "em\n ", ";\n\n ", ";\n ", ";\n ", ";\n ", ";\n\n ", ";\n ", ";\n"])), _styles.resetFocusStyles, function (p) {
|
|
47
47
|
return p.width;
|
|
48
48
|
}, function (p) {
|
|
49
49
|
return (0, _theming.clr)(p.theme.colorBg);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_react","require","_styled","_interopRequireDefault","_portal","_styles","_theming","_utils","_react2","_interopRequireWildcard","_reactFocusLock","_Modal","_excluded","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_taggedTemplateLiteral","strings","raw","slice","freeze","defineProperties","value","DRAWER_CONTAINER_Z_INDEX","DRAWER_BOX_SHADOW_SIZE_EM","DrawerMask","styled","ModalMask","Container","div","placementLeftFadeIn","keyframes","placementLeftFadeOut","placementRightFadeIn","placementRightFadeOut","placementLeftVisibleStyles","p","placement","visible","css","theme","transitionDelay","placementLeftInvisibleStyles","placementRightVisibleStyles","placementRightInvisibleStyles","Content","omitEmotionProps","resetFocusStyles","width","clr","colorBg","colorText","drawerColorBoxShadow","enableScrollingStyles","sizeStyles","CloseDrawerContext","React","createContext","useCloseDrawer","exports","useContext","Drawer","forwardRef","_ref","ref","_ref$placement","_ref$width","_ref$visible","_ref$onClose","onClose","size","children","_ref$onClick","onClick","rest","_useTheme","useTheme","mounted","useClosable","useBodyScroll","clickHandler","useCallback","e","stopPropagation","keyDownHandler","createElement","autoFocus","Provider","tabIndex","onKeyDown","role","displayName","_default"],"sources":["../../../src/Drawer/index.tsx"],"sourcesContent":["import { css, keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport Portal from '@os-design/portal';\nimport {\n WithSize,\n enableScrollingStyles,\n resetFocusStyles,\n sizeStyles,\n} from '@os-design/styles';\nimport { clr, useTheme } from '@os-design/theming';\nimport { omitEmotionProps, useBodyScroll, useClosable } from '@os-design/utils';\nimport React, { forwardRef, useCallback, useContext } from 'react';\nimport FocusLock from 'react-focus-lock';\nimport { ModalMask } from '../Modal';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface DrawerProps extends JsxDivProps, WithSize {\n /**\n * The placement of the drawer.\n * @default right\n */\n placement?: 'left' | 'right';\n /**\n * The width of the drawer.\n * @default 15em\n */\n width?: string;\n /**\n * Whether the drawer is visible.\n * @default false\n */\n visible?: boolean;\n /**\n * Specifies a callback that will be called when a user clicks the mask.\n * The callback should set the visible state to false.\n * @default undefined\n */\n onClose?: () => void;\n}\n\nconst DRAWER_CONTAINER_Z_INDEX = 1000;\nconst DRAWER_BOX_SHADOW_SIZE_EM = 1;\n\nconst DrawerMask = styled(ModalMask)`\n z-index: ${DRAWER_CONTAINER_Z_INDEX};\n`;\n\nconst Container = styled.div`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n z-index: ${DRAWER_CONTAINER_Z_INDEX};\n`;\n\nconst placementLeftFadeIn = keyframes`\n from { transform: translateX(calc(-100% - ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateX(0); }\n`;\n\nconst placementLeftFadeOut = keyframes`\n from { transform: translateX(0); }\n to { transform: translateX(calc(-100% - ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst placementRightFadeIn = keyframes`\n from { transform: translateX(calc(100vw + ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateX(calc(100vw - 100%)); }\n`;\n\nconst placementRightFadeOut = keyframes`\n from { transform: translateX(calc(100vw - 100%)); }\n to { transform: translateX(calc(100vw + ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst placementLeftVisibleStyles = (p) =>\n p.placement === 'left' &&\n p.visible &&\n css`\n animation: ${placementLeftFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementLeftInvisibleStyles = (p) =>\n p.placement === 'left' &&\n !p.visible &&\n css`\n animation: ${placementLeftFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementRightVisibleStyles = (p) =>\n p.placement === 'right' &&\n p.visible &&\n css`\n animation: ${placementRightFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementRightInvisibleStyles = (p) =>\n p.placement === 'right' &&\n !p.visible &&\n css`\n animation: ${placementRightFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ntype ContentProps = Pick<\n DrawerProps,\n 'placement' | 'width' | 'visible' | 'size'\n>;\nconst Content = styled(\n 'div',\n omitEmotionProps('placement', 'width', 'visible', 'size')\n)<ContentProps>`\n ${resetFocusStyles};\n\n position: absolute;\n top: 0;\n bottom: 0;\n width: ${(p) => p.width};\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 ${DRAWER_BOX_SHADOW_SIZE_EM}em\n ${(p) => clr(p.theme.drawerColorBoxShadow)};\n\n ${placementLeftVisibleStyles};\n ${placementLeftInvisibleStyles};\n ${placementRightVisibleStyles};\n ${placementRightInvisibleStyles};\n\n ${enableScrollingStyles('y')};\n ${sizeStyles};\n`;\n\nconst CloseDrawerContext = React.createContext<() => void>(() => {});\n\nexport const useCloseDrawer = () => useContext(CloseDrawerContext);\n\n/**\n * The side panel that appears from the edge of the screen.\n */\nconst Drawer = forwardRef<HTMLDivElement, DrawerProps>(\n (\n {\n placement = 'right',\n width = '15em',\n visible = false,\n onClose = () => {},\n size,\n children,\n onClick = () => {},\n ...rest\n },\n ref\n ) => {\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n useBodyScroll(!visible);\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 if (!mounted) return null;\n\n return (\n <Portal>\n <DrawerMask visible={visible} />\n <Container onClick={onClose}>\n <FocusLock autoFocus>\n <CloseDrawerContext.Provider value={onClose}>\n <Content\n placement={placement}\n width={width}\n visible={visible}\n size={size}\n tabIndex={-1}\n onKeyDown={keyDownHandler}\n onClick={clickHandler}\n role='dialog'\n aria-modal\n {...rest}\n ref={ref}\n >\n {children}\n </Content>\n </CloseDrawerContext.Provider>\n </FocusLock>\n </Container>\n </Portal>\n );\n }\n);\n\nDrawer.displayName = 'Drawer';\n\nexport default Drawer;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["_react","require","_styled","_interopRequireDefault","_portal","_styles","_theming","_utils","_react2","_interopRequireWildcard","_reactFocusLock","_Modal","_excluded","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_taggedTemplateLiteral","strings","raw","slice","freeze","defineProperties","value","DRAWER_CONTAINER_Z_INDEX","DRAWER_BOX_SHADOW_SIZE_EM","DrawerMask","styled","ModalMask","Container","div","placementLeftFadeIn","keyframes","placementLeftFadeOut","placementRightFadeIn","placementRightFadeOut","placementLeftVisibleStyles","p","placement","visible","css","theme","transitionDelay","placementLeftInvisibleStyles","placementRightVisibleStyles","placementRightInvisibleStyles","Content","omitEmotionProps","resetFocusStyles","width","clr","colorBg","colorText","drawerColorBoxShadow","enableScrollingStyles","sizeStyles","CloseDrawerContext","React","createContext","useCloseDrawer","exports","useContext","Drawer","forwardRef","_ref","ref","_ref$placement","_ref$width","_ref$visible","_ref$onClose","onClose","size","children","_ref$onClick","onClick","rest","_useTheme","useTheme","mounted","useClosable","useBodyScroll","clickHandler","useCallback","e","stopPropagation","keyDownHandler","createElement","autoFocus","Provider","tabIndex","onKeyDown","role","displayName","_default"],"sources":["../../../src/Drawer/index.tsx"],"sourcesContent":["import { css, keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport Portal from '@os-design/portal';\nimport {\n WithSize,\n enableScrollingStyles,\n resetFocusStyles,\n sizeStyles,\n} from '@os-design/styles';\nimport { clr, useTheme } from '@os-design/theming';\nimport { omitEmotionProps, useBodyScroll, useClosable } from '@os-design/utils';\nimport React, { forwardRef, useCallback, useContext } from 'react';\nimport FocusLock from 'react-focus-lock';\nimport { ModalMask } from '../Modal';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface DrawerProps extends JsxDivProps, WithSize {\n /**\n * The placement of the drawer.\n * @default right\n */\n placement?: 'left' | 'right';\n /**\n * The width of the drawer.\n * @default 15em\n */\n width?: string;\n /**\n * Whether the drawer is visible.\n * @default false\n */\n visible?: boolean;\n /**\n * Specifies a callback that will be called when a user clicks the mask.\n * The callback should set the visible state to false.\n * @default undefined\n */\n onClose?: () => void;\n}\n\nconst DRAWER_CONTAINER_Z_INDEX = 1000;\nconst DRAWER_BOX_SHADOW_SIZE_EM = 1;\n\nconst DrawerMask = styled(ModalMask)`\n z-index: ${DRAWER_CONTAINER_Z_INDEX};\n`;\n\nconst Container = styled.div`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n z-index: ${DRAWER_CONTAINER_Z_INDEX};\n`;\n\nconst placementLeftFadeIn = keyframes`\n from { transform: translateX(calc(-100% - ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateX(0); }\n`;\n\nconst placementLeftFadeOut = keyframes`\n from { transform: translateX(0); }\n to { transform: translateX(calc(-100% - ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst placementRightFadeIn = keyframes`\n from { transform: translateX(calc(100vw + ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateX(calc(100vw - 100%)); }\n`;\n\nconst placementRightFadeOut = keyframes`\n from { transform: translateX(calc(100vw - 100%)); }\n to { transform: translateX(calc(100vw + ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst placementLeftVisibleStyles = (p) =>\n p.placement === 'left' &&\n p.visible &&\n css`\n animation: ${placementLeftFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementLeftInvisibleStyles = (p) =>\n p.placement === 'left' &&\n !p.visible &&\n css`\n animation: ${placementLeftFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementRightVisibleStyles = (p) =>\n p.placement === 'right' &&\n p.visible &&\n css`\n animation: ${placementRightFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementRightInvisibleStyles = (p) =>\n p.placement === 'right' &&\n !p.visible &&\n css`\n animation: ${placementRightFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ntype ContentProps = Pick<\n DrawerProps,\n 'placement' | 'width' | 'visible' | 'size'\n>;\nconst Content = styled(\n 'div',\n omitEmotionProps('placement', 'width', 'visible', 'size')\n)<ContentProps>`\n ${resetFocusStyles};\n\n position: absolute;\n top: 0;\n bottom: 0;\n width: ${(p) => p.width};\n max-width: 90%;\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 ${DRAWER_BOX_SHADOW_SIZE_EM}em\n ${(p) => clr(p.theme.drawerColorBoxShadow)};\n\n ${placementLeftVisibleStyles};\n ${placementLeftInvisibleStyles};\n ${placementRightVisibleStyles};\n ${placementRightInvisibleStyles};\n\n ${enableScrollingStyles('y')};\n ${sizeStyles};\n`;\n\nconst CloseDrawerContext = React.createContext<() => void>(() => {});\n\nexport const useCloseDrawer = () => useContext(CloseDrawerContext);\n\n/**\n * The side panel that appears from the edge of the screen.\n */\nconst Drawer = forwardRef<HTMLDivElement, DrawerProps>(\n (\n {\n placement = 'right',\n width = '15em',\n visible = false,\n onClose = () => {},\n size,\n children,\n onClick = () => {},\n ...rest\n },\n ref\n ) => {\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n useBodyScroll(!visible);\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 if (!mounted) return null;\n\n return (\n <Portal>\n <DrawerMask visible={visible} />\n <Container onClick={onClose}>\n <FocusLock autoFocus>\n <CloseDrawerContext.Provider value={onClose}>\n <Content\n placement={placement}\n width={width}\n visible={visible}\n size={size}\n tabIndex={-1}\n onKeyDown={keyDownHandler}\n onClick={clickHandler}\n role='dialog'\n aria-modal\n {...rest}\n ref={ref}\n >\n {children}\n </Content>\n </CloseDrawerContext.Provider>\n </FocusLock>\n </Container>\n </Portal>\n );\n }\n);\n\nDrawer.displayName = 'Drawer';\n\nexport default Drawer;\n"],"mappings":"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"}
|
package/dist/esm/Drawer/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["css","keyframes","styled","Portal","enableScrollingStyles","resetFocusStyles","sizeStyles","clr","useTheme","omitEmotionProps","useBodyScroll","useClosable","React","forwardRef","useCallback","useContext","FocusLock","ModalMask","DRAWER_CONTAINER_Z_INDEX","DRAWER_BOX_SHADOW_SIZE_EM","DrawerMask","Container","div","placementLeftFadeIn","placementLeftFadeOut","placementRightFadeIn","placementRightFadeOut","placementLeftVisibleStyles","p","placement","visible","theme","transitionDelay","placementLeftInvisibleStyles","placementRightVisibleStyles","placementRightInvisibleStyles","Content","width","colorBg","colorText","drawerColorBoxShadow","CloseDrawerContext","createContext","useCloseDrawer","Drawer","onClose","size","children","onClick","rest","ref","mounted","clickHandler","e","stopPropagation","keyDownHandler","key","createElement","autoFocus","Provider","value","_extends","tabIndex","onKeyDown","role","displayName"],"sources":["../../../src/Drawer/index.tsx"],"sourcesContent":["import { css, keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport Portal from '@os-design/portal';\nimport {\n WithSize,\n enableScrollingStyles,\n resetFocusStyles,\n sizeStyles,\n} from '@os-design/styles';\nimport { clr, useTheme } from '@os-design/theming';\nimport { omitEmotionProps, useBodyScroll, useClosable } from '@os-design/utils';\nimport React, { forwardRef, useCallback, useContext } from 'react';\nimport FocusLock from 'react-focus-lock';\nimport { ModalMask } from '../Modal';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface DrawerProps extends JsxDivProps, WithSize {\n /**\n * The placement of the drawer.\n * @default right\n */\n placement?: 'left' | 'right';\n /**\n * The width of the drawer.\n * @default 15em\n */\n width?: string;\n /**\n * Whether the drawer is visible.\n * @default false\n */\n visible?: boolean;\n /**\n * Specifies a callback that will be called when a user clicks the mask.\n * The callback should set the visible state to false.\n * @default undefined\n */\n onClose?: () => void;\n}\n\nconst DRAWER_CONTAINER_Z_INDEX = 1000;\nconst DRAWER_BOX_SHADOW_SIZE_EM = 1;\n\nconst DrawerMask = styled(ModalMask)`\n z-index: ${DRAWER_CONTAINER_Z_INDEX};\n`;\n\nconst Container = styled.div`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n z-index: ${DRAWER_CONTAINER_Z_INDEX};\n`;\n\nconst placementLeftFadeIn = keyframes`\n from { transform: translateX(calc(-100% - ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateX(0); }\n`;\n\nconst placementLeftFadeOut = keyframes`\n from { transform: translateX(0); }\n to { transform: translateX(calc(-100% - ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst placementRightFadeIn = keyframes`\n from { transform: translateX(calc(100vw + ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateX(calc(100vw - 100%)); }\n`;\n\nconst placementRightFadeOut = keyframes`\n from { transform: translateX(calc(100vw - 100%)); }\n to { transform: translateX(calc(100vw + ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst placementLeftVisibleStyles = (p) =>\n p.placement === 'left' &&\n p.visible &&\n css`\n animation: ${placementLeftFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementLeftInvisibleStyles = (p) =>\n p.placement === 'left' &&\n !p.visible &&\n css`\n animation: ${placementLeftFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementRightVisibleStyles = (p) =>\n p.placement === 'right' &&\n p.visible &&\n css`\n animation: ${placementRightFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementRightInvisibleStyles = (p) =>\n p.placement === 'right' &&\n !p.visible &&\n css`\n animation: ${placementRightFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ntype ContentProps = Pick<\n DrawerProps,\n 'placement' | 'width' | 'visible' | 'size'\n>;\nconst Content = styled(\n 'div',\n omitEmotionProps('placement', 'width', 'visible', 'size')\n)<ContentProps>`\n ${resetFocusStyles};\n\n position: absolute;\n top: 0;\n bottom: 0;\n width: ${(p) => p.width};\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 ${DRAWER_BOX_SHADOW_SIZE_EM}em\n ${(p) => clr(p.theme.drawerColorBoxShadow)};\n\n ${placementLeftVisibleStyles};\n ${placementLeftInvisibleStyles};\n ${placementRightVisibleStyles};\n ${placementRightInvisibleStyles};\n\n ${enableScrollingStyles('y')};\n ${sizeStyles};\n`;\n\nconst CloseDrawerContext = React.createContext<() => void>(() => {});\n\nexport const useCloseDrawer = () => useContext(CloseDrawerContext);\n\n/**\n * The side panel that appears from the edge of the screen.\n */\nconst Drawer = forwardRef<HTMLDivElement, DrawerProps>(\n (\n {\n placement = 'right',\n width = '15em',\n visible = false,\n onClose = () => {},\n size,\n children,\n onClick = () => {},\n ...rest\n },\n ref\n ) => {\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n useBodyScroll(!visible);\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 if (!mounted) return null;\n\n return (\n <Portal>\n <DrawerMask visible={visible} />\n <Container onClick={onClose}>\n <FocusLock autoFocus>\n <CloseDrawerContext.Provider value={onClose}>\n <Content\n placement={placement}\n width={width}\n visible={visible}\n size={size}\n tabIndex={-1}\n onKeyDown={keyDownHandler}\n onClick={clickHandler}\n role='dialog'\n aria-modal\n {...rest}\n ref={ref}\n >\n {children}\n </Content>\n </CloseDrawerContext.Provider>\n </FocusLock>\n </Container>\n </Portal>\n );\n }\n);\n\nDrawer.displayName = 'Drawer';\n\nexport default Drawer;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["css","keyframes","styled","Portal","enableScrollingStyles","resetFocusStyles","sizeStyles","clr","useTheme","omitEmotionProps","useBodyScroll","useClosable","React","forwardRef","useCallback","useContext","FocusLock","ModalMask","DRAWER_CONTAINER_Z_INDEX","DRAWER_BOX_SHADOW_SIZE_EM","DrawerMask","Container","div","placementLeftFadeIn","placementLeftFadeOut","placementRightFadeIn","placementRightFadeOut","placementLeftVisibleStyles","p","placement","visible","theme","transitionDelay","placementLeftInvisibleStyles","placementRightVisibleStyles","placementRightInvisibleStyles","Content","width","colorBg","colorText","drawerColorBoxShadow","CloseDrawerContext","createContext","useCloseDrawer","Drawer","onClose","size","children","onClick","rest","ref","mounted","clickHandler","e","stopPropagation","keyDownHandler","key","createElement","autoFocus","Provider","value","_extends","tabIndex","onKeyDown","role","displayName"],"sources":["../../../src/Drawer/index.tsx"],"sourcesContent":["import { css, keyframes } from '@emotion/react';\nimport styled from '@emotion/styled';\nimport Portal from '@os-design/portal';\nimport {\n WithSize,\n enableScrollingStyles,\n resetFocusStyles,\n sizeStyles,\n} from '@os-design/styles';\nimport { clr, useTheme } from '@os-design/theming';\nimport { omitEmotionProps, useBodyScroll, useClosable } from '@os-design/utils';\nimport React, { forwardRef, useCallback, useContext } from 'react';\nimport FocusLock from 'react-focus-lock';\nimport { ModalMask } from '../Modal';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface DrawerProps extends JsxDivProps, WithSize {\n /**\n * The placement of the drawer.\n * @default right\n */\n placement?: 'left' | 'right';\n /**\n * The width of the drawer.\n * @default 15em\n */\n width?: string;\n /**\n * Whether the drawer is visible.\n * @default false\n */\n visible?: boolean;\n /**\n * Specifies a callback that will be called when a user clicks the mask.\n * The callback should set the visible state to false.\n * @default undefined\n */\n onClose?: () => void;\n}\n\nconst DRAWER_CONTAINER_Z_INDEX = 1000;\nconst DRAWER_BOX_SHADOW_SIZE_EM = 1;\n\nconst DrawerMask = styled(ModalMask)`\n z-index: ${DRAWER_CONTAINER_Z_INDEX};\n`;\n\nconst Container = styled.div`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n z-index: ${DRAWER_CONTAINER_Z_INDEX};\n`;\n\nconst placementLeftFadeIn = keyframes`\n from { transform: translateX(calc(-100% - ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateX(0); }\n`;\n\nconst placementLeftFadeOut = keyframes`\n from { transform: translateX(0); }\n to { transform: translateX(calc(-100% - ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst placementRightFadeIn = keyframes`\n from { transform: translateX(calc(100vw + ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n to { transform: translateX(calc(100vw - 100%)); }\n`;\n\nconst placementRightFadeOut = keyframes`\n from { transform: translateX(calc(100vw - 100%)); }\n to { transform: translateX(calc(100vw + ${DRAWER_BOX_SHADOW_SIZE_EM}em)); }\n`;\n\nconst placementLeftVisibleStyles = (p) =>\n p.placement === 'left' &&\n p.visible &&\n css`\n animation: ${placementLeftFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementLeftInvisibleStyles = (p) =>\n p.placement === 'left' &&\n !p.visible &&\n css`\n animation: ${placementLeftFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementRightVisibleStyles = (p) =>\n p.placement === 'right' &&\n p.visible &&\n css`\n animation: ${placementRightFadeIn} ${p.theme.transitionDelay}ms forwards;\n `;\n\nconst placementRightInvisibleStyles = (p) =>\n p.placement === 'right' &&\n !p.visible &&\n css`\n animation: ${placementRightFadeOut} ${p.theme.transitionDelay}ms forwards;\n `;\n\ntype ContentProps = Pick<\n DrawerProps,\n 'placement' | 'width' | 'visible' | 'size'\n>;\nconst Content = styled(\n 'div',\n omitEmotionProps('placement', 'width', 'visible', 'size')\n)<ContentProps>`\n ${resetFocusStyles};\n\n position: absolute;\n top: 0;\n bottom: 0;\n width: ${(p) => p.width};\n max-width: 90%;\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 ${DRAWER_BOX_SHADOW_SIZE_EM}em\n ${(p) => clr(p.theme.drawerColorBoxShadow)};\n\n ${placementLeftVisibleStyles};\n ${placementLeftInvisibleStyles};\n ${placementRightVisibleStyles};\n ${placementRightInvisibleStyles};\n\n ${enableScrollingStyles('y')};\n ${sizeStyles};\n`;\n\nconst CloseDrawerContext = React.createContext<() => void>(() => {});\n\nexport const useCloseDrawer = () => useContext(CloseDrawerContext);\n\n/**\n * The side panel that appears from the edge of the screen.\n */\nconst Drawer = forwardRef<HTMLDivElement, DrawerProps>(\n (\n {\n placement = 'right',\n width = '15em',\n visible = false,\n onClose = () => {},\n size,\n children,\n onClick = () => {},\n ...rest\n },\n ref\n ) => {\n const { theme } = useTheme();\n const mounted = useClosable(visible, theme.transitionDelay);\n\n useBodyScroll(!visible);\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 if (!mounted) return null;\n\n return (\n <Portal>\n <DrawerMask visible={visible} />\n <Container onClick={onClose}>\n <FocusLock autoFocus>\n <CloseDrawerContext.Provider value={onClose}>\n <Content\n placement={placement}\n width={width}\n visible={visible}\n size={size}\n tabIndex={-1}\n onKeyDown={keyDownHandler}\n onClick={clickHandler}\n role='dialog'\n aria-modal\n {...rest}\n ref={ref}\n >\n {children}\n </Content>\n </CloseDrawerContext.Provider>\n </FocusLock>\n </Container>\n </Portal>\n );\n }\n);\n\nDrawer.displayName = 'Drawer';\n\nexport default Drawer;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Drawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,QAAQ,EAIT,MAAM,mBAAmB,CAAC;AAG3B,OAAO,KAA8C,MAAM,OAAO,CAAC;AAInE,KAAK,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;AAC7D,MAAM,WAAW,WAAY,SAAQ,WAAW,EAAE,QAAQ;IAKxD,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAK7B,KAAK,CAAC,EAAE,MAAM,CAAC;IAKf,OAAO,CAAC,EAAE,OAAO,CAAC;IAMlB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Drawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,QAAQ,EAIT,MAAM,mBAAmB,CAAC;AAG3B,OAAO,KAA8C,MAAM,OAAO,CAAC;AAInE,KAAK,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;AAC7D,MAAM,WAAW,WAAY,SAAQ,WAAW,EAAE,QAAQ;IAKxD,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAK7B,KAAK,CAAC,EAAE,MAAM,CAAC;IAKf,OAAO,CAAC,EAAE,OAAO,CAAC;IAMlB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAmGD,eAAO,MAAM,cAAc,cAF0B,IAEa,CAAC;AAKnE,QAAA,MAAM,MAAM,oFAkEX,CAAC;AAIF,eAAe,MAAM,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@os-design/core",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.226",
|
|
4
4
|
"license": "UNLICENSED",
|
|
5
5
|
"repository": "git@gitlab.com:os-team/libs/os-design.git",
|
|
6
6
|
"main": "dist/cjs/index.js",
|
|
@@ -59,5 +59,5 @@
|
|
|
59
59
|
"react": ">=18",
|
|
60
60
|
"react-dom": ">=18"
|
|
61
61
|
},
|
|
62
|
-
"gitHead": "
|
|
62
|
+
"gitHead": "1332ecdfa0b716def7710ab9b26d2e39363f129b"
|
|
63
63
|
}
|