@os-design/core 1.0.196 → 1.0.197

package/dist/cjs/Drawer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["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","useContext","Drawer","forwardRef","ref","onClose","size","children","onClick","rest","useTheme","mounted","useClosable","useBodyScroll","clickHandler","useCallback","e","stopPropagation","keyDownHandler","key","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  enableScrollingStyles,\n  resetFocusStyles,\n  sizeStyles,\n  WithSize,\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 = 900;\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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"}
+{"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","useContext","exports","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 = 900;\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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"}

package/dist/cjs/Form/FormConfigContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormConfigContext.js","names":["FormConfigContext","React","createContext","optionalText","displayName"],"sources":["../../../src/Form/FormConfigContext.ts"],"sourcesContent":["import React from 'react';\n\nexport interface FormConfigContextProps {\n  /**\n   * The text that is displayed to the right of the label of the optional field.\n   */\n  optionalText: string;\n}\n\nconst FormConfigContext = React.createContext<FormConfigContextProps>({\n  optionalText: 'optional',\n});\n\nFormConfigContext.displayName = 'FormConfigContext';\n\nexport default FormConfigContext;\n"],"mappings":";;;;;;AAAA;AAA0B;AAS1B,IAAMA,iBAAiB,gBAAGC,iBAAK,CAACC,aAAa,CAAyB;EACpEC,YAAY,EAAE;AAChB,CAAC,CAAC;AAEFH,iBAAiB,CAACI,WAAW,GAAG,mBAAmB;AAAC,eAErCJ,iBAAiB;AAAA"}
+{"version":3,"file":"FormConfigContext.js","names":["_react","_interopRequireDefault","require","obj","__esModule","FormConfigContext","React","createContext","optionalText","displayName","_default","exports"],"sources":["../../../src/Form/FormConfigContext.ts"],"sourcesContent":["import React from 'react';\n\nexport interface FormConfigContextProps {\n  /**\n   * The text that is displayed to the right of the label of the optional field.\n   */\n  optionalText: string;\n}\n\nconst FormConfigContext = React.createContext<FormConfigContextProps>({\n  optionalText: 'optional',\n});\n\nFormConfigContext.displayName = 'FormConfigContext';\n\nexport default FormConfigContext;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA0B,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,gBAAAA,GAAA;AAS1B,IAAME,iBAAiB,gBAAGC,iBAAK,CAACC,aAAa,CAAyB;EACpEC,YAAY,EAAE;AAChB,CAAC,CAAC;AAEFH,iBAAiB,CAACI,WAAW,GAAG,mBAAmB;AAAC,IAAAC,QAAA,GAErCL,iBAAiB;AAAAM,OAAA,cAAAD,QAAA"}

package/dist/cjs/Form/index.js

@@ -5,16 +5,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _react = _interopRequireWildcard(require("react"));
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _styles = require("@os-design/styles");
 var _utils = require("@os-design/utils");
+var _react = _interopRequireWildcard(require("react"));
 var _FormConfigContext = _interopRequireDefault(require("./FormConfigContext"));
 var _excluded = ["optionalText"];
 var _templateObject;
-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 _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; }

package/dist/cjs/Form/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["StyledForm","styled","omitEmotionProps","sizeStyles","Form","forwardRef","ref","optionalText","rest","memoizedOptionalText","useMemo","displayName"],"sources":["../../../src/Form/index.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\nimport styled from '@emotion/styled';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport FormConfigContext from './FormConfigContext';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface FormProps extends JsxDivProps, WithSize {\n  /**\n   * The text that is displayed to the right of the label of the optional field.\n   * @default optional\n   */\n  optionalText?: string;\n}\n\nconst StyledForm = styled('div', omitEmotionProps('size'))<WithSize>`\n  max-width: 50em;\n\n  & > * + * {\n    margin-top: 1em;\n  }\n  & > style + * {\n    margin-top: 0;\n  }\n\n  ${sizeStyles};\n`;\n\n/**\n * The wrapper of the form.\n */\nconst Form = forwardRef<HTMLDivElement, FormProps>(\n  ({ optionalText = 'optional', ...rest }, ref) => {\n    const memoizedOptionalText = useMemo(\n      () => ({ optionalText }),\n      [optionalText]\n    );\n\n    return (\n      <FormConfigContext.Provider value={memoizedOptionalText}>\n        <StyledForm {...rest} ref={ref} />\n      </FormConfigContext.Provider>\n    );\n  }\n);\n\nForm.displayName = 'Form';\n\nexport default Form;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AAAoD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWpD,IAAMA,UAAU,GAAG,IAAAC,kBAAM,EAAC,KAAK,EAAE,IAAAC,uBAAgB,EAAC,MAAM,CAAC,CAAC,+LAUtDC,kBAAU,CACb;;AAED;AACA;AACA;AACA,IAAMC,IAAI,gBAAG,IAAAC,iBAAU,EACrB,gBAAyCC,GAAG,EAAK;EAAA,6BAA9CC,YAAY;IAAZA,YAAY,kCAAG,UAAU;IAAKC,IAAI;EACnC,IAAMC,oBAAoB,GAAG,IAAAC,cAAO,EAClC;IAAA,OAAO;MAAEH,YAAY,EAAZA;IAAa,CAAC;EAAA,CAAC,EACxB,CAACA,YAAY,CAAC,CACf;EAED,oBACE,gCAAC,6BAAiB,CAAC,QAAQ;IAAC,KAAK,EAAEE;EAAqB,gBACtD,gCAAC,UAAU,eAAKD,IAAI;IAAE,GAAG,EAAEF;EAAI,GAAG,CACP;AAEjC,CAAC,CACF;AAEDF,IAAI,CAACO,WAAW,GAAG,MAAM;AAAC,eAEXP,IAAI;AAAA"}
+{"version":3,"file":"index.js","names":["_styled","_interopRequireDefault","require","_styles","_utils","_react","_interopRequireWildcard","_FormConfigContext","_excluded","_templateObject","_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","StyledForm","styled","omitEmotionProps","sizeStyles","Form","forwardRef","_ref","ref","_ref$optionalText","optionalText","rest","memoizedOptionalText","useMemo","createElement","Provider","displayName","_default","exports"],"sources":["../../../src/Form/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { WithSize, sizeStyles } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef, useMemo } from 'react';\nimport FormConfigContext from './FormConfigContext';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface FormProps extends JsxDivProps, WithSize {\n  /**\n   * The text that is displayed to the right of the label of the optional field.\n   * @default optional\n   */\n  optionalText?: string;\n}\n\nconst StyledForm = styled('div', omitEmotionProps('size'))<WithSize>`\n  max-width: 50em;\n\n  & > * + * {\n    margin-top: 1em;\n  }\n  & > style + * {\n    margin-top: 0;\n  }\n\n  ${sizeStyles};\n`;\n\n/**\n * The wrapper of the form.\n */\nconst Form = forwardRef<HTMLDivElement, FormProps>(\n  ({ optionalText = 'optional', ...rest }, ref) => {\n    const memoizedOptionalText = useMemo(\n      () => ({ optionalText }),\n      [optionalText]\n    );\n\n    return (\n      <FormConfigContext.Provider value={memoizedOptionalText}>\n        <StyledForm {...rest} ref={ref} />\n      </FormConfigContext.Provider>\n    );\n  }\n);\n\nForm.displayName = 'Form';\n\nexport default Form;\n"],"mappings":"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"}

package/dist/cjs/FormDivider/index.js

@@ -5,16 +5,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _react = _interopRequireWildcard(require("react"));
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _styles = require("@os-design/styles");
-var _utils = require("@os-design/utils");
 var _theming = require("@os-design/theming");
+var _utils = require("@os-design/utils");
+var _react = _interopRequireWildcard(require("react"));
 var _excluded = ["title", "description"];
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-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 _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; }

package/dist/cjs/FormDivider/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Container","styled","omitEmotionProps","p","clr","theme","formDividerColor","sizeStyles","Content","div","Title","colorText","sizes","large","ellipsisStyles","Description","inputColorPlaceholder","small","FormDivider","forwardRef","ref","title","description","rest","displayName"],"sources":["../../../src/FormDivider/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport styled from '@emotion/styled';\nimport { ellipsisStyles, sizeStyles, WithSize } from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr } from '@os-design/theming';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface FormDividerProps extends JsxDivProps, WithSize {\n  /**\n   * The title that is in the center of the divider.\n   */\n  title: string;\n  /**\n   * The description that is under the title.\n   * @default undefined\n   */\n  description?: string;\n}\n\nconst Container = styled('div', omitEmotionProps('size'))<WithSize>`\n  display: flex;\n  align-items: center;\n  margin: 3em 0 1em;\n\n  &::before,\n  &::after {\n    content: '';\n    flex: 1;\n    min-width: 5%;\n    max-width: 50%;\n    border-top: 1px solid ${(p) => clr(p.theme.formDividerColor)};\n  }\n\n  ${sizeStyles};\n`;\n\nconst Content = styled.div`\n  padding: 0 1.5em;\n  text-align: center;\n  overflow: hidden;\n`;\n\nconst Title = styled.div`\n  color: ${(p) => clr(p.theme.colorText)};\n  font-size: ${(p) => p.theme.sizes.large}em;\n  font-weight: 500;\n  ${ellipsisStyles};\n`;\n\nconst Description = styled.div`\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n  font-size: ${(p) => p.theme.sizes.small}em;\n  line-height: 1.2;\n  ${ellipsisStyles};\n`;\n\n/**\n * The divider line for separating the various elements of the form.\n */\nconst FormDivider = forwardRef<HTMLDivElement, FormDividerProps>(\n  ({ title, description, ...rest }, ref) => (\n    <Container role='separator' {...rest} ref={ref}>\n      <Content>\n        <Title>{title}</Title>\n        <Description>{description}</Description>\n      </Content>\n    </Container>\n  )\n);\n\nFormDivider.displayName = 'FormDivider';\n\nexport default FormDivider;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AAAyC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAezC,IAAMA,SAAS,GAAG,IAAAC,kBAAM,EAAC,KAAK,EAAE,IAAAC,uBAAgB,EAAC,MAAM,CAAC,CAAC,gSAW7B,UAACC,CAAC;EAAA,OAAK,IAAAC,YAAG,EAACD,CAAC,CAACE,KAAK,CAACC,gBAAgB,CAAC;AAAA,GAG5DC,kBAAU,CACb;AAED,IAAMC,OAAO,GAAGP,kBAAM,CAACQ,GAAG,0IAIzB;AAED,IAAMC,KAAK,GAAGT,kBAAM,CAACQ,GAAG,8IACb,UAACN,CAAC;EAAA,OAAK,IAAAC,YAAG,EAACD,CAAC,CAACE,KAAK,CAACM,SAAS,CAAC;AAAA,GACzB,UAACR,CAAC;EAAA,OAAKA,CAAC,CAACE,KAAK,CAACO,KAAK,CAACC,KAAK;AAAA,GAErCC,sBAAc,CACjB;AAED,IAAMC,WAAW,GAAGd,kBAAM,CAACQ,GAAG,8IACnB,UAACN,CAAC;EAAA,OAAK,IAAAC,YAAG,EAACD,CAAC,CAACE,KAAK,CAACW,qBAAqB,CAAC;AAAA,GACrC,UAACb,CAAC;EAAA,OAAKA,CAAC,CAACE,KAAK,CAACO,KAAK,CAACK,KAAK;AAAA,GAErCH,sBAAc,CACjB;;AAED;AACA;AACA;AACA,IAAMI,WAAW,gBAAG,IAAAC,iBAAU,EAC5B,gBAAkCC,GAAG;EAAA,IAAlCC,KAAK,QAALA,KAAK;IAAEC,WAAW,QAAXA,WAAW;IAAKC,IAAI;EAAA,oBAC5B,gCAAC,SAAS;IAAC,IAAI,EAAC;EAAW,GAAKA,IAAI;IAAE,GAAG,EAAEH;EAAI,iBAC7C,gCAAC,OAAO,qBACN,gCAAC,KAAK,QAAEC,KAAK,CAAS,eACtB,gCAAC,WAAW,QAAEC,WAAW,CAAe,CAChC,CACA;AAAA,CACb,CACF;AAEDJ,WAAW,CAACM,WAAW,GAAG,aAAa;AAAC,eAEzBN,WAAW;AAAA"}
+{"version":3,"file":"index.js","names":["_styled","_interopRequireDefault","require","_styles","_theming","_utils","_react","_interopRequireWildcard","_excluded","_templateObject","_templateObject2","_templateObject3","_templateObject4","_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","Container","styled","omitEmotionProps","p","clr","theme","formDividerColor","sizeStyles","Content","div","Title","colorText","sizes","large","ellipsisStyles","Description","inputColorPlaceholder","small","FormDivider","forwardRef","_ref","ref","title","description","rest","createElement","role","displayName","_default","exports"],"sources":["../../../src/FormDivider/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { ellipsisStyles, sizeStyles, WithSize } from '@os-design/styles';\nimport { clr } from '@os-design/theming';\n\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface FormDividerProps extends JsxDivProps, WithSize {\n  /**\n   * The title that is in the center of the divider.\n   */\n  title: string;\n  /**\n   * The description that is under the title.\n   * @default undefined\n   */\n  description?: string;\n}\n\nconst Container = styled('div', omitEmotionProps('size'))<WithSize>`\n  display: flex;\n  align-items: center;\n  margin: 3em 0 1em;\n\n  &::before,\n  &::after {\n    content: '';\n    flex: 1;\n    min-width: 5%;\n    max-width: 50%;\n    border-top: 1px solid ${(p) => clr(p.theme.formDividerColor)};\n  }\n\n  ${sizeStyles};\n`;\n\nconst Content = styled.div`\n  padding: 0 1.5em;\n  text-align: center;\n  overflow: hidden;\n`;\n\nconst Title = styled.div`\n  color: ${(p) => clr(p.theme.colorText)};\n  font-size: ${(p) => p.theme.sizes.large}em;\n  font-weight: 500;\n  ${ellipsisStyles};\n`;\n\nconst Description = styled.div`\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n  font-size: ${(p) => p.theme.sizes.small}em;\n  line-height: 1.2;\n  ${ellipsisStyles};\n`;\n\n/**\n * The divider line for separating the various elements of the form.\n */\nconst FormDivider = forwardRef<HTMLDivElement, FormDividerProps>(\n  ({ title, description, ...rest }, ref) => (\n    <Container role='separator' {...rest} ref={ref}>\n      <Content>\n        <Title>{title}</Title>\n        <Description>{description}</Description>\n      </Content>\n    </Container>\n  )\n);\n\nFormDivider.displayName = 'FormDivider';\n\nexport default FormDivider;\n"],"mappings":"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"}

package/dist/cjs/FormItem/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Container","styled","omitEmotionProps","sizeStyles","Label","label","p","theme","sizes","small","clr","colorText","Optional","span","formItemColorOptional","Help","div","formItemColorHelp","Error","formItemColorError","FormItem","forwardRef","ref","help","error","optional","id","children","rest","useContext","FormConfigContext","optionalText","containerId","useMemo","Math","random","toString","slice","fieldId","helpId","ariaInvalid","ariaDescribedBy","undefined","inputColorBorder","displayName"],"sources":["../../../src/FormItem/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef, useContext, useMemo } from 'react';\nimport FormConfigContext from '../Form/FormConfigContext';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface FormItemProps extends JsxDivProps, WithSize {\n  /**\n   * Label of the field.\n   * @default undefined\n   */\n  label?: string;\n  /**\n   * The help message located at the bottom of the field.\n   * @default undefined\n   */\n  help?: string;\n  /**\n   * The error message located at the bottom of the field.\n   * If specified, the field has a red border.\n   * @default undefined\n   */\n  error?: string | null;\n  /**\n   * Whether the field is optional.\n   * @default false\n   */\n  optional?: boolean;\n}\n\nconst Container = styled('div', omitEmotionProps('size'))<WithSize>`\n  ${sizeStyles};\n`;\n\nconst Label = styled.label`\n  display: inline-flex;\n  align-items: center;\n  margin-bottom: 0.4em;\n  font-size: ${(p) => p.theme.sizes.small}em;\n  color: ${(p) => clr(p.theme.colorText)};\n`;\n\nconst Optional = styled.span`\n  color: ${(p) => clr(p.theme.formItemColorOptional)};\n  margin-left: 0.3em;\n`;\n\nconst Help = styled.div`\n  margin-top: 0.1em;\n  font-size: ${(p) => p.theme.sizes.small}em;\n  color: ${(p) => clr(p.theme.formItemColorHelp)};\n`;\n\nconst Error = styled(Help)`\n  color: ${(p) => clr(p.theme.formItemColorError)};\n`;\n\n/**\n * The wrapper of the field.\n */\nconst FormItem = forwardRef<HTMLDivElement, FormItemProps>(\n  ({ label, help, error, optional = false, id, children, ...rest }, ref) => {\n    const { optionalText } = useContext(FormConfigContext);\n\n    const containerId = useMemo(\n      () => id || Math.random().toString(36).slice(2, 11),\n      [id]\n    );\n    const fieldId = useMemo(() => `field-${containerId}`, [containerId]);\n    const helpId = useMemo(() => `help-${containerId}`, [containerId]);\n    const ariaInvalid = useMemo(() => !!error, [error]);\n    const ariaDescribedBy = useMemo(\n      () => (help ? helpId : undefined),\n      [help, helpId]\n    );\n\n    return (\n      <Container role='group' id={id} {...rest} ref={ref}>\n        {label && (\n          <Label htmlFor={fieldId}>\n            {label}\n            {optional && <Optional>({optionalText})</Optional>}\n          </Label>\n        )}\n\n        <div\n          id={fieldId}\n          aria-invalid={ariaInvalid}\n          aria-describedby={ariaDescribedBy}\n        >\n          <ThemeOverrider\n            overrides={(theme) => ({\n              inputColorBorder: error\n                ? theme.formItemColorError\n                : theme.inputColorBorder,\n            })}\n          >\n            {children}\n          </ThemeOverrider>\n        </div>\n\n        {error ? (\n          <Error aria-live='polite' id={helpId}>\n            {error}\n          </Error>\n        ) : (\n          help && <Help id={helpId}>{help}</Help>\n        )}\n      </Container>\n    );\n  }\n);\n\nFormItem.displayName = 'FormItem';\n\nexport default FormItem;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["_styled","_interopRequireDefault","require","_styles","_theming","_utils","_react","_interopRequireWildcard","_FormConfigContext","_excluded","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_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","Container","styled","omitEmotionProps","sizeStyles","Label","label","p","theme","sizes","small","clr","colorText","Optional","span","formItemColorOptional","Help","div","formItemColorHelp","Error","formItemColorError","FormItem","forwardRef","_ref","ref","help","error","_ref$optional","optional","id","children","rest","_useContext","useContext","FormConfigContext","optionalText","containerId","useMemo","Math","random","toString","fieldId","concat","helpId","ariaInvalid","ariaDescribedBy","undefined","createElement","role","htmlFor","ThemeOverrider","overrides","inputColorBorder","displayName","_default","exports"],"sources":["../../../src/FormItem/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { sizeStyles, WithSize } from '@os-design/styles';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef, useContext, useMemo } from 'react';\nimport FormConfigContext from '../Form/FormConfigContext';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface FormItemProps extends JsxDivProps, WithSize {\n  /**\n   * Label of the field.\n   * @default undefined\n   */\n  label?: string;\n  /**\n   * The help message located at the bottom of the field.\n   * @default undefined\n   */\n  help?: string;\n  /**\n   * The error message located at the bottom of the field.\n   * If specified, the field has a red border.\n   * @default undefined\n   */\n  error?: string | null;\n  /**\n   * Whether the field is optional.\n   * @default false\n   */\n  optional?: boolean;\n}\n\nconst Container = styled('div', omitEmotionProps('size'))<WithSize>`\n  ${sizeStyles};\n`;\n\nconst Label = styled.label`\n  display: inline-flex;\n  align-items: center;\n  margin-bottom: 0.4em;\n  font-size: ${(p) => p.theme.sizes.small}em;\n  color: ${(p) => clr(p.theme.colorText)};\n`;\n\nconst Optional = styled.span`\n  color: ${(p) => clr(p.theme.formItemColorOptional)};\n  margin-left: 0.3em;\n`;\n\nconst Help = styled.div`\n  margin-top: 0.1em;\n  font-size: ${(p) => p.theme.sizes.small}em;\n  color: ${(p) => clr(p.theme.formItemColorHelp)};\n`;\n\nconst Error = styled(Help)`\n  color: ${(p) => clr(p.theme.formItemColorError)};\n`;\n\n/**\n * The wrapper of the field.\n */\nconst FormItem = forwardRef<HTMLDivElement, FormItemProps>(\n  ({ label, help, error, optional = false, id, children, ...rest }, ref) => {\n    const { optionalText } = useContext(FormConfigContext);\n\n    const containerId = useMemo(\n      () => id || Math.random().toString(36).slice(2, 11),\n      [id]\n    );\n    const fieldId = useMemo(() => `field-${containerId}`, [containerId]);\n    const helpId = useMemo(() => `help-${containerId}`, [containerId]);\n    const ariaInvalid = useMemo(() => !!error, [error]);\n    const ariaDescribedBy = useMemo(\n      () => (help ? helpId : undefined),\n      [help, helpId]\n    );\n\n    return (\n      <Container role='group' id={id} {...rest} ref={ref}>\n        {label && (\n          <Label htmlFor={fieldId}>\n            {label}\n            {optional && <Optional>({optionalText})</Optional>}\n          </Label>\n        )}\n\n        <div\n          id={fieldId}\n          aria-invalid={ariaInvalid}\n          aria-describedby={ariaDescribedBy}\n        >\n          <ThemeOverrider\n            overrides={(theme) => ({\n              inputColorBorder: error\n                ? theme.formItemColorError\n                : theme.inputColorBorder,\n            })}\n          >\n            {children}\n          </ThemeOverrider>\n        </div>\n\n        {error ? (\n          <Error aria-live='polite' id={helpId}>\n            {error}\n          </Error>\n        ) : (\n          help && <Help id={helpId}>{help}</Help>\n        )}\n      </Container>\n    );\n  }\n);\n\nFormItem.displayName = 'FormItem';\n\nexport default FormItem;\n"],"mappings":"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"}

package/dist/cjs/Gallery/Status.js

@@ -4,10 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _react = _interopRequireDefault(require("react"));
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _theming = require("@os-design/theming");
 var _utils = require("@os-design/utils");
+var _react = _interopRequireDefault(require("react"));
 var _templateObject, _templateObject2;
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }

package/dist/cjs/Gallery/Status.js.map

@@ -1 +1 @@
-{"version":3,"file":"Status.js","names":["Container","styled","omitEmotionProps","p","height","Block","count","index","current","clr","theme","galleryStatusColorBgCurrent","galleryStatusColorBg","Status","Array","fill","map","_"],"sources":["../../../src/Gallery/Status.tsx"],"sourcesContent":["import React from 'react';\nimport styled from '@emotion/styled';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\n\ninterface StatusProps {\n  count: number;\n  current: number;\n  height: number;\n}\n\ninterface ContainerProps {\n  height: number;\n}\nconst Container = styled('div', omitEmotionProps('height'))<ContainerProps>`\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: ${(p) => p.height}px;\n`;\n\ninterface BlockProps {\n  count: number;\n  index: number;\n  current: boolean;\n}\nconst Block = styled(\n  'div',\n  omitEmotionProps('count', 'index', 'current')\n)<BlockProps>`\n  position: absolute;\n  left: ${(p) => (100 / p.count) * p.index}%;\n  width: ${(p) =>\n    p.index < p.count - 1\n      ? `calc(${100 / p.count}% - 2px)`\n      : `${100 / p.count}%`};\n  height: 100%;\n\n  background-color: ${(p) =>\n    p.current\n      ? clr(p.theme.galleryStatusColorBgCurrent)\n      : clr(p.theme.galleryStatusColorBg)};\n  backdrop-filter: blur(0.2em);\n`;\n\nconst Status: React.FC<StatusProps> = ({ count, current, height }) => (\n  <Container height={height}>\n    {Array(count)\n      .fill(0)\n      .map((_, index) => (\n        <Block\n          key={index} // eslint-disable-line react/no-array-index-key\n          count={count}\n          index={index}\n          current={index === current}\n        />\n      ))}\n  </Container>\n);\n\nexport default Status;\n"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AAAoD;AAAA;AAAA;AAWpD,IAAMA,SAAS,GAAG,IAAAC,kBAAM,EAAC,KAAK,EAAE,IAAAC,uBAAgB,EAAC,QAAQ,CAAC,CAAC,yJAK/C,UAACC,CAAC;EAAA,OAAKA,CAAC,CAACC,MAAM;AAAA,EAC1B;AAOD,IAAMC,KAAK,GAAG,IAAAJ,kBAAM,EAClB,KAAK,EACL,IAAAC,uBAAgB,EAAC,OAAO,EAAE,OAAO,EAAE,SAAS,CAAC,CAC9C,gNAES,UAACC,CAAC;EAAA,OAAM,GAAG,GAAGA,CAAC,CAACG,KAAK,GAAIH,CAAC,CAACI,KAAK;AAAA,GAC/B,UAACJ,CAAC;EAAA,OACTA,CAAC,CAACI,KAAK,GAAGJ,CAAC,CAACG,KAAK,GAAG,CAAC,kBACT,GAAG,GAAGH,CAAC,CAACG,KAAK,0BAClB,GAAG,GAAGH,CAAC,CAACG,KAAK,MAAG;AAAA,GAGL,UAACH,CAAC;EAAA,OACpBA,CAAC,CAACK,OAAO,GACL,IAAAC,YAAG,EAACN,CAAC,CAACO,KAAK,CAACC,2BAA2B,CAAC,GACxC,IAAAF,YAAG,EAACN,CAAC,CAACO,KAAK,CAACE,oBAAoB,CAAC;AAAA,EAExC;AAED,IAAMC,MAA6B,GAAG,SAAhCA,MAA6B;EAAA,IAAMP,KAAK,QAALA,KAAK;IAAEE,OAAO,QAAPA,OAAO;IAAEJ,MAAM,QAANA,MAAM;EAAA,oBAC7D,gCAAC,SAAS;IAAC,MAAM,EAAEA;EAAO,GACvBU,KAAK,CAACR,KAAK,CAAC,CACVS,IAAI,CAAC,CAAC,CAAC,CACPC,GAAG,CAAC,UAACC,CAAC,EAAEV,KAAK;IAAA,oBACZ,gCAAC,KAAK;MACJ,GAAG,EAAEA,KAAM,CAAC;MAAA;MACZ,KAAK,EAAED,KAAM;MACb,KAAK,EAAEC,KAAM;MACb,OAAO,EAAEA,KAAK,KAAKC;IAAQ,EAC3B;EAAA,CACH,CAAC,CACM;AAAA,CACb;AAAC,eAEaK,MAAM;AAAA"}
+{"version":3,"file":"Status.js","names":["_styled","_interopRequireDefault","require","_theming","_utils","_react","_templateObject","_templateObject2","obj","__esModule","_taggedTemplateLiteral","strings","raw","slice","Object","freeze","defineProperties","value","Container","styled","omitEmotionProps","p","height","Block","count","index","concat","current","clr","theme","galleryStatusColorBgCurrent","galleryStatusColorBg","Status","_ref","createElement","Array","fill","map","_","key","_default","exports"],"sources":["../../../src/Gallery/Status.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { clr } from '@os-design/theming';\nimport { omitEmotionProps } from '@os-design/utils';\nimport React from 'react';\n\ninterface StatusProps {\n  count: number;\n  current: number;\n  height: number;\n}\n\ninterface ContainerProps {\n  height: number;\n}\nconst Container = styled('div', omitEmotionProps('height'))<ContainerProps>`\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: ${(p) => p.height}px;\n`;\n\ninterface BlockProps {\n  count: number;\n  index: number;\n  current: boolean;\n}\nconst Block = styled(\n  'div',\n  omitEmotionProps('count', 'index', 'current')\n)<BlockProps>`\n  position: absolute;\n  left: ${(p) => (100 / p.count) * p.index}%;\n  width: ${(p) =>\n    p.index < p.count - 1\n      ? `calc(${100 / p.count}% - 2px)`\n      : `${100 / p.count}%`};\n  height: 100%;\n\n  background-color: ${(p) =>\n    p.current\n      ? clr(p.theme.galleryStatusColorBgCurrent)\n      : clr(p.theme.galleryStatusColorBg)};\n  backdrop-filter: blur(0.2em);\n`;\n\nconst Status: React.FC<StatusProps> = ({ count, current, height }) => (\n  <Container height={height}>\n    {Array(count)\n      .fill(0)\n      .map((_, index) => (\n        <Block\n          key={index} // eslint-disable-line react/no-array-index-key\n          count={count}\n          index={index}\n          current={index === current}\n        />\n      ))}\n  </Container>\n);\n\nexport default Status;\n"],"mappings":";;;;;;AAAA,IAAAA,OAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAA0B,IAAAI,eAAA,EAAAC,gBAAA;AAAA,SAAAN,uBAAAO,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,gBAAAA,GAAA;AAAA,SAAAE,uBAAAC,OAAA,EAAAC,GAAA,SAAAA,GAAA,IAAAA,GAAA,GAAAD,OAAA,CAAAE,KAAA,cAAAC,MAAA,CAAAC,MAAA,CAAAD,MAAA,CAAAE,gBAAA,CAAAL,OAAA,IAAAC,GAAA,IAAAK,KAAA,EAAAH,MAAA,CAAAC,MAAA,CAAAH,GAAA;AAW1B,IAAMM,SAAS,GAAG,IAAAC,kBAAM,EAAC,KAAK,EAAE,IAAAC,uBAAgB,EAAC,QAAQ,CAAC,CAAC,CAAAd,eAAA,KAAAA,eAAA,GAAAI,sBAAA,4FAK/C,UAACW,CAAC;EAAA,OAAKA,CAAC,CAACC,MAAM;AAAA,EAC1B;AAOD,IAAMC,KAAK,GAAG,IAAAJ,kBAAM,EAClB,KAAK,EACL,IAAAC,uBAAgB,EAAC,OAAO,EAAE,OAAO,EAAE,SAAS,CAC9C,CAAC,CAAAb,gBAAA,KAAAA,gBAAA,GAAAG,sBAAA,iJAES,UAACW,CAAC;EAAA,OAAM,GAAG,GAAGA,CAAC,CAACG,KAAK,GAAIH,CAAC,CAACI,KAAK;AAAA,GAC/B,UAACJ,CAAC;EAAA,OACTA,CAAC,CAACI,KAAK,GAAGJ,CAAC,CAACG,KAAK,GAAG,CAAC,WAAAE,MAAA,CACT,GAAG,GAAGL,CAAC,CAACG,KAAK,mBAAAE,MAAA,CAClB,GAAG,GAAGL,CAAC,CAACG,KAAK,MAAG;AAAA,GAGL,UAACH,CAAC;EAAA,OACpBA,CAAC,CAACM,OAAO,GACL,IAAAC,YAAG,EAACP,CAAC,CAACQ,KAAK,CAACC,2BAA2B,CAAC,GACxC,IAAAF,YAAG,EAACP,CAAC,CAACQ,KAAK,CAACE,oBAAoB,CAAC;AAAA,EAExC;AAED,IAAMC,MAA6B,GAAG,SAAhCA,MAA6BA,CAAAC,IAAA;EAAA,IAAMT,KAAK,GAAAS,IAAA,CAALT,KAAK;IAAEG,OAAO,GAAAM,IAAA,CAAPN,OAAO;IAAEL,MAAM,GAAAW,IAAA,CAANX,MAAM;EAAA,oBAC7DjB,MAAA,YAAA6B,aAAA,CAAChB,SAAS;IAACI,MAAM,EAAEA;EAAO,GACvBa,KAAK,CAACX,KAAK,CAAC,CACVY,IAAI,CAAC,CAAC,CAAC,CACPC,GAAG,CAAC,UAACC,CAAC,EAAEb,KAAK;IAAA,oBACZpB,MAAA,YAAA6B,aAAA,CAACX,KAAK;MACJgB,GAAG,EAAEd,KAAM,CAAC;MAAA;MACZD,KAAK,EAAEA,KAAM;MACbC,KAAK,EAAEA,KAAM;MACbE,OAAO,EAAEF,KAAK,KAAKE;IAAQ,CAC5B,CAAC;EAAA,CACH,CACM,CAAC;AAAA,CACb;AAAC,IAAAa,QAAA,GAEaR,MAAM;AAAAS,OAAA,cAAAD,QAAA"}

package/dist/cjs/Gallery/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Container","styled","omitEmotionProps","p","heightPercent","clr","theme","galleryColorBg","borderRadius","StyledImage","Image","NavButton","Button","LeftButton","RightButton","MIN_DIST_PX","MAX_ANGLE","Gallery","forwardRef","ref","urls","aspectRatio","imageProps","hideArrows","children","rest","useForwardedRef","innerContainerRef","mergedContainerRef","useState","undefined","imageUrl","setImageUrl","length","imageIndex","setImageIndex","useMemo","Math","round","imageIndexRef","useRef","useEffect","current","startTouchPosRef","size","useSize","sizeRef","statusHeight","height","updateGalleryImage","useCallback","clientX","getBoundingClientRect","x","widthPerImage","width","xPos","nextIndex","floor","prev","index","next","left","e","preventDefault","right","mouseMoveHandler","touchStartHandler","touches","clientY","y","touchMoveHandler","diffX","abs","diffY","diff","sqrt","angle","atan","PI","touchEndHandler","handlers","isTouchDevice","onTouchStart","onTouchMove","onTouchEnd","onMouseMove","colorPrimary"],"sources":["../../../src/Gallery/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { Left, Right } from '@os-design/icons';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport {\n  isTouchDevice,\n  omitEmotionProps,\n  useForwardedRef,\n  useSize,\n} from '@os-design/utils';\nimport React, {\n  forwardRef,\n  MouseEventHandler,\n  TouchEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport Button from '../Button';\nimport Image, { ImageProps } from '../Image';\nimport GalleryStatus from './Status';\n\ninterface ContainerProps {\n  heightPercent: number;\n}\nconst Container = styled(\n  'div',\n  omitEmotionProps('heightPercent')\n)<ContainerProps>`\n  position: relative;\n  padding-bottom: ${(p) => p.heightPercent}%;\n\n  display: flex;\n  justify-content: center;\n\n  background-color: ${(p) => clr(p.theme.galleryColorBg)};\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  overflow: hidden;\n`;\n\nconst StyledImage = styled(Image)`\n  position: absolute;\n  width: auto;\n  height: 100%;\n  border-radius: 0;\n`;\n\nconst NavButton = styled(Button)`\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n\n  background-color: hsla(0, 0%, 0%, 0.5);\n  backdrop-filter: blur(0.2em);\n`;\n\nconst LeftButton = styled(NavButton)`\n  left: 0.2em;\n`;\n\nconst RightButton = styled(NavButton)`\n  right: 0.2em;\n`;\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface GalleryProps extends JsxDivProps {\n  /**\n   * The image urls.\n   */\n  urls: string[] | ReadonlyArray<string>;\n  /**\n   * The aspect ratio of the gallery.\n   * E.g. [16,9] – 16:9.\n   */\n  aspectRatio?: [number, number];\n  /**\n   * The props of the image component.\n   */\n  imageProps?: Omit<ImageProps, 'url'>;\n  /**\n   * Whether the navigation buttons is shown.\n   */\n  hideArrows?: boolean;\n  /**\n   * The children that can be displayed on top of the image.\n   * E.g. tags.\n   */\n  children?: React.ReactNode;\n}\n\nconst MIN_DIST_PX = 30;\nconst MAX_ANGLE = 30;\n\n/**\n * The image gallery. Change the cursor/touch position to change images.\n * The lib 'lazysizes/plugins/attrchange/ls.attrchange' must be imported.\n */\nconst Gallery = forwardRef<HTMLDivElement, GalleryProps>(\n  (\n    {\n      urls,\n      aspectRatio = [16, 9],\n      imageProps = {},\n      hideArrows = false,\n      children,\n      ...rest\n    },\n    ref\n  ) => {\n    const [innerContainerRef, mergedContainerRef] = useForwardedRef(ref);\n\n    const [imageUrl, setImageUrl] = useState<string | undefined>(undefined);\n    const [imageIndex, setImageIndex] = useState(urls.length > 0 ? 0 : null);\n\n    const heightPercent = useMemo(\n      () => Math.round((aspectRatio[1] / aspectRatio[0]) * 1000000) / 10000,\n      [aspectRatio]\n    );\n\n    const imageIndexRef = useRef(imageIndex);\n    useEffect(() => {\n      imageIndexRef.current = imageIndex;\n    }, [imageIndex]);\n\n    // Update the image if the index was changed\n    useEffect(() => {\n      setImageUrl(imageIndex !== null ? urls[imageIndex] : undefined);\n    }, [imageIndex, urls]);\n\n    const startTouchPosRef = useRef<{ x: number; y: number } | null>(null);\n\n    const size = useSize(innerContainerRef);\n    const sizeRef = useRef(size);\n    useEffect(() => {\n      sizeRef.current = size;\n    }, [size]);\n\n    const statusHeight = useMemo(\n      () => Math.round(size.height / 70),\n      [size.height]\n    );\n\n    const updateGalleryImage = useCallback(\n      (clientX: number) => {\n        if (!innerContainerRef.current) return;\n        const { x } = innerContainerRef.current.getBoundingClientRect();\n        const widthPerImage = sizeRef.current.width / urls.length;\n        const xPos = clientX - x;\n        if (xPos < 0) return;\n        const nextIndex = Math.floor(xPos / widthPerImage);\n        if (imageIndexRef.current !== nextIndex) {\n          setImageIndex(nextIndex);\n        }\n      },\n      [innerContainerRef, urls.length]\n    );\n\n    const prev = useCallback(() => {\n      const index = imageIndexRef.current;\n      if (index === null) return;\n      setImageIndex(index > 0 ? index - 1 : urls.length - 1);\n    }, [urls.length]);\n\n    const next = useCallback(() => {\n      const index = imageIndexRef.current;\n      if (index === null) return;\n      setImageIndex(index < urls.length - 1 ? index + 1 : 0);\n    }, [urls.length]);\n\n    const left = useCallback<MouseEventHandler>(\n      (e) => {\n        prev();\n        e.preventDefault();\n      },\n      [prev]\n    );\n\n    const right = useCallback<MouseEventHandler>(\n      (e) => {\n        next();\n        e.preventDefault();\n      },\n      [next]\n    );\n\n    const mouseMoveHandler = useCallback<MouseEventHandler<HTMLDivElement>>(\n      (e) => updateGalleryImage(e.clientX),\n      [updateGalleryImage]\n    );\n\n    const touchStartHandler = useCallback<TouchEventHandler<HTMLDivElement>>(\n      (e) => {\n        const { clientX, clientY } = e.touches[0];\n        startTouchPosRef.current = { x: clientX, y: clientY };\n      },\n      []\n    );\n\n    const touchMoveHandler = useCallback<TouchEventHandler<HTMLDivElement>>(\n      (e) => {\n        if (!startTouchPosRef.current) return;\n        const { x, y } = startTouchPosRef.current;\n        const { clientX, clientY } = e.touches[0];\n        const diffX = Math.abs(x - clientX);\n        const diffY = Math.abs(y - clientY);\n        const diff = Math.sqrt(diffX ** 2 + diffY ** 2);\n        if (diff < MIN_DIST_PX) return;\n        const angle = (Math.atan(diffY / diffX) * 180) / Math.PI;\n        if (angle > MAX_ANGLE) {\n          startTouchPosRef.current = null;\n          return;\n        }\n        if (x < clientX) prev();\n        else next();\n        startTouchPosRef.current = null;\n      },\n      [next, prev]\n    );\n\n    const touchEndHandler = useCallback<\n      TouchEventHandler<HTMLDivElement>\n    >(() => {\n      startTouchPosRef.current = null;\n    }, []);\n\n    const handlers = useMemo(() => {\n      if (isTouchDevice()) {\n        return {\n          onTouchStart: touchStartHandler,\n          onTouchMove: touchMoveHandler,\n          onTouchEnd: touchEndHandler,\n        };\n      }\n      return {\n        onMouseMove: mouseMoveHandler,\n      };\n    }, [\n      mouseMoveHandler,\n      touchEndHandler,\n      touchMoveHandler,\n      touchStartHandler,\n    ]);\n\n    return (\n      <ThemeOverrider activeTheme='dark'>\n        <Container\n          heightPercent={heightPercent}\n          {...handlers}\n          {...rest}\n          ref={mergedContainerRef}\n        >\n          <StyledImage url={imageUrl} {...imageProps} />\n          {urls.length > 1 && imageIndex !== null && (\n            <>\n              <GalleryStatus\n                count={urls.length}\n                current={imageIndex}\n                height={statusHeight}\n              />\n              {isTouchDevice() && !hideArrows && (\n                <ThemeOverrider overrides={{ colorPrimary: [0, 0, 100] }}>\n                  <LeftButton\n                    type='ghost'\n                    wide='never'\n                    size='small'\n                    onClick={left}\n                  >\n                    <Left />\n                  </LeftButton>\n                  <RightButton\n                    type='ghost'\n                    wide='never'\n                    size='small'\n                    onClick={right}\n                  >\n                    <Right />\n                  </RightButton>\n                </ThemeOverrider>\n              )}\n            </>\n          )}\n          {children}\n        </Container>\n      </ThemeOverrider>\n    );\n  }\n);\n\nexport default Gallery;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["_styled","_interopRequireDefault","require","_icons","_theming","_utils","_react","_interopRequireWildcard","_Button","_Image","_Status","_excluded","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_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","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","_taggedTemplateLiteral","strings","raw","freeze","defineProperties","Container","styled","omitEmotionProps","p","heightPercent","clr","theme","galleryColorBg","borderRadius","StyledImage","Image","NavButton","Button","LeftButton","RightButton","MIN_DIST_PX","MAX_ANGLE","Gallery","forwardRef","_ref","ref","urls","_ref$aspectRatio","aspectRatio","_ref$imageProps","imageProps","_ref$hideArrows","hideArrows","children","rest","_useForwardedRef","useForwardedRef","_useForwardedRef2","innerContainerRef","mergedContainerRef","_useState","useState","undefined","_useState2","imageUrl","setImageUrl","_useState3","_useState4","imageIndex","setImageIndex","useMemo","Math","round","imageIndexRef","useRef","useEffect","current","startTouchPosRef","size","useSize","sizeRef","statusHeight","height","updateGalleryImage","useCallback","clientX","_innerContainerRef$cu","getBoundingClientRect","x","widthPerImage","width","xPos","nextIndex","floor","prev","index","left","e","preventDefault","right","mouseMoveHandler","touchStartHandler","_e$touches$","touches","clientY","y","touchMoveHandler","_startTouchPosRef$cur","_e$touches$2","diffX","abs","diffY","diff","sqrt","pow","angle","atan","PI","touchEndHandler","handlers","isTouchDevice","onTouchStart","onTouchMove","onTouchEnd","onMouseMove","createElement","ThemeOverrider","activeTheme","url","Fragment","count","overrides","colorPrimary","type","wide","onClick","Left","Right","_default","exports"],"sources":["../../../src/Gallery/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { Left, Right } from '@os-design/icons';\nimport { ThemeOverrider, clr } from '@os-design/theming';\nimport {\n  isTouchDevice,\n  omitEmotionProps,\n  useForwardedRef,\n  useSize,\n} from '@os-design/utils';\nimport React, {\n  MouseEventHandler,\n  TouchEventHandler,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport Button from '../Button';\nimport Image, { ImageProps } from '../Image';\nimport GalleryStatus from './Status';\n\ninterface ContainerProps {\n  heightPercent: number;\n}\nconst Container = styled(\n  'div',\n  omitEmotionProps('heightPercent')\n)<ContainerProps>`\n  position: relative;\n  padding-bottom: ${(p) => p.heightPercent}%;\n\n  display: flex;\n  justify-content: center;\n\n  background-color: ${(p) => clr(p.theme.galleryColorBg)};\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  overflow: hidden;\n`;\n\nconst StyledImage = styled(Image)`\n  position: absolute;\n  width: auto;\n  height: 100%;\n  border-radius: 0;\n`;\n\nconst NavButton = styled(Button)`\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n\n  background-color: hsla(0, 0%, 0%, 0.5);\n  backdrop-filter: blur(0.2em);\n`;\n\nconst LeftButton = styled(NavButton)`\n  left: 0.2em;\n`;\n\nconst RightButton = styled(NavButton)`\n  right: 0.2em;\n`;\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface GalleryProps extends JsxDivProps {\n  /**\n   * The image urls.\n   */\n  urls: string[] | ReadonlyArray<string>;\n  /**\n   * The aspect ratio of the gallery.\n   * E.g. [16,9] – 16:9.\n   */\n  aspectRatio?: [number, number];\n  /**\n   * The props of the image component.\n   */\n  imageProps?: Omit<ImageProps, 'url'>;\n  /**\n   * Whether the navigation buttons is shown.\n   */\n  hideArrows?: boolean;\n  /**\n   * The children that can be displayed on top of the image.\n   * E.g. tags.\n   */\n  children?: React.ReactNode;\n}\n\nconst MIN_DIST_PX = 30;\nconst MAX_ANGLE = 30;\n\n/**\n * The image gallery. Change the cursor/touch position to change images.\n * The lib 'lazysizes/plugins/attrchange/ls.attrchange' must be imported.\n */\nconst Gallery = forwardRef<HTMLDivElement, GalleryProps>(\n  (\n    {\n      urls,\n      aspectRatio = [16, 9],\n      imageProps = {},\n      hideArrows = false,\n      children,\n      ...rest\n    },\n    ref\n  ) => {\n    const [innerContainerRef, mergedContainerRef] = useForwardedRef(ref);\n\n    const [imageUrl, setImageUrl] = useState<string | undefined>(undefined);\n    const [imageIndex, setImageIndex] = useState(urls.length > 0 ? 0 : null);\n\n    const heightPercent = useMemo(\n      () => Math.round((aspectRatio[1] / aspectRatio[0]) * 1000000) / 10000,\n      [aspectRatio]\n    );\n\n    const imageIndexRef = useRef(imageIndex);\n    useEffect(() => {\n      imageIndexRef.current = imageIndex;\n    }, [imageIndex]);\n\n    // Update the image if the index was changed\n    useEffect(() => {\n      setImageUrl(imageIndex !== null ? urls[imageIndex] : undefined);\n    }, [imageIndex, urls]);\n\n    const startTouchPosRef = useRef<{ x: number; y: number } | null>(null);\n\n    const size = useSize(innerContainerRef);\n    const sizeRef = useRef(size);\n    useEffect(() => {\n      sizeRef.current = size;\n    }, [size]);\n\n    const statusHeight = useMemo(\n      () => Math.round(size.height / 70),\n      [size.height]\n    );\n\n    const updateGalleryImage = useCallback(\n      (clientX: number) => {\n        if (!innerContainerRef.current) return;\n        const { x } = innerContainerRef.current.getBoundingClientRect();\n        const widthPerImage = sizeRef.current.width / urls.length;\n        const xPos = clientX - x;\n        if (xPos < 0) return;\n        const nextIndex = Math.floor(xPos / widthPerImage);\n        if (imageIndexRef.current !== nextIndex) {\n          setImageIndex(nextIndex);\n        }\n      },\n      [innerContainerRef, urls.length]\n    );\n\n    const prev = useCallback(() => {\n      const index = imageIndexRef.current;\n      if (index === null) return;\n      setImageIndex(index > 0 ? index - 1 : urls.length - 1);\n    }, [urls.length]);\n\n    const next = useCallback(() => {\n      const index = imageIndexRef.current;\n      if (index === null) return;\n      setImageIndex(index < urls.length - 1 ? index + 1 : 0);\n    }, [urls.length]);\n\n    const left = useCallback<MouseEventHandler>(\n      (e) => {\n        prev();\n        e.preventDefault();\n      },\n      [prev]\n    );\n\n    const right = useCallback<MouseEventHandler>(\n      (e) => {\n        next();\n        e.preventDefault();\n      },\n      [next]\n    );\n\n    const mouseMoveHandler = useCallback<MouseEventHandler<HTMLDivElement>>(\n      (e) => updateGalleryImage(e.clientX),\n      [updateGalleryImage]\n    );\n\n    const touchStartHandler = useCallback<TouchEventHandler<HTMLDivElement>>(\n      (e) => {\n        const { clientX, clientY } = e.touches[0];\n        startTouchPosRef.current = { x: clientX, y: clientY };\n      },\n      []\n    );\n\n    const touchMoveHandler = useCallback<TouchEventHandler<HTMLDivElement>>(\n      (e) => {\n        if (!startTouchPosRef.current) return;\n        const { x, y } = startTouchPosRef.current;\n        const { clientX, clientY } = e.touches[0];\n        const diffX = Math.abs(x - clientX);\n        const diffY = Math.abs(y - clientY);\n        const diff = Math.sqrt(diffX ** 2 + diffY ** 2);\n        if (diff < MIN_DIST_PX) return;\n        const angle = (Math.atan(diffY / diffX) * 180) / Math.PI;\n        if (angle > MAX_ANGLE) {\n          startTouchPosRef.current = null;\n          return;\n        }\n        if (x < clientX) prev();\n        else next();\n        startTouchPosRef.current = null;\n      },\n      [next, prev]\n    );\n\n    const touchEndHandler = useCallback<\n      TouchEventHandler<HTMLDivElement>\n    >(() => {\n      startTouchPosRef.current = null;\n    }, []);\n\n    const handlers = useMemo(() => {\n      if (isTouchDevice()) {\n        return {\n          onTouchStart: touchStartHandler,\n          onTouchMove: touchMoveHandler,\n          onTouchEnd: touchEndHandler,\n        };\n      }\n      return {\n        onMouseMove: mouseMoveHandler,\n      };\n    }, [\n      mouseMoveHandler,\n      touchEndHandler,\n      touchMoveHandler,\n      touchStartHandler,\n    ]);\n\n    return (\n      <ThemeOverrider activeTheme='dark'>\n        <Container\n          heightPercent={heightPercent}\n          {...handlers}\n          {...rest}\n          ref={mergedContainerRef}\n        >\n          <StyledImage url={imageUrl} {...imageProps} />\n          {urls.length > 1 && imageIndex !== null && (\n            <>\n              <GalleryStatus\n                count={urls.length}\n                current={imageIndex}\n                height={statusHeight}\n              />\n              {isTouchDevice() && !hideArrows && (\n                <ThemeOverrider overrides={{ colorPrimary: [0, 0, 100] }}>\n                  <LeftButton\n                    type='ghost'\n                    wide='never'\n                    size='small'\n                    onClick={left}\n                  >\n                    <Left />\n                  </LeftButton>\n                  <RightButton\n                    type='ghost'\n                    wide='never'\n                    size='small'\n                    onClick={right}\n                  >\n                    <Right />\n                  </RightButton>\n                </ThemeOverrider>\n              )}\n            </>\n          )}\n          {children}\n        </Container>\n      </ThemeOverrider>\n    );\n  }\n);\n\nexport default Gallery;\n"],"mappings":"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"}

package/dist/cjs/GlobalStyles/index.js

@@ -4,15 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _react2 = require("@emotion/react");
+var _react = require("@emotion/react");
 var _utils = require("@os-design/utils");
+var _react2 = _interopRequireDefault(require("react"));
 var _resetStyles = _interopRequireDefault(require("./resetStyles"));
 var _typographyStyles = _interopRequireDefault(require("./typographyStyles"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 var GlobalStyles = function GlobalStyles() {
   (0, _utils.useVh)();
-  return /*#__PURE__*/_react["default"].createElement(_react2.Global, {
+  return /*#__PURE__*/_react2["default"].createElement(_react.Global, {
     styles: function styles(theme) {
       return [(0, _resetStyles["default"])(theme), (0, _typographyStyles["default"])(theme)];
     }

package/dist/cjs/GlobalStyles/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["GlobalStyles","useVh","theme","resetStyles","typographyStyles","displayName"],"sources":["../../../src/GlobalStyles/index.tsx"],"sourcesContent":["import React from 'react';\nimport { Global } from '@emotion/react';\nimport { useVh } from '@os-design/utils';\nimport resetStyles from './resetStyles';\nimport typographyStyles from './typographyStyles';\n\nconst GlobalStyles: React.FC = () => {\n  useVh();\n  return (\n    <Global styles={(theme) => [resetStyles(theme), typographyStyles(theme)]} />\n  );\n};\n\nGlobalStyles.displayName = 'GlobalStyles';\n\nexport default GlobalStyles;\n"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AACA;AAAkD;AAElD,IAAMA,YAAsB,GAAG,SAAzBA,YAAsB,GAAS;EACnC,IAAAC,YAAK,GAAE;EACP,oBACE,gCAAC,cAAM;IAAC,MAAM,EAAE,gBAACC,KAAK;MAAA,OAAK,CAAC,IAAAC,uBAAW,EAACD,KAAK,CAAC,EAAE,IAAAE,4BAAgB,EAACF,KAAK,CAAC,CAAC;IAAA;EAAC,EAAG;AAEhF,CAAC;AAEDF,YAAY,CAACK,WAAW,GAAG,cAAc;AAAC,eAE3BL,YAAY;AAAA"}
+{"version":3,"file":"index.js","names":["_react","require","_utils","_react2","_interopRequireDefault","_resetStyles","_typographyStyles","obj","__esModule","GlobalStyles","useVh","createElement","Global","styles","theme","resetStyles","typographyStyles","displayName","_default","exports"],"sources":["../../../src/GlobalStyles/index.tsx"],"sourcesContent":["import { Global } from '@emotion/react';\nimport { useVh } from '@os-design/utils';\nimport React from 'react';\n\nimport resetStyles from './resetStyles';\nimport typographyStyles from './typographyStyles';\n\nconst GlobalStyles: React.FC = () => {\n  useVh();\n  return (\n    <Global styles={(theme) => [resetStyles(theme), typographyStyles(theme)]} />\n  );\n};\n\nGlobalStyles.displayName = 'GlobalStyles';\n\nexport default GlobalStyles;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAC,sBAAA,CAAAH,OAAA;AAEA,IAAAI,YAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,iBAAA,GAAAF,sBAAA,CAAAH,OAAA;AAAkD,SAAAG,uBAAAG,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,gBAAAA,GAAA;AAElD,IAAME,YAAsB,GAAG,SAAzBA,YAAsBA,CAAA,EAAS;EACnC,IAAAC,YAAK,EAAC,CAAC;EACP,oBACEP,OAAA,YAAAQ,aAAA,CAACX,MAAA,CAAAY,MAAM;IAACC,MAAM,EAAE,SAAAA,OAACC,KAAK;MAAA,OAAK,CAAC,IAAAC,uBAAW,EAACD,KAAK,CAAC,EAAE,IAAAE,4BAAgB,EAACF,KAAK,CAAC,CAAC;IAAA;EAAC,CAAE,CAAC;AAEhF,CAAC;AAEDL,YAAY,CAACQ,WAAW,GAAG,cAAc;AAAC,IAAAC,QAAA,GAE3BT,YAAY;AAAAU,OAAA,cAAAD,QAAA"}

package/dist/cjs/GlobalStyles/resetStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"resetStyles.js","names":["resetStyles","theme","css","paragraphMarginBottom"],"sources":["../../../src/GlobalStyles/resetStyles.ts"],"sourcesContent":["import { css } from '@emotion/react';\nimport { Theme } from '@os-design/theming';\nimport { SerializedStyles } from '@emotion/serialize';\n\nconst resetStyles = (theme: Theme): SerializedStyles => css`\n  body {\n    margin: 0;\n  }\n\n  p,\n  figure,\n  pre {\n    margin: 0 0 ${theme.paragraphMarginBottom}em;\n  }\n`;\n\nexport default resetStyles;\n"],"mappings":";;;;;;AAAA;AAAqC;AAAA;AAIrC,IAAMA,WAAW,GAAG,SAAdA,WAAW,CAAIC,KAAY;EAAA,WAAuBC,UAAG,kKAQzCD,KAAK,CAACE,qBAAqB;AAAA,CAE5C;AAAC,eAEaH,WAAW;AAAA"}
+{"version":3,"file":"resetStyles.js","names":["_react","require","_templateObject","_taggedTemplateLiteral","strings","raw","slice","Object","freeze","defineProperties","value","resetStyles","theme","css","paragraphMarginBottom","_default","exports"],"sources":["../../../src/GlobalStyles/resetStyles.ts"],"sourcesContent":["import { css } from '@emotion/react';\nimport { SerializedStyles } from '@emotion/serialize';\nimport { Theme } from '@os-design/theming';\n\nconst resetStyles = (theme: Theme): SerializedStyles => css`\n  body {\n    margin: 0;\n  }\n\n  p,\n  figure,\n  pre {\n    margin: 0 0 ${theme.paragraphMarginBottom}em;\n  }\n`;\n\nexport default resetStyles;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAAqC,IAAAC,eAAA;AAAA,SAAAC,uBAAAC,OAAA,EAAAC,GAAA,SAAAA,GAAA,IAAAA,GAAA,GAAAD,OAAA,CAAAE,KAAA,cAAAC,MAAA,CAAAC,MAAA,CAAAD,MAAA,CAAAE,gBAAA,CAAAL,OAAA,IAAAC,GAAA,IAAAK,KAAA,EAAAH,MAAA,CAAAC,MAAA,CAAAH,GAAA;AAIrC,IAAMM,WAAW,GAAG,SAAdA,WAAWA,CAAIC,KAAY;EAAA,WAAuBC,UAAG,EAAAX,eAAA,KAAAA,eAAA,GAAAC,sBAAA,oGAQzCS,KAAK,CAACE,qBAAqB;AAAA,CAE5C;AAAC,IAAAC,QAAA,GAEaJ,WAAW;AAAAK,OAAA,cAAAD,QAAA"}

package/dist/cjs/GlobalStyles/typographyStyles.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _react = require("@emotion/react");
-var _facepaint = _interopRequireDefault(require("facepaint"));
 var _media = require("@os-design/media");
 var _theming = require("@os-design/theming");
+var _facepaint = _interopRequireDefault(require("facepaint"));
 var _templateObject;
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }

package/dist/cjs/GlobalStyles/typographyStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"typographyStyles.js","names":["headingsFontSizeStyles","fontSize","headings","fp","literal","map","item","headingsMarginTopStyles","marginTop","h","typographyStyles","theme","css","clr","colorText","lineHeight","m","min","md","xxl","s","colorBg","headingsMarginBottom","headingsMarginTop","headingsFontSize","headingsFontSizeMd"],"sources":["../../../src/GlobalStyles/typographyStyles.ts"],"sourcesContent":["import { css } from '@emotion/react';\nimport fp from 'facepaint';\nimport { SerializedStyles } from '@emotion/serialize';\nimport { m } from '@os-design/media';\nimport { Theme, clr } from '@os-design/theming';\n\nconst headingsFontSizeStyles = (fontSize: number[]) => {\n  const headings = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];\n  return fp(headings, { literal: true })({\n    fontSize: fontSize.map((item) => `${item}em`),\n  });\n};\n\nconst headingsMarginTopStyles = (marginTop: number[]) => {\n  const headings = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].map(\n    (h) => `${h}:not(:first-of-type)`\n  );\n  return fp(headings, { literal: true })({\n    marginTop: marginTop.map((item) => `${item}em`),\n  });\n};\n\nconst typographyStyles = (theme: Theme): SerializedStyles => css`\n  html,\n  button,\n  input,\n  textarea,\n  select {\n    font-family: 'Helvetica Neue', Helvetica, sans-serif;\n  }\n\n  html,\n  input {\n    color: ${clr(theme.colorText)};\n  }\n\n  html {\n    line-height: ${theme.lineHeight};\n\n    // Sets the font smoothing\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    text-rendering: optimizeLegibility;\n\n    // Sets the base font size and increases it on large screens\n    ${fp([m.min.md, m.min.xxl])({\n      fontSize: theme.fontSize.map((s) => `${s}px`),\n    })};\n  }\n\n  body {\n    background-color: ${clr(theme.colorBg)};\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    font-weight: bold;\n    line-height: 1.2;\n    margin: 0 0 ${theme.headingsMarginBottom}em;\n  }\n\n  // Sets the margin top of headings\n  ${headingsMarginTopStyles(theme.headingsMarginTop)};\n\n  // Sets the base font size of headings\n  ${headingsFontSizeStyles(theme.headingsFontSize)};\n\n  // Sets the font size of headings on large screens\n  ${m.min.md} {\n    ${headingsFontSizeStyles(theme.headingsFontSizeMd)}\n  }\n`;\n\nexport default typographyStyles;\n"],"mappings":";;;;;;AAAA;AACA;AAEA;AACA;AAAgD;AAAA;AAAA;AAEhD,IAAMA,sBAAsB,GAAG,SAAzBA,sBAAsB,CAAIC,QAAkB,EAAK;EACrD,IAAMC,QAAQ,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;EACrD,OAAO,IAAAC,qBAAE,EAACD,QAAQ,EAAE;IAAEE,OAAO,EAAE;EAAK,CAAC,CAAC,CAAC;IACrCH,QAAQ,EAAEA,QAAQ,CAACI,GAAG,CAAC,UAACC,IAAI;MAAA,iBAAQA,IAAI;IAAA,CAAI;EAC9C,CAAC,CAAC;AACJ,CAAC;AAED,IAAMC,uBAAuB,GAAG,SAA1BA,uBAAuB,CAAIC,SAAmB,EAAK;EACvD,IAAMN,QAAQ,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAACG,GAAG,CACvD,UAACI,CAAC;IAAA,iBAAQA,CAAC;EAAA,CAAsB,CAClC;EACD,OAAO,IAAAN,qBAAE,EAACD,QAAQ,EAAE;IAAEE,OAAO,EAAE;EAAK,CAAC,CAAC,CAAC;IACrCI,SAAS,EAAEA,SAAS,CAACH,GAAG,CAAC,UAACC,IAAI;MAAA,iBAAQA,IAAI;IAAA,CAAI;EAChD,CAAC,CAAC;AACJ,CAAC;AAED,IAAMI,gBAAgB,GAAG,SAAnBA,gBAAgB,CAAIC,KAAY;EAAA,WAAuBC,UAAG,k2BAWnD,IAAAC,YAAG,EAACF,KAAK,CAACG,SAAS,CAAC,EAIdH,KAAK,CAACI,UAAU,EAQ7B,IAAAZ,qBAAE,EAAC,CAACa,QAAC,CAACC,GAAG,CAACC,EAAE,EAAEF,QAAC,CAACC,GAAG,CAACE,GAAG,CAAC,CAAC,CAAC;IAC1BlB,QAAQ,EAAEU,KAAK,CAACV,QAAQ,CAACI,GAAG,CAAC,UAACe,CAAC;MAAA,iBAAQA,CAAC;IAAA,CAAI;EAC9C,CAAC,CAAC,EAIkB,IAAAP,YAAG,EAACF,KAAK,CAACU,OAAO,CAAC,EAWxBV,KAAK,CAACW,oBAAoB,EAIxCf,uBAAuB,CAACI,KAAK,CAACY,iBAAiB,CAAC,EAGhDvB,sBAAsB,CAACW,KAAK,CAACa,gBAAgB,CAAC,EAG9CR,QAAC,CAACC,GAAG,CAACC,EAAE,EACNlB,sBAAsB,CAACW,KAAK,CAACc,kBAAkB,CAAC;AAAA,CAErD;AAAC,eAEaf,gBAAgB;AAAA"}
+{"version":3,"file":"typographyStyles.js","names":["_react","require","_media","_theming","_facepaint","_interopRequireDefault","_templateObject","obj","__esModule","_taggedTemplateLiteral","strings","raw","slice","Object","freeze","defineProperties","value","headingsFontSizeStyles","fontSize","headings","fp","literal","map","item","concat","headingsMarginTopStyles","marginTop","h","typographyStyles","theme","css","clr","colorText","lineHeight","m","min","md","xxl","s","colorBg","headingsMarginBottom","headingsMarginTop","headingsFontSize","headingsFontSizeMd","_default","exports"],"sources":["../../../src/GlobalStyles/typographyStyles.ts"],"sourcesContent":["import { css } from '@emotion/react';\nimport { SerializedStyles } from '@emotion/serialize';\nimport { m } from '@os-design/media';\nimport { Theme, clr } from '@os-design/theming';\nimport fp from 'facepaint';\n\nconst headingsFontSizeStyles = (fontSize: number[]) => {\n  const headings = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];\n  return fp(headings, { literal: true })({\n    fontSize: fontSize.map((item) => `${item}em`),\n  });\n};\n\nconst headingsMarginTopStyles = (marginTop: number[]) => {\n  const headings = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].map(\n    (h) => `${h}:not(:first-of-type)`\n  );\n  return fp(headings, { literal: true })({\n    marginTop: marginTop.map((item) => `${item}em`),\n  });\n};\n\nconst typographyStyles = (theme: Theme): SerializedStyles => css`\n  html,\n  button,\n  input,\n  textarea,\n  select {\n    font-family: 'Helvetica Neue', Helvetica, sans-serif;\n  }\n\n  html,\n  input {\n    color: ${clr(theme.colorText)};\n  }\n\n  html {\n    line-height: ${theme.lineHeight};\n\n    // Sets the font smoothing\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    text-rendering: optimizeLegibility;\n\n    // Sets the base font size and increases it on large screens\n    ${fp([m.min.md, m.min.xxl])({\n      fontSize: theme.fontSize.map((s) => `${s}px`),\n    })};\n  }\n\n  body {\n    background-color: ${clr(theme.colorBg)};\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    font-weight: bold;\n    line-height: 1.2;\n    margin: 0 0 ${theme.headingsMarginBottom}em;\n  }\n\n  // Sets the margin top of headings\n  ${headingsMarginTopStyles(theme.headingsMarginTop)};\n\n  // Sets the base font size of headings\n  ${headingsFontSizeStyles(theme.headingsFontSize)};\n\n  // Sets the font size of headings on large screens\n  ${m.min.md} {\n    ${headingsFontSizeStyles(theme.headingsFontSizeMd)}\n  }\n`;\n\nexport default typographyStyles;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AACA,IAAAG,UAAA,GAAAC,sBAAA,CAAAJ,OAAA;AAA2B,IAAAK,eAAA;AAAA,SAAAD,uBAAAE,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,gBAAAA,GAAA;AAAA,SAAAE,uBAAAC,OAAA,EAAAC,GAAA,SAAAA,GAAA,IAAAA,GAAA,GAAAD,OAAA,CAAAE,KAAA,cAAAC,MAAA,CAAAC,MAAA,CAAAD,MAAA,CAAAE,gBAAA,CAAAL,OAAA,IAAAC,GAAA,IAAAK,KAAA,EAAAH,MAAA,CAAAC,MAAA,CAAAH,GAAA;AAE3B,IAAMM,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAIC,QAAkB,EAAK;EACrD,IAAMC,QAAQ,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;EACrD,OAAO,IAAAC,qBAAE,EAACD,QAAQ,EAAE;IAAEE,OAAO,EAAE;EAAK,CAAC,CAAC,CAAC;IACrCH,QAAQ,EAAEA,QAAQ,CAACI,GAAG,CAAC,UAACC,IAAI;MAAA,UAAAC,MAAA,CAAQD,IAAI;IAAA,CAAI;EAC9C,CAAC,CAAC;AACJ,CAAC;AAED,IAAME,uBAAuB,GAAG,SAA1BA,uBAAuBA,CAAIC,SAAmB,EAAK;EACvD,IAAMP,QAAQ,GAAG,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAACG,GAAG,CACvD,UAACK,CAAC;IAAA,UAAAH,MAAA,CAAQG,CAAC;EAAA,CACb,CAAC;EACD,OAAO,IAAAP,qBAAE,EAACD,QAAQ,EAAE;IAAEE,OAAO,EAAE;EAAK,CAAC,CAAC,CAAC;IACrCK,SAAS,EAAEA,SAAS,CAACJ,GAAG,CAAC,UAACC,IAAI;MAAA,UAAAC,MAAA,CAAQD,IAAI;IAAA,CAAI;EAChD,CAAC,CAAC;AACJ,CAAC;AAED,IAAMK,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIC,KAAY;EAAA,WAAuBC,UAAG,EAAAxB,eAAA,KAAAA,eAAA,GAAAG,sBAAA,oyBAWnD,IAAAsB,YAAG,EAACF,KAAK,CAACG,SAAS,CAAC,EAIdH,KAAK,CAACI,UAAU,EAQ7B,IAAAb,qBAAE,EAAC,CAACc,QAAC,CAACC,GAAG,CAACC,EAAE,EAAEF,QAAC,CAACC,GAAG,CAACE,GAAG,CAAC,CAAC,CAAC;IAC1BnB,QAAQ,EAAEW,KAAK,CAACX,QAAQ,CAACI,GAAG,CAAC,UAACgB,CAAC;MAAA,UAAAd,MAAA,CAAQc,CAAC;IAAA,CAAI;EAC9C,CAAC,CAAC,EAIkB,IAAAP,YAAG,EAACF,KAAK,CAACU,OAAO,CAAC,EAWxBV,KAAK,CAACW,oBAAoB,EAIxCf,uBAAuB,CAACI,KAAK,CAACY,iBAAiB,CAAC,EAGhDxB,sBAAsB,CAACY,KAAK,CAACa,gBAAgB,CAAC,EAG9CR,QAAC,CAACC,GAAG,CAACC,EAAE,EACNnB,sBAAsB,CAACY,KAAK,CAACc,kBAAkB,CAAC;AAAA,CAErD;AAAC,IAAAC,QAAA,GAEahB,gBAAgB;AAAAiB,OAAA,cAAAD,QAAA"}

package/dist/cjs/HeaderSkeleton/index.js

@@ -5,11 +5,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+var _react = require("@emotion/react");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _react = _interopRequireWildcard(require("react"));
-var _utils = require("@os-design/utils");
 var _media = require("@os-design/media");
-var _react2 = require("@emotion/react");
+var _utils = require("@os-design/utils");
+var _react2 = _interopRequireWildcard(require("react"));
 var _Skeleton = _interopRequireDefault(require("../Skeleton"));
 var _excluded = ["type", "hasMargin", "width"];
 var _templateObject, _templateObject2;
@@ -21,7 +21,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 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 hasMarginStyles = function hasMarginStyles(p) {
-  return p.hasMargin && (0, _react2.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    margin: ", "em 0\n      ", "em;\n  "])), p.theme.headingsMarginTop[p.type - 1], p.theme.headingsMarginBottom);
+  return p.hasMargin && (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    margin: ", "em 0\n      ", "em;\n  "])), p.theme.headingsMarginTop[p.type - 1], p.theme.headingsMarginBottom);
 };
 var MULTIPLIER = 0.9;
 var StyledHeaderSkeleton = (0, _styled["default"])(_Skeleton["default"], (0, _utils.omitEmotionProps)('type', 'hasMargin'))(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  font-size: ", "em;\n  ", " {\n    font-size: ", "em;\n  }\n  ", ";\n"])), function (p) {
@@ -33,7 +33,7 @@ var StyledHeaderSkeleton = (0, _styled["default"])(_Skeleton["default"], (0, _ut
 /**
  * Provides a header placeholder while a user waits for the content to load.
  */
-var HeaderSkeleton = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+var HeaderSkeleton = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, ref) {
   var _ref$type = _ref.type,
     type = _ref$type === void 0 ? 1 : _ref$type,
     _ref$hasMargin = _ref.hasMargin,
@@ -41,7 +41,7 @@ var HeaderSkeleton = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? '100%' : _ref$width,
     rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/_react["default"].createElement(StyledHeaderSkeleton, _extends({
+  return /*#__PURE__*/_react2["default"].createElement(StyledHeaderSkeleton, _extends({
     type: type,
     hasMargin: hasMargin,
     width: width

package/dist/cjs/HeaderSkeleton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["hasMarginStyles","p","hasMargin","css","theme","headingsMarginTop","type","headingsMarginBottom","MULTIPLIER","StyledHeaderSkeleton","styled","Skeleton","omitEmotionProps","headingsFontSize","m","min","md","headingsFontSizeMd","HeaderSkeleton","forwardRef","ref","width","rest","displayName"],"sources":["../../../src/HeaderSkeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport React, { forwardRef } from 'react';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { m } from '@os-design/media';\nimport { css } from '@emotion/react';\nimport Skeleton, { SkeletonProps } from '../Skeleton';\n\nexport interface HeaderSkeletonProps extends SkeletonProps {\n  /**\n   * The header type.\n   * @default 1\n   */\n  type?: 1 | 2 | 3 | 4 | 5 | 6;\n  /**\n   * Whether the header has top and bottom margins.\n   * @default false\n   */\n  hasMargin?: boolean;\n}\n\nconst hasMarginStyles = (p) =>\n  p.hasMargin &&\n  css`\n    margin: ${p.theme.headingsMarginTop[p.type - 1]}em 0\n      ${p.theme.headingsMarginBottom}em;\n  `;\n\nconst MULTIPLIER = 0.9;\n\ntype StyledHeaderSkeletonProps = Required<\n  Pick<HeaderSkeletonProps, 'type' | 'hasMargin'>\n>;\nconst StyledHeaderSkeleton = styled(\n  Skeleton,\n  omitEmotionProps('type', 'hasMargin')\n)<StyledHeaderSkeletonProps>`\n  font-size: ${(p) => p.theme.headingsFontSize[p.type - 1] * MULTIPLIER}em;\n  ${m.min.md} {\n    font-size: ${(p) => p.theme.headingsFontSizeMd[p.type - 1] * MULTIPLIER}em;\n  }\n  ${hasMarginStyles};\n`;\n\n/**\n * Provides a header placeholder while a user waits for the content to load.\n */\nconst HeaderSkeleton = forwardRef<HTMLDivElement, HeaderSkeletonProps>(\n  ({ type = 1, hasMargin = false, width = '100%', ...rest }, ref) => (\n    <StyledHeaderSkeleton\n      type={type}\n      hasMargin={hasMargin}\n      width={width}\n      {...rest}\n      ref={ref}\n    />\n  )\n);\n\nHeaderSkeleton.displayName = 'HeaderSkeleton';\n\nexport default HeaderSkeleton;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAAsD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAetD,IAAMA,eAAe,GAAG,SAAlBA,eAAe,CAAIC,CAAC;EAAA,OACxBA,CAAC,CAACC,SAAS,QACXC,WAAG,gHACSF,CAAC,CAACG,KAAK,CAACC,iBAAiB,CAACJ,CAAC,CAACK,IAAI,GAAG,CAAC,CAAC,EAC3CL,CAAC,CAACG,KAAK,CAACG,oBAAoB,CACjC;AAAA;AAEH,IAAMC,UAAU,GAAG,GAAG;AAKtB,IAAMC,oBAAoB,GAAG,IAAAC,kBAAM,EACjCC,oBAAQ,EACR,IAAAC,uBAAgB,EAAC,MAAM,EAAE,WAAW,CAAC,CACtC,gJACc,UAACX,CAAC;EAAA,OAAKA,CAAC,CAACG,KAAK,CAACS,gBAAgB,CAACZ,CAAC,CAACK,IAAI,GAAG,CAAC,CAAC,GAAGE,UAAU;AAAA,GACnEM,QAAC,CAACC,GAAG,CAACC,EAAE,EACK,UAACf,CAAC;EAAA,OAAKA,CAAC,CAACG,KAAK,CAACa,kBAAkB,CAAChB,CAAC,CAACK,IAAI,GAAG,CAAC,CAAC,GAAGE,UAAU;AAAA,GAEvER,eAAe,CAClB;;AAED;AACA;AACA;AACA,IAAMkB,cAAc,gBAAG,IAAAC,iBAAU,EAC/B,gBAA2DC,GAAG;EAAA,qBAA3Dd,IAAI;IAAJA,IAAI,0BAAG,CAAC;IAAA,sBAAEJ,SAAS;IAATA,SAAS,+BAAG,KAAK;IAAA,kBAAEmB,KAAK;IAALA,KAAK,2BAAG,MAAM;IAAKC,IAAI;EAAA,oBACrD,gCAAC,oBAAoB;IACnB,IAAI,EAAEhB,IAAK;IACX,SAAS,EAAEJ,SAAU;IACrB,KAAK,EAAEmB;EAAM,GACTC,IAAI;IACR,GAAG,EAAEF;EAAI,GACT;AAAA,CACH,CACF;AAEDF,cAAc,CAACK,WAAW,GAAG,gBAAgB;AAAC,eAE/BL,cAAc;AAAA"}
+{"version":3,"file":"index.js","names":["_react","require","_styled","_interopRequireDefault","_media","_utils","_react2","_interopRequireWildcard","_Skeleton","_excluded","_templateObject","_templateObject2","_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","hasMarginStyles","p","hasMargin","css","theme","headingsMarginTop","type","headingsMarginBottom","MULTIPLIER","StyledHeaderSkeleton","styled","Skeleton","omitEmotionProps","headingsFontSize","m","min","md","headingsFontSizeMd","HeaderSkeleton","forwardRef","_ref","ref","_ref$type","_ref$hasMargin","_ref$width","width","rest","createElement","displayName","_default","exports"],"sources":["../../../src/HeaderSkeleton/index.tsx"],"sourcesContent":["import { css } from '@emotion/react';\n\nimport styled from '@emotion/styled';\nimport { m } from '@os-design/media';\n\nimport { omitEmotionProps } from '@os-design/utils';\nimport React, { forwardRef } from 'react';\n\nimport Skeleton, { SkeletonProps } from '../Skeleton';\n\nexport interface HeaderSkeletonProps extends SkeletonProps {\n  /**\n   * The header type.\n   * @default 1\n   */\n  type?: 1 | 2 | 3 | 4 | 5 | 6;\n  /**\n   * Whether the header has top and bottom margins.\n   * @default false\n   */\n  hasMargin?: boolean;\n}\n\nconst hasMarginStyles = (p) =>\n  p.hasMargin &&\n  css`\n    margin: ${p.theme.headingsMarginTop[p.type - 1]}em 0\n      ${p.theme.headingsMarginBottom}em;\n  `;\n\nconst MULTIPLIER = 0.9;\n\ntype StyledHeaderSkeletonProps = Required<\n  Pick<HeaderSkeletonProps, 'type' | 'hasMargin'>\n>;\nconst StyledHeaderSkeleton = styled(\n  Skeleton,\n  omitEmotionProps('type', 'hasMargin')\n)<StyledHeaderSkeletonProps>`\n  font-size: ${(p) => p.theme.headingsFontSize[p.type - 1] * MULTIPLIER}em;\n  ${m.min.md} {\n    font-size: ${(p) => p.theme.headingsFontSizeMd[p.type - 1] * MULTIPLIER}em;\n  }\n  ${hasMarginStyles};\n`;\n\n/**\n * Provides a header placeholder while a user waits for the content to load.\n */\nconst HeaderSkeleton = forwardRef<HTMLDivElement, HeaderSkeletonProps>(\n  ({ type = 1, hasMargin = false, width = '100%', ...rest }, ref) => (\n    <StyledHeaderSkeleton\n      type={type}\n      hasMargin={hasMargin}\n      width={width}\n      {...rest}\n      ref={ref}\n    />\n  )\n);\n\nHeaderSkeleton.displayName = 'HeaderSkeleton';\n\nexport default HeaderSkeleton;\n"],"mappings":"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"}

package/dist/cjs/Image/index.js

@@ -5,22 +5,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("@emotion/react");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _utils = require("@os-design/utils");
-var _react2 = require("@emotion/react");
+var _react2 = _interopRequireWildcard(require("react"));
 var _excluded = ["url", "sizes", "defaultSize", "cropped", "cover", "className"];
 var _templateObject, _templateObject2;
-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 _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 EMPTY_IMAGE = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mO8+R8AArcB2pIvCSwAAAAASUVORK5CYII=';
 var coverStyles = function coverStyles(p) {
-  return p.cover && (0, _react2.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    height: 100%;\n    object-fit: cover;\n  "])));
+  return p.cover && (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    height: 100%;\n    object-fit: cover;\n  "])));
 };
 var StyledImage = (0, _styled["default"])('img', (0, _utils.omitEmotionProps)('cover'))(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: block; // To remove the indent under the image\n  width: 100%;\n  border-radius: ", "em;\n  ", ";\n"])), function (p) {
   return p.theme.borderRadius;
@@ -30,7 +30,7 @@ var StyledImage = (0, _styled["default"])('img', (0, _utils.omitEmotionProps)('c
  * The image with lazy loading. Required lazysizes.
  * Should be loaded by @os-team/image-storage.
  */
-var Image = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+var Image = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, ref) {
   var url = _ref.url,
     _ref$sizes = _ref.sizes,
     sizes = _ref$sizes === void 0 ? [72, 192, 512, 1024, 2560] : _ref$sizes,
@@ -42,18 +42,18 @@ var Image = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     cover = _ref$cover === void 0 ? false : _ref$cover,
     className = _ref.className,
     rest = _objectWithoutProperties(_ref, _excluded);
-  var getUrl = (0, _react.useCallback)(function (size) {
+  var getUrl = (0, _react2.useCallback)(function (size) {
     return "".concat(url, "-").concat(size).concat(cropped ? '-c' : '');
   }, [url, cropped]);
   if (!url) {
-    return /*#__PURE__*/_react["default"].createElement(StyledImage, _extends({
+    return /*#__PURE__*/_react2["default"].createElement(StyledImage, _extends({
       src: EMPTY_IMAGE,
       className: className
     }, rest, {
       ref: ref
     }));
   }
-  return /*#__PURE__*/_react["default"].createElement(StyledImage, _extends({
+  return /*#__PURE__*/_react2["default"].createElement(StyledImage, _extends({
     src: getUrl(defaultSize),
     srcSet: EMPTY_IMAGE,
     "data-sizes": "auto",