@os-design/core 1.0.156 → 1.0.157

package/dist/cjs/Select/index.js

@@ -1,85 +1,51 @@
 "use strict";
 
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = exports.SelectContainer = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _styles = require("@os-design/styles");
-
 var _utils = require("@os-design/utils");
-
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-
 var _media = require("@os-design/media");
-
 var _react2 = require("@emotion/react");
-
 var _theming = require("@os-design/theming");
-
 var _Input = require("../Input");
-
 var _Menu = _interopRequireDefault(require("../Menu"));
-
 var _InputSearch = _interopRequireDefault(require("../InputSearch"));
-
 var _SelectToggle = _interopRequireDefault(require("./SelectToggle"));
-
 var _SelectList = _interopRequireDefault(require("./SelectList"));
-
 var _defaultLocale = _interopRequireDefault(require("./utils/defaultLocale"));
-
 var _excluded = ["options", "left", "leftHasPadding", "right", "rightHasPadding", "placeholder", "searchVisible", "searchProps", "notFoundText", "unbordered", "loading", "disabled", "clearVisible", "threshold", "visibleCount", "overscanCount", "maxSelectedItems", "locale", "value", "defaultValue", "onChange", "onLoadNext", "size", "placement"];
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
-
 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 _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
 function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
 var paddingStyles = function paddingStyles(p) {
   var paddingVertical = (p.theme.baseHeight - p.theme.selectToggleListItemHeight) / 2;
   return (0, _react2.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    padding: calc(", "em - 1px) 0;\n  "])), paddingVertical);
 };
-
 var openedStyles = function openedStyles(p) {
   return p.opened && !p.unbordered && (0, _react2.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    border-color: ", ";\n    box-shadow: 0 0 0 0.15em ", ";\n  "])), (0, _theming.clr)(p.theme.inputFocusColorBorder), (0, _theming.clr)(p.theme.inputFocusColorShadow));
 };
-
 var unborderedStyles = function unborderedStyles(p) {
   return p.unbordered && (0, _react2.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    border: 0;\n    box-shadow: none !important;\n    ", ";\n  "])), (0, _styles.transitionStyles)('background-color')(p));
 };
-
 var unborderedHoverStyles = function unborderedHoverStyles(p) {
   return p.unbordered && !p.disabled && (0, _react2.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    @media (hover: hover) {\n      &:hover,\n      &:focus {\n        background-color: ", ";\n      }\n    }\n  "])), (0, _theming.clr)(p.theme.buttonGhostColorBgHover));
 };
-
 var SelectContainer = (0, _styled["default"])(_Input.InputContainer, (0, _utils.omitEmotionProps)('opened', 'unbordered', 'disabled'))(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  cursor: ", ";\n  user-select: none;\n  position: relative;\n  display: flex;\n  align-items: center;\n\n  height: unset;\n  min-height: ", "em;\n\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n"])), function (p) {
   return !p.disabled ? 'pointer' : 'not-allowed';
 }, function (p) {
@@ -89,7 +55,6 @@ exports.SelectContainer = SelectContainer;
 var SelectMenu = (0, _styled["default"])(_Menu["default"], (0, _utils.omitEmotionProps)('width'))(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  padding-top: 0;\n  padding-bottom: 0;\n  max-height: unset;\n\n  ", " {\n    width: ", "px;\n  }\n"])), _media.m.min.xs, function (p) {
   return p.width;
 });
-
 var NotFound = _styled["default"].div(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  height: ", "em;\n  display: flex;\n  align-items: center;\n\n  padding: 0 ", "em;\n  color: ", ";\n"])), function (p) {
   return p.theme.menuItemHeight;
 }, function (p) {
@@ -97,91 +62,83 @@ var NotFound = _styled["default"].div(_templateObject7 || (_templateObject7 = _t
 }, function (p) {
   return (0, _theming.clr)(p.theme.selectNotFoundColorText);
 });
-
 var InputSearchContainer = _styled["default"].div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  padding: ", "em\n    ", "em 0;\n"])), function (p) {
   return p.theme.menuPaddingVertical;
 }, function (p) {
   return p.theme.inputPaddingHorizontal;
 });
+
 /**
  * The component that allows to pick a value from predefined options.
  */
-
-
 var Select = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var _ref$options = _ref.options,
-      options = _ref$options === void 0 ? [] : _ref$options,
-      left = _ref.left,
-      _ref$leftHasPadding = _ref.leftHasPadding,
-      leftHasPadding = _ref$leftHasPadding === void 0 ? false : _ref$leftHasPadding,
-      right = _ref.right,
-      _ref$rightHasPadding = _ref.rightHasPadding,
-      rightHasPadding = _ref$rightHasPadding === void 0 ? false : _ref$rightHasPadding,
-      placeholder = _ref.placeholder,
-      _ref$searchVisible = _ref.searchVisible,
-      searchVisible = _ref$searchVisible === void 0 ? false : _ref$searchVisible,
-      _ref$searchProps = _ref.searchProps,
-      searchProps = _ref$searchProps === void 0 ? {} : _ref$searchProps,
-      _ref$notFoundText = _ref.notFoundText,
-      notFoundText = _ref$notFoundText === void 0 ? 'Not found' : _ref$notFoundText,
-      _ref$unbordered = _ref.unbordered,
-      unbordered = _ref$unbordered === void 0 ? false : _ref$unbordered,
-      _ref$loading = _ref.loading,
-      loading = _ref$loading === void 0 ? false : _ref$loading,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      _ref$clearVisible = _ref.clearVisible,
-      clearVisible = _ref$clearVisible === void 0 ? false : _ref$clearVisible,
-      _ref$threshold = _ref.threshold,
-      threshold = _ref$threshold === void 0 ? 10 : _ref$threshold,
-      _ref$visibleCount = _ref.visibleCount,
-      visibleCount = _ref$visibleCount === void 0 ? 6 : _ref$visibleCount,
-      _ref$overscanCount = _ref.overscanCount,
-      overscanCount = _ref$overscanCount === void 0 ? 10 : _ref$overscanCount,
-      _ref$maxSelectedItems = _ref.maxSelectedItems,
-      maxSelectedItems = _ref$maxSelectedItems === void 0 ? 1 : _ref$maxSelectedItems,
-      _ref$locale = _ref.locale,
-      locale = _ref$locale === void 0 ? _defaultLocale["default"] : _ref$locale,
-      value = _ref.value,
-      defaultValue = _ref.defaultValue,
-      onChange = _ref.onChange,
-      _ref$onLoadNext = _ref.onLoadNext,
-      onLoadNext = _ref$onLoadNext === void 0 ? function () {} : _ref$onLoadNext,
-      size = _ref.size,
-      placement = _ref.placement,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    options = _ref$options === void 0 ? [] : _ref$options,
+    left = _ref.left,
+    _ref$leftHasPadding = _ref.leftHasPadding,
+    leftHasPadding = _ref$leftHasPadding === void 0 ? false : _ref$leftHasPadding,
+    right = _ref.right,
+    _ref$rightHasPadding = _ref.rightHasPadding,
+    rightHasPadding = _ref$rightHasPadding === void 0 ? false : _ref$rightHasPadding,
+    placeholder = _ref.placeholder,
+    _ref$searchVisible = _ref.searchVisible,
+    searchVisible = _ref$searchVisible === void 0 ? false : _ref$searchVisible,
+    _ref$searchProps = _ref.searchProps,
+    searchProps = _ref$searchProps === void 0 ? {} : _ref$searchProps,
+    _ref$notFoundText = _ref.notFoundText,
+    notFoundText = _ref$notFoundText === void 0 ? 'Not found' : _ref$notFoundText,
+    _ref$unbordered = _ref.unbordered,
+    unbordered = _ref$unbordered === void 0 ? false : _ref$unbordered,
+    _ref$loading = _ref.loading,
+    loading = _ref$loading === void 0 ? false : _ref$loading,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$clearVisible = _ref.clearVisible,
+    clearVisible = _ref$clearVisible === void 0 ? false : _ref$clearVisible,
+    _ref$threshold = _ref.threshold,
+    threshold = _ref$threshold === void 0 ? 10 : _ref$threshold,
+    _ref$visibleCount = _ref.visibleCount,
+    visibleCount = _ref$visibleCount === void 0 ? 6 : _ref$visibleCount,
+    _ref$overscanCount = _ref.overscanCount,
+    overscanCount = _ref$overscanCount === void 0 ? 10 : _ref$overscanCount,
+    _ref$maxSelectedItems = _ref.maxSelectedItems,
+    maxSelectedItems = _ref$maxSelectedItems === void 0 ? 1 : _ref$maxSelectedItems,
+    _ref$locale = _ref.locale,
+    locale = _ref$locale === void 0 ? _defaultLocale["default"] : _ref$locale,
+    value = _ref.value,
+    defaultValue = _ref.defaultValue,
+    onChange = _ref.onChange,
+    _ref$onLoadNext = _ref.onLoadNext,
+    onLoadNext = _ref$onLoadNext === void 0 ? function () {} : _ref$onLoadNext,
+    size = _ref.size,
+    placement = _ref.placement,
+    rest = _objectWithoutProperties(_ref, _excluded);
   var _useForwardedRef = (0, _utils.useForwardedRef)(ref),
-      _useForwardedRef2 = _slicedToArray(_useForwardedRef, 2),
-      containerRef = _useForwardedRef2[0],
-      mergedContainerRef = _useForwardedRef2[1];
-
+    _useForwardedRef2 = _slicedToArray(_useForwardedRef, 2),
+    containerRef = _useForwardedRef2[0],
+    mergedContainerRef = _useForwardedRef2[1];
   var _useState = (0, _react.useState)(0),
-      _useState2 = _slicedToArray(_useState, 2),
-      width = _useState2[0],
-      setWidth = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    width = _useState2[0],
+    setWidth = _useState2[1];
   var inputSearchContainerRef = (0, _react.useRef)(null);
-
   var _useState3 = (0, _react.useState)(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      opened = _useState4[0],
-      setOpened = _useState4[1];
-
+    _useState4 = _slicedToArray(_useState3, 2),
+    opened = _useState4[0],
+    setOpened = _useState4[1];
   var _useForwardedState = (0, _utils.useForwardedState)({
-    value: value,
-    defaultValue: defaultValue,
-    onChange: onChange
-  }),
-      _useForwardedState2 = _slicedToArray(_useForwardedState, 2),
-      forwardedValue = _useForwardedState2[0],
-      setForwardedValue = _useForwardedState2[1];
+      value: value,
+      defaultValue: defaultValue,
+      onChange: onChange
+    }),
+    _useForwardedState2 = _slicedToArray(_useForwardedState, 2),
+    forwardedValue = _useForwardedState2[0],
+    setForwardedValue = _useForwardedState2[1];
+
   /**
    * Detect the width of the container when the select was opened and update
    * it when either the container size or the window size has been changed.
    */
-
-
   var resizeHandler = (0, _react.useCallback)(function () {
     window.requestAnimationFrame(function () {
       if (!opened || !containerRef.current) return;
@@ -194,8 +151,9 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     return resizeHandler();
   }, [resizeHandler]);
   (0, _utils.useResizeObserver)(containerRef, resizeHandler);
-  (0, _utils.useEvent)(typeof window !== 'undefined' ? window : undefined, 'resize', resizeHandler); // Replace the aria-haspopup attribute from menu to listbox
+  (0, _utils.useEvent)(typeof window !== 'undefined' ? window : undefined, 'resize', resizeHandler);
 
+  // Replace the aria-haspopup attribute from menu to listbox
   (0, _utils.useBrowserLayoutEffect)(function () {
     if (!containerRef.current) return;
     containerRef.current.setAttribute('aria-haspopup', 'listbox');
@@ -226,7 +184,6 @@ var Select = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     },
     onKeyDown: function onKeyDown(e) {
       if (disabled) return;
-
       if (['Enter', ' '].includes(e.key)) {
         setOpened(!opened);
         e.preventDefault();

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["paddingStyles","p","paddingVertical","theme","baseHeight","selectToggleListItemHeight","css","openedStyles","opened","unbordered","clr","inputFocusColorBorder","inputFocusColorShadow","unborderedStyles","transitionStyles","unborderedHoverStyles","disabled","buttonGhostColorBgHover","SelectContainer","styled","InputContainer","omitEmotionProps","SelectMenu","Menu","m","min","xs","width","NotFound","div","menuItemHeight","inputPaddingHorizontal","selectNotFoundColorText","InputSearchContainer","menuPaddingVertical","Select","forwardRef","ref","options","left","leftHasPadding","right","rightHasPadding","placeholder","searchVisible","searchProps","notFoundText","loading","clearVisible","threshold","visibleCount","overscanCount","maxSelectedItems","locale","defaultLocale","value","defaultValue","onChange","onLoadNext","size","placement","rest","useForwardedRef","containerRef","mergedContainerRef","useState","setWidth","inputSearchContainerRef","useRef","setOpened","useForwardedState","forwardedValue","setForwardedValue","resizeHandler","useCallback","window","requestAnimationFrame","current","nextWidth","getBoundingClientRect","useBrowserLayoutEffect","useResizeObserver","useEvent","undefined","setAttribute","selectedItems","useMemo","map","v","option","find","item","title","listBoxId","Math","random","toString","slice","e","includes","key","preventDefault","filter","focus","length","displayName"],"sources":["../../../src/Select/index.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { transitionStyles, WithSize } from '@os-design/styles';\nimport {\n  omitEmotionProps,\n  useEvent,\n  useForwardedRef,\n  useForwardedState,\n  useResizeObserver,\n  useBrowserLayoutEffect,\n} from '@os-design/utils';\nimport styled from '@emotion/styled';\nimport { m } from '@os-design/media';\nimport { css } from '@emotion/react';\nimport { clr } from '@os-design/theming';\nimport { InputContainer } from '../Input';\nimport Menu from '../Menu';\nimport InputSearch, { InputSearchProps } from '../InputSearch';\nimport SelectToggle from './SelectToggle';\nimport SelectList, { OptionProps } from './SelectList';\nimport { PopoverProps } from '../Popover';\nimport defaultLocale, { SelectLocale } from './utils/defaultLocale';\n\ntype JsxDivProps = Omit<\n  JSX.IntrinsicElements['div'],\n  'value' | 'defaultValue' | 'onChange' | 'ref'\n>;\nexport interface SelectProps\n  extends JsxDivProps,\n    WithSize,\n    Pick<PopoverProps, 'placement'> {\n  /**\n   * Options of the select.\n   * @default undefined\n   */\n  options?: OptionProps[];\n  /**\n   * The component located on the left side.\n   * @default undefined\n   */\n  left?: React.ReactNode;\n  /**\n   * Adds padding to the left component.\n   * It can be useful when passing an icon or text in the left component.\n   * @default false\n   */\n  leftHasPadding?: boolean;\n  /**\n   * The component located on the right side.\n   * @default undefined\n   */\n  right?: React.ReactNode;\n  /**\n   * Adds padding to the right component.\n   * It can be useful when passing an icon or text in the right component.\n   * @default false\n   */\n  rightHasPadding?: boolean;\n  /**\n   * The placeholder of the select.\n   * @default undefined\n   */\n  placeholder?: string;\n  /**\n   * Whether the search input visible.\n   * @default false\n   */\n  searchVisible?: boolean;\n  /**\n   * Props of the search input.\n   * @default undefined\n   */\n  searchProps?: InputSearchProps;\n  /**\n   * Text displayed when there are no list items.\n   * @default Not found\n   */\n  notFoundText?: string;\n  /**\n   * Whether the border is hidden.\n   * @default false\n   */\n  unbordered?: boolean;\n  /**\n   * Shows the loading status.\n   * @default false\n   */\n  loading?: boolean;\n  /**\n   * Whether the select is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Whether the select has the clear button.\n   * @default false\n   */\n  clearVisible?: boolean;\n  /**\n   * A threshold N means that the onLoadNext function calls when a user scrolls all items except N.\n   * @default 10\n   */\n  threshold?: number;\n  /**\n   * Defines how many items inside of the visible \"window\" to render.\n   * @default 6\n   */\n  visibleCount?: number;\n  /**\n   * Defines how many items outside of the visible \"window\" to render at all times.\n   * @default 10\n   */\n  overscanCount?: number;\n  /**\n   * The max number of options that the user can select.\n   * @default 1\n   */\n  maxSelectedItems?: number | 'all';\n  /**\n   * The locale.\n   * @default undefined\n   */\n  locale?: SelectLocale;\n  /**\n   * Selected options.\n   * @default undefined\n   */\n  value?: string[];\n  /**\n   * The default value.\n   * @default undefined\n   */\n  defaultValue?: string[];\n  /**\n   * The change event handler.\n   * @default undefined\n   */\n  onChange?: (value: string[]) => void;\n  /**\n   * The callback to load more items.\n   * @default undefined\n   */\n  onLoadNext?: () => void;\n}\n\nconst paddingStyles = (p) => {\n  const paddingVertical =\n    (p.theme.baseHeight - p.theme.selectToggleListItemHeight) / 2;\n\n  return css`\n    padding: calc(${paddingVertical}em - 1px) 0;\n  `;\n};\n\nconst openedStyles = (p) =>\n  p.opened &&\n  !p.unbordered &&\n  css`\n    border-color: ${clr(p.theme.inputFocusColorBorder)};\n    box-shadow: 0 0 0 0.15em ${clr(p.theme.inputFocusColorShadow)};\n  `;\n\nconst unborderedStyles = (p) =>\n  p.unbordered &&\n  css`\n    border: 0;\n    box-shadow: none !important;\n    ${transitionStyles('background-color')(p)};\n  `;\n\nconst unborderedHoverStyles = (p) =>\n  p.unbordered &&\n  !p.disabled &&\n  css`\n    @media (hover: hover) {\n      &:hover,\n      &:focus {\n        background-color: ${clr(p.theme.buttonGhostColorBgHover)};\n      }\n    }\n  `;\n\ninterface SelectContainerProps {\n  opened: boolean;\n  unbordered?: boolean;\n  disabled?: boolean;\n}\nexport const SelectContainer = styled(\n  InputContainer,\n  omitEmotionProps('opened', 'unbordered', 'disabled')\n)<SelectContainerProps>`\n  cursor: ${(p) => (!p.disabled ? 'pointer' : 'not-allowed')};\n  user-select: none;\n  position: relative;\n  display: flex;\n  align-items: center;\n\n  height: unset;\n  min-height: ${(p) => p.theme.baseHeight}em;\n\n  ${paddingStyles};\n  ${openedStyles};\n  ${unborderedStyles};\n  ${unborderedHoverStyles};\n`;\n\ninterface SelectMenuProps {\n  width: number;\n}\nconst SelectMenu = styled(Menu, omitEmotionProps('width'))<SelectMenuProps>`\n  padding-top: 0;\n  padding-bottom: 0;\n  max-height: unset;\n\n  ${m.min.xs} {\n    width: ${(p) => p.width}px;\n  }\n`;\n\nconst NotFound = styled.div`\n  height: ${(p) => p.theme.menuItemHeight}em;\n  display: flex;\n  align-items: center;\n\n  padding: 0 ${(p) => p.theme.inputPaddingHorizontal}em;\n  color: ${(p) => clr(p.theme.selectNotFoundColorText)};\n`;\n\nconst InputSearchContainer = styled.div`\n  padding: ${(p) => p.theme.menuPaddingVertical}em\n    ${(p) => p.theme.inputPaddingHorizontal}em 0;\n`;\n\n/**\n * The component that allows to pick a value from predefined options.\n */\nconst Select = forwardRef<HTMLDivElement, SelectProps>(\n  (\n    {\n      options = [],\n      left,\n      leftHasPadding = false,\n      right,\n      rightHasPadding = false,\n      placeholder,\n      searchVisible = false,\n      searchProps = {},\n      notFoundText = 'Not found',\n      unbordered = false,\n      loading = false,\n      disabled = false,\n      clearVisible = false,\n      threshold = 10,\n      visibleCount = 6,\n      overscanCount = 10,\n      maxSelectedItems = 1,\n      locale = defaultLocale,\n      value,\n      defaultValue,\n      onChange,\n      onLoadNext = () => {},\n      size,\n      placement,\n      ...rest\n    },\n    ref\n  ) => {\n    const [containerRef, mergedContainerRef] = useForwardedRef(ref);\n    const [width, setWidth] = useState(0);\n    const inputSearchContainerRef = useRef<HTMLDivElement>(null);\n    const [opened, setOpened] = useState(false);\n    const [forwardedValue, setForwardedValue] = useForwardedState({\n      value,\n      defaultValue,\n      onChange,\n    });\n\n    /**\n     * Detect the width of the container when the select was opened and update\n     * it when either the container size or the window size has been changed.\n     */\n    const resizeHandler = useCallback(() => {\n      window.requestAnimationFrame(() => {\n        if (!opened || !containerRef.current) return;\n        const nextWidth = containerRef.current.getBoundingClientRect().width;\n        if (width === nextWidth) return;\n        setWidth(nextWidth);\n      });\n    }, [opened, containerRef, width]);\n    useBrowserLayoutEffect(() => resizeHandler(), [resizeHandler]);\n    useResizeObserver(containerRef, resizeHandler);\n    useEvent(\n      (typeof window !== 'undefined' ? window : undefined) as EventTarget,\n      'resize',\n      resizeHandler\n    );\n\n    // Replace the aria-haspopup attribute from menu to listbox\n    useBrowserLayoutEffect(() => {\n      if (!containerRef.current) return;\n      containerRef.current.setAttribute('aria-haspopup', 'listbox');\n    }, []);\n\n    const selectedItems = useMemo(\n      () =>\n        (forwardedValue || []).map((v) => {\n          const option = (options || []).find((item) => item.value === v);\n          return { title: option ? option.title || '' : '', value: v };\n        }),\n      [forwardedValue, options]\n    );\n\n    const listBoxId = useMemo(\n      () => `listbox-${Math.random().toString(36).slice(2, 11)}`,\n      []\n    );\n\n    return (\n      <>\n        <SelectContainer\n          opened={opened}\n          unbordered={unbordered}\n          disabled={disabled}\n          size={size}\n          tabIndex={!disabled ? 0 : -1}\n          onClick={() => {\n            if (disabled) return;\n            setOpened(!opened);\n          }}\n          onKeyDown={(e) => {\n            if (disabled) return;\n            if (['Enter', ' '].includes(e.key)) {\n              setOpened(!opened);\n              e.preventDefault();\n            }\n          }}\n          onMouseDown={(e) => e.preventDefault()}\n          role='combobox'\n          aria-disabled={disabled}\n          aria-busy={loading}\n          aria-haspopup='listbox'\n          aria-owns={listBoxId}\n          {...rest}\n          ref={mergedContainerRef}\n        >\n          <SelectToggle\n            selectedItems={selectedItems}\n            onDelete={(v) =>\n              setForwardedValue(\n                (forwardedValue || []).filter((item) => item !== v)\n              )\n            }\n            onClear={() => {\n              setForwardedValue([]);\n              if (!containerRef.current) return;\n              containerRef.current.focus();\n            }}\n            opened={opened}\n            multiple={maxSelectedItems !== 1}\n            placeholder={placeholder}\n            left={left}\n            leftHasPadding={leftHasPadding}\n            right={right}\n            rightHasPadding={rightHasPadding}\n            unbordered={unbordered}\n            disabled={disabled}\n            clearVisible={clearVisible}\n            loading={loading}\n            locale={locale}\n          />\n        </SelectContainer>\n\n        <SelectMenu\n          trigger={containerRef}\n          visible={opened}\n          onClose={() => setOpened(false)}\n          size={size}\n          width={width}\n          closeOnSelect={maxSelectedItems === 1}\n          modalTitle={placeholder}\n          placement={placement}\n        >\n          {searchVisible && (\n            <InputSearchContainer ref={inputSearchContainerRef}>\n              <InputSearch {...searchProps} />\n            </InputSearchContainer>\n          )}\n\n          {options.length > 0 ? (\n            <SelectList\n              searchVisible={searchVisible}\n              options={options}\n              visibleCount={visibleCount}\n              overscanCount={overscanCount}\n              threshold={threshold}\n              onLoadNext={onLoadNext}\n              maxSelectedItems={maxSelectedItems}\n              containerRef={containerRef}\n              value={forwardedValue}\n              onChange={setForwardedValue}\n              id={listBoxId}\n              size={size}\n            />\n          ) : (\n            <NotFound>{notFoundText}</NotFound>\n          )}\n        </SelectMenu>\n      </>\n    );\n  }\n);\n\nSelect.displayName = 'Select';\n\nexport default Select;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["paddingStyles","p","paddingVertical","theme","baseHeight","selectToggleListItemHeight","css","openedStyles","opened","unbordered","clr","inputFocusColorBorder","inputFocusColorShadow","unborderedStyles","transitionStyles","unborderedHoverStyles","disabled","buttonGhostColorBgHover","SelectContainer","styled","InputContainer","omitEmotionProps","SelectMenu","Menu","m","min","xs","width","NotFound","div","menuItemHeight","inputPaddingHorizontal","selectNotFoundColorText","InputSearchContainer","menuPaddingVertical","Select","forwardRef","ref","options","left","leftHasPadding","right","rightHasPadding","placeholder","searchVisible","searchProps","notFoundText","loading","clearVisible","threshold","visibleCount","overscanCount","maxSelectedItems","locale","defaultLocale","value","defaultValue","onChange","onLoadNext","size","placement","rest","useForwardedRef","containerRef","mergedContainerRef","useState","setWidth","inputSearchContainerRef","useRef","setOpened","useForwardedState","forwardedValue","setForwardedValue","resizeHandler","useCallback","window","requestAnimationFrame","current","nextWidth","getBoundingClientRect","useBrowserLayoutEffect","useResizeObserver","useEvent","undefined","setAttribute","selectedItems","useMemo","map","v","option","find","item","title","listBoxId","Math","random","toString","slice","e","includes","key","preventDefault","filter","focus","length","displayName"],"sources":["../../../src/Select/index.tsx"],"sourcesContent":["import React, {\n  forwardRef,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { transitionStyles, WithSize } from '@os-design/styles';\nimport {\n  omitEmotionProps,\n  useEvent,\n  useForwardedRef,\n  useForwardedState,\n  useResizeObserver,\n  useBrowserLayoutEffect,\n} from '@os-design/utils';\nimport styled from '@emotion/styled';\nimport { m } from '@os-design/media';\nimport { css } from '@emotion/react';\nimport { clr } from '@os-design/theming';\nimport { InputContainer } from '../Input';\nimport Menu from '../Menu';\nimport InputSearch, { InputSearchProps } from '../InputSearch';\nimport SelectToggle from './SelectToggle';\nimport SelectList, { OptionProps } from './SelectList';\nimport { PopoverProps } from '../Popover';\nimport defaultLocale, { SelectLocale } from './utils/defaultLocale';\n\ntype JsxDivProps = Omit<\n  JSX.IntrinsicElements['div'],\n  'value' | 'defaultValue' | 'onChange' | 'ref'\n>;\nexport interface SelectProps\n  extends JsxDivProps,\n    WithSize,\n    Pick<PopoverProps, 'placement'> {\n  /**\n   * Options of the select.\n   * @default undefined\n   */\n  options?: OptionProps[];\n  /**\n   * The component located on the left side.\n   * @default undefined\n   */\n  left?: React.ReactNode;\n  /**\n   * Adds padding to the left component.\n   * It can be useful when passing an icon or text in the left component.\n   * @default false\n   */\n  leftHasPadding?: boolean;\n  /**\n   * The component located on the right side.\n   * @default undefined\n   */\n  right?: React.ReactNode;\n  /**\n   * Adds padding to the right component.\n   * It can be useful when passing an icon or text in the right component.\n   * @default false\n   */\n  rightHasPadding?: boolean;\n  /**\n   * The placeholder of the select.\n   * @default undefined\n   */\n  placeholder?: string;\n  /**\n   * Whether the search input visible.\n   * @default false\n   */\n  searchVisible?: boolean;\n  /**\n   * Props of the search input.\n   * @default undefined\n   */\n  searchProps?: InputSearchProps;\n  /**\n   * Text displayed when there are no list items.\n   * @default Not found\n   */\n  notFoundText?: string;\n  /**\n   * Whether the border is hidden.\n   * @default false\n   */\n  unbordered?: boolean;\n  /**\n   * Shows the loading status.\n   * @default false\n   */\n  loading?: boolean;\n  /**\n   * Whether the select is disabled.\n   * @default false\n   */\n  disabled?: boolean;\n  /**\n   * Whether the select has the clear button.\n   * @default false\n   */\n  clearVisible?: boolean;\n  /**\n   * A threshold N means that the onLoadNext function calls when a user scrolls all items except N.\n   * @default 10\n   */\n  threshold?: number;\n  /**\n   * Defines how many items inside of the visible \"window\" to render.\n   * @default 6\n   */\n  visibleCount?: number;\n  /**\n   * Defines how many items outside of the visible \"window\" to render at all times.\n   * @default 10\n   */\n  overscanCount?: number;\n  /**\n   * The max number of options that the user can select.\n   * @default 1\n   */\n  maxSelectedItems?: number | 'all';\n  /**\n   * The locale.\n   * @default undefined\n   */\n  locale?: SelectLocale;\n  /**\n   * Selected options.\n   * @default undefined\n   */\n  value?: string[];\n  /**\n   * The default value.\n   * @default undefined\n   */\n  defaultValue?: string[];\n  /**\n   * The change event handler.\n   * @default undefined\n   */\n  onChange?: (value: string[]) => void;\n  /**\n   * The callback to load more items.\n   * @default undefined\n   */\n  onLoadNext?: () => void;\n}\n\nconst paddingStyles = (p) => {\n  const paddingVertical =\n    (p.theme.baseHeight - p.theme.selectToggleListItemHeight) / 2;\n\n  return css`\n    padding: calc(${paddingVertical}em - 1px) 0;\n  `;\n};\n\nconst openedStyles = (p) =>\n  p.opened &&\n  !p.unbordered &&\n  css`\n    border-color: ${clr(p.theme.inputFocusColorBorder)};\n    box-shadow: 0 0 0 0.15em ${clr(p.theme.inputFocusColorShadow)};\n  `;\n\nconst unborderedStyles = (p) =>\n  p.unbordered &&\n  css`\n    border: 0;\n    box-shadow: none !important;\n    ${transitionStyles('background-color')(p)};\n  `;\n\nconst unborderedHoverStyles = (p) =>\n  p.unbordered &&\n  !p.disabled &&\n  css`\n    @media (hover: hover) {\n      &:hover,\n      &:focus {\n        background-color: ${clr(p.theme.buttonGhostColorBgHover)};\n      }\n    }\n  `;\n\ninterface SelectContainerProps {\n  opened: boolean;\n  unbordered?: boolean;\n  disabled?: boolean;\n}\nexport const SelectContainer = styled(\n  InputContainer,\n  omitEmotionProps('opened', 'unbordered', 'disabled')\n)<SelectContainerProps>`\n  cursor: ${(p) => (!p.disabled ? 'pointer' : 'not-allowed')};\n  user-select: none;\n  position: relative;\n  display: flex;\n  align-items: center;\n\n  height: unset;\n  min-height: ${(p) => p.theme.baseHeight}em;\n\n  ${paddingStyles};\n  ${openedStyles};\n  ${unborderedStyles};\n  ${unborderedHoverStyles};\n`;\n\ninterface SelectMenuProps {\n  width: number;\n}\nconst SelectMenu = styled(Menu, omitEmotionProps('width'))<SelectMenuProps>`\n  padding-top: 0;\n  padding-bottom: 0;\n  max-height: unset;\n\n  ${m.min.xs} {\n    width: ${(p) => p.width}px;\n  }\n`;\n\nconst NotFound = styled.div`\n  height: ${(p) => p.theme.menuItemHeight}em;\n  display: flex;\n  align-items: center;\n\n  padding: 0 ${(p) => p.theme.inputPaddingHorizontal}em;\n  color: ${(p) => clr(p.theme.selectNotFoundColorText)};\n`;\n\nconst InputSearchContainer = styled.div`\n  padding: ${(p) => p.theme.menuPaddingVertical}em\n    ${(p) => p.theme.inputPaddingHorizontal}em 0;\n`;\n\n/**\n * The component that allows to pick a value from predefined options.\n */\nconst Select = forwardRef<HTMLDivElement, SelectProps>(\n  (\n    {\n      options = [],\n      left,\n      leftHasPadding = false,\n      right,\n      rightHasPadding = false,\n      placeholder,\n      searchVisible = false,\n      searchProps = {},\n      notFoundText = 'Not found',\n      unbordered = false,\n      loading = false,\n      disabled = false,\n      clearVisible = false,\n      threshold = 10,\n      visibleCount = 6,\n      overscanCount = 10,\n      maxSelectedItems = 1,\n      locale = defaultLocale,\n      value,\n      defaultValue,\n      onChange,\n      onLoadNext = () => {},\n      size,\n      placement,\n      ...rest\n    },\n    ref\n  ) => {\n    const [containerRef, mergedContainerRef] = useForwardedRef(ref);\n    const [width, setWidth] = useState(0);\n    const inputSearchContainerRef = useRef<HTMLDivElement>(null);\n    const [opened, setOpened] = useState(false);\n    const [forwardedValue, setForwardedValue] = useForwardedState({\n      value,\n      defaultValue,\n      onChange,\n    });\n\n    /**\n     * Detect the width of the container when the select was opened and update\n     * it when either the container size or the window size has been changed.\n     */\n    const resizeHandler = useCallback(() => {\n      window.requestAnimationFrame(() => {\n        if (!opened || !containerRef.current) return;\n        const nextWidth = containerRef.current.getBoundingClientRect().width;\n        if (width === nextWidth) return;\n        setWidth(nextWidth);\n      });\n    }, [opened, containerRef, width]);\n    useBrowserLayoutEffect(() => resizeHandler(), [resizeHandler]);\n    useResizeObserver(containerRef, resizeHandler);\n    useEvent(\n      (typeof window !== 'undefined' ? window : undefined) as EventTarget,\n      'resize',\n      resizeHandler\n    );\n\n    // Replace the aria-haspopup attribute from menu to listbox\n    useBrowserLayoutEffect(() => {\n      if (!containerRef.current) return;\n      containerRef.current.setAttribute('aria-haspopup', 'listbox');\n    }, []);\n\n    const selectedItems = useMemo(\n      () =>\n        (forwardedValue || []).map((v) => {\n          const option = (options || []).find((item) => item.value === v);\n          return { title: option ? option.title || '' : '', value: v };\n        }),\n      [forwardedValue, options]\n    );\n\n    const listBoxId = useMemo(\n      () => `listbox-${Math.random().toString(36).slice(2, 11)}`,\n      []\n    );\n\n    return (\n      <>\n        <SelectContainer\n          opened={opened}\n          unbordered={unbordered}\n          disabled={disabled}\n          size={size}\n          tabIndex={!disabled ? 0 : -1}\n          onClick={() => {\n            if (disabled) return;\n            setOpened(!opened);\n          }}\n          onKeyDown={(e) => {\n            if (disabled) return;\n            if (['Enter', ' '].includes(e.key)) {\n              setOpened(!opened);\n              e.preventDefault();\n            }\n          }}\n          onMouseDown={(e) => e.preventDefault()}\n          role='combobox'\n          aria-disabled={disabled}\n          aria-busy={loading}\n          aria-haspopup='listbox'\n          aria-owns={listBoxId}\n          {...rest}\n          ref={mergedContainerRef}\n        >\n          <SelectToggle\n            selectedItems={selectedItems}\n            onDelete={(v) =>\n              setForwardedValue(\n                (forwardedValue || []).filter((item) => item !== v)\n              )\n            }\n            onClear={() => {\n              setForwardedValue([]);\n              if (!containerRef.current) return;\n              containerRef.current.focus();\n            }}\n            opened={opened}\n            multiple={maxSelectedItems !== 1}\n            placeholder={placeholder}\n            left={left}\n            leftHasPadding={leftHasPadding}\n            right={right}\n            rightHasPadding={rightHasPadding}\n            unbordered={unbordered}\n            disabled={disabled}\n            clearVisible={clearVisible}\n            loading={loading}\n            locale={locale}\n          />\n        </SelectContainer>\n\n        <SelectMenu\n          trigger={containerRef}\n          visible={opened}\n          onClose={() => setOpened(false)}\n          size={size}\n          width={width}\n          closeOnSelect={maxSelectedItems === 1}\n          modalTitle={placeholder}\n          placement={placement}\n        >\n          {searchVisible && (\n            <InputSearchContainer ref={inputSearchContainerRef}>\n              <InputSearch {...searchProps} />\n            </InputSearchContainer>\n          )}\n\n          {options.length > 0 ? (\n            <SelectList\n              searchVisible={searchVisible}\n              options={options}\n              visibleCount={visibleCount}\n              overscanCount={overscanCount}\n              threshold={threshold}\n              onLoadNext={onLoadNext}\n              maxSelectedItems={maxSelectedItems}\n              containerRef={containerRef}\n              value={forwardedValue}\n              onChange={setForwardedValue}\n              id={listBoxId}\n              size={size}\n            />\n          ) : (\n            <NotFound>{notFoundText}</NotFound>\n          )}\n        </SelectMenu>\n      </>\n    );\n  }\n);\n\nSelect.displayName = 'Select';\n\nexport default Select;\n"],"mappings":"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"}

package/dist/cjs/Select/utils/defaultLocale.js.map

@@ -1 +1 @@
-{"version":3,"file":"defaultLocale.js","names":["defaultLocale","deleteLabel","clearLabel"],"sources":["../../../../src/Select/utils/defaultLocale.ts"],"sourcesContent":["export interface SelectLocale {\n  deleteLabel: string;\n  clearLabel: string;\n}\n\nconst defaultLocale: SelectLocale = {\n  deleteLabel: 'Delete',\n  clearLabel: 'Clear',\n};\n\nexport default defaultLocale;\n"],"mappings":";;;;;;AAKA,IAAMA,aAA2B,GAAG;EAClCC,WAAW,EAAE,QADqB;EAElCC,UAAU,EAAE;AAFsB,CAApC;eAKeF,a"}
+{"version":3,"file":"defaultLocale.js","names":["defaultLocale","deleteLabel","clearLabel"],"sources":["../../../../src/Select/utils/defaultLocale.ts"],"sourcesContent":["export interface SelectLocale {\n  deleteLabel: string;\n  clearLabel: string;\n}\n\nconst defaultLocale: SelectLocale = {\n  deleteLabel: 'Delete',\n  clearLabel: 'Clear',\n};\n\nexport default defaultLocale;\n"],"mappings":";;;;;;AAKA,IAAMA,aAA2B,GAAG;EAClCC,WAAW,EAAE,QAAQ;EACrBC,UAAU,EAAE;AACd,CAAC;AAAC,eAEaF,aAAa;AAAA"}

package/dist/cjs/Skeleton/index.js

@@ -1,40 +1,24 @@
 "use strict";
 
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-
 var _react = require("@emotion/react");
-
 var _react2 = _interopRequireWildcard(require("react"));
-
 var _utils = require("@os-design/utils");
-
 var _theming = require("@os-design/theming");
-
 var _excluded = ["width"];
-
 var _templateObject, _templateObject2;
-
 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 SkeletonAnimation = (0, _react.keyframes)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  from { background-position: 100% 50%; }\n  to { background-position: 0 50%; }\n"])));
 var StyledSkeleton = (0, _styled["default"])('div', (0, _utils.omitEmotionProps)('width', 'size'))(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  width: ", ";\n  height: 1em;\n\n  background: linear-gradient(\n    90deg,\n    ", " 25%,\n    ", " 37%,\n    ", " 63%\n  );\n  background-size: 400% 100%;\n\n  border-radius: ", "em;\n  animation: ", " 1.4s ease infinite;\n"])), function (p) {
   return p.width;
@@ -47,15 +31,14 @@ var StyledSkeleton = (0, _styled["default"])('div', (0, _utils.omitEmotionProps)
 }, function (p) {
   return p.theme.borderRadius;
 }, SkeletonAnimation);
+
 /**
  * Provides a basic placeholder while a user waits for the content to load.
  */
-
 var Skeleton = /*#__PURE__*/(0, _react2.forwardRef)(function (_ref, ref) {
   var _ref$width = _ref.width,
-      width = _ref$width === void 0 ? '100%' : _ref$width,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    width = _ref$width === void 0 ? '100%' : _ref$width,
+    rest = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react2["default"].createElement(StyledSkeleton, _extends({
     width: width,
     "aria-busy": true

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["SkeletonAnimation","keyframes","StyledSkeleton","styled","omitEmotionProps","p","width","clr","theme","skeletonColorBgFrom","skeletonColorBgTo","borderRadius","Skeleton","forwardRef","ref","rest","displayName"],"sources":["../../../src/Skeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { keyframes } from '@emotion/react';\nimport React, { forwardRef } from 'react';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr } from '@os-design/theming';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface SkeletonProps extends JsxDivProps {\n  /**\n   * The width of the skeleton.\n   * @default 100%\n   */\n  width?: string;\n}\n\nconst SkeletonAnimation = keyframes`\n  from { background-position: 100% 50%; }\n  to { background-position: 0 50%; }\n`;\n\ntype StyledSkeletonProps = Required<Pick<SkeletonProps, 'width'>>;\nconst StyledSkeleton = styled(\n  'div',\n  omitEmotionProps('width', 'size')\n)<StyledSkeletonProps>`\n  width: ${(p) => p.width};\n  height: 1em;\n\n  background: linear-gradient(\n    90deg,\n    ${(p) => clr(p.theme.skeletonColorBgFrom)} 25%,\n    ${(p) => clr(p.theme.skeletonColorBgTo)} 37%,\n    ${(p) => clr(p.theme.skeletonColorBgFrom)} 63%\n  );\n  background-size: 400% 100%;\n\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  animation: ${SkeletonAnimation} 1.4s ease infinite;\n`;\n\n/**\n * Provides a basic placeholder while a user waits for the content to load.\n */\nconst Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(\n  ({ width = '100%', ...rest }, ref) => (\n    <StyledSkeleton width={width} aria-busy {...rest} ref={ref} />\n  )\n);\n\nSkeleton.displayName = 'Skeleton';\n\nexport default Skeleton;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;AAWA,IAAMA,iBAAiB,OAAGC,gBAAH,yJAAvB;AAMA,IAAMC,cAAc,GAAG,IAAAC,kBAAA,EACrB,KADqB,EAErB,IAAAC,uBAAA,EAAiB,OAAjB,EAA0B,MAA1B,CAFqB,CAAH,4SAIT,UAACC,CAAD;EAAA,OAAOA,CAAC,CAACC,KAAT;AAAA,CAJS,EASd,UAACD,CAAD;EAAA,OAAO,IAAAE,YAAA,EAAIF,CAAC,CAACG,KAAF,CAAQC,mBAAZ,CAAP;AAAA,CATc,EAUd,UAACJ,CAAD;EAAA,OAAO,IAAAE,YAAA,EAAIF,CAAC,CAACG,KAAF,CAAQE,iBAAZ,CAAP;AAAA,CAVc,EAWd,UAACL,CAAD;EAAA,OAAO,IAAAE,YAAA,EAAIF,CAAC,CAACG,KAAF,CAAQC,mBAAZ,CAAP;AAAA,CAXc,EAeD,UAACJ,CAAD;EAAA,OAAOA,CAAC,CAACG,KAAF,CAAQG,YAAf;AAAA,CAfC,EAgBLX,iBAhBK,CAApB;AAmBA;AACA;AACA;;AACA,IAAMY,QAAQ,gBAAG,IAAAC,kBAAA,EACf,gBAA8BC,GAA9B;EAAA,sBAAGR,KAAH;EAAA,IAAGA,KAAH,2BAAW,MAAX;EAAA,IAAsBS,IAAtB;;EAAA,oBACE,iCAAC,cAAD;IAAgB,KAAK,EAAET,KAAvB;IAA8B;EAA9B,GAA4CS,IAA5C;IAAkD,GAAG,EAAED;EAAvD,GADF;AAAA,CADe,CAAjB;AAMAF,QAAQ,CAACI,WAAT,GAAuB,UAAvB;eAEeJ,Q"}
+{"version":3,"file":"index.js","names":["SkeletonAnimation","keyframes","StyledSkeleton","styled","omitEmotionProps","p","width","clr","theme","skeletonColorBgFrom","skeletonColorBgTo","borderRadius","Skeleton","forwardRef","ref","rest","displayName"],"sources":["../../../src/Skeleton/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { keyframes } from '@emotion/react';\nimport React, { forwardRef } from 'react';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr } from '@os-design/theming';\n\ntype JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;\nexport interface SkeletonProps extends JsxDivProps {\n  /**\n   * The width of the skeleton.\n   * @default 100%\n   */\n  width?: string;\n}\n\nconst SkeletonAnimation = keyframes`\n  from { background-position: 100% 50%; }\n  to { background-position: 0 50%; }\n`;\n\ntype StyledSkeletonProps = Required<Pick<SkeletonProps, 'width'>>;\nconst StyledSkeleton = styled(\n  'div',\n  omitEmotionProps('width', 'size')\n)<StyledSkeletonProps>`\n  width: ${(p) => p.width};\n  height: 1em;\n\n  background: linear-gradient(\n    90deg,\n    ${(p) => clr(p.theme.skeletonColorBgFrom)} 25%,\n    ${(p) => clr(p.theme.skeletonColorBgTo)} 37%,\n    ${(p) => clr(p.theme.skeletonColorBgFrom)} 63%\n  );\n  background-size: 400% 100%;\n\n  border-radius: ${(p) => p.theme.borderRadius}em;\n  animation: ${SkeletonAnimation} 1.4s ease infinite;\n`;\n\n/**\n * Provides a basic placeholder while a user waits for the content to load.\n */\nconst Skeleton = forwardRef<HTMLDivElement, SkeletonProps>(\n  ({ width = '100%', ...rest }, ref) => (\n    <StyledSkeleton width={width} aria-busy {...rest} ref={ref} />\n  )\n);\n\nSkeleton.displayName = 'Skeleton';\n\nexport default Skeleton;\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AAAyC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWzC,IAAMA,iBAAiB,OAAGC,gBAAS,yJAGlC;AAGD,IAAMC,cAAc,GAAG,IAAAC,kBAAM,EAC3B,KAAK,EACL,IAAAC,uBAAgB,EAAC,OAAO,EAAE,MAAM,CAAC,CAClC,4SACU,UAACC,CAAC;EAAA,OAAKA,CAAC,CAACC,KAAK;AAAA,GAKnB,UAACD,CAAC;EAAA,OAAK,IAAAE,YAAG,EAACF,CAAC,CAACG,KAAK,CAACC,mBAAmB,CAAC;AAAA,GACvC,UAACJ,CAAC;EAAA,OAAK,IAAAE,YAAG,EAACF,CAAC,CAACG,KAAK,CAACE,iBAAiB,CAAC;AAAA,GACrC,UAACL,CAAC;EAAA,OAAK,IAAAE,YAAG,EAACF,CAAC,CAACG,KAAK,CAACC,mBAAmB,CAAC;AAAA,GAI1B,UAACJ,CAAC;EAAA,OAAKA,CAAC,CAACG,KAAK,CAACG,YAAY;AAAA,GAC/BX,iBAAiB,CAC/B;;AAED;AACA;AACA;AACA,IAAMY,QAAQ,gBAAG,IAAAC,kBAAU,EACzB,gBAA8BC,GAAG;EAAA,sBAA9BR,KAAK;IAALA,KAAK,2BAAG,MAAM;IAAKS,IAAI;EAAA,oBACxB,iCAAC,cAAc;IAAC,KAAK,EAAET,KAAM;IAAC;EAAS,GAAKS,IAAI;IAAE,GAAG,EAAED;EAAI,GAAG;AAAA,CAC/D,CACF;AAEDF,QAAQ,CAACI,WAAW,GAAG,UAAU;AAAC,eAEnBJ,QAAQ;AAAA"}

package/dist/cjs/Switch/index.js

@@ -1,88 +1,56 @@
 "use strict";
 
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-
 var _react2 = require("@emotion/react");
-
 var _styles = require("@os-design/styles");
-
 var _utils = require("@os-design/utils");
-
 var _theming = require("@os-design/theming");
-
 var _excluded = ["disabled", "value", "defaultValue", "onChange", "size", "onMouseDown"];
-
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
-
 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 _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
 function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-
 var FRACTION_DIGITS = 4;
-
 var uncheckedStyles = function uncheckedStyles(p) {
   return !p.checked && (0, _react2.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    background-color: ", ";\n    &::after {\n      left: ", "em;\n    }\n  "])), (0, _theming.clr)(p.theme.switchUncheckedColorBg), +((p.theme.switchHeight - p.theme.switchCircleSize) / 2).toFixed(FRACTION_DIGITS));
 };
-
 var checkedStyles = function checkedStyles(p) {
   return p.checked && (0, _react2.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    background-color: ", ";\n    &::after {\n      left: ", "em;\n    }\n  "])), (0, _theming.clr)(p.theme.switchCheckedColorBg), +(p.theme.switchWidth - p.theme.switchCircleSize - (p.theme.switchHeight - p.theme.switchCircleSize) / 2).toFixed(FRACTION_DIGITS));
 };
-
 var hoverUncheckedStyles = function hoverUncheckedStyles(p) {
   return !p.checked && (0, _react2.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    background-color: ", ";\n  "])), (0, _theming.clr)(p.theme.switchUncheckedColorBgHover));
 };
-
 var hoverCheckedStyles = function hoverCheckedStyles(p) {
   return p.checked && (0, _react2.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    background-color: ", ";\n  "])), (0, _theming.clr)(p.theme.switchCheckedColorBgHover));
 };
-
 var hoverStyles = function hoverStyles(p) {
   return !p.disabled && (0, _react2.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    @media (hover: hover) {\n      &:hover,\n      &:focus {\n        ", ";\n        ", ";\n      }\n    }\n  "])), hoverUncheckedStyles(p), hoverCheckedStyles(p));
 };
-
 var disabledUncheckedStyles = function disabledUncheckedStyles(p) {
   return !p.checked && (0, _react2.css)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    background-color: ", ";\n  "])), (0, _theming.clr)(p.theme.switchDisabledUncheckedColorBg));
 };
-
 var disabledCheckedStyles = function disabledCheckedStyles(p) {
   return p.checked && (0, _react2.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    background-color: ", ";\n  "])), (0, _theming.clr)(p.theme.switchDisabledCheckedColorBg));
 };
-
 var disabledStyles = function disabledStyles(p) {
   return p.disabled && (0, _react2.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    cursor: not-allowed;\n    ", ";\n    ", ";\n  "])), disabledUncheckedStyles(p), disabledCheckedStyles(p));
 };
-
 var StyledSwitch = (0, _styled["default"])('button', (0, _utils.omitEmotionProps)('size', 'checked'))(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  ", ";\n  position: relative;\n  cursor: pointer;\n  user-select: none;\n  display: block;\n\n  width: ", "em;\n  height: ", "em;\n  border-radius: ", "em;\n\n  &::after {\n    position: absolute;\n    top: ", "em;\n\n    width: ", "em;\n    height: ", "em;\n    border-radius: 50%;\n\n    background-color: ", ";\n    content: ' ';\n\n    ", ";\n  }\n\n  ", ";\n  ", ";\n  ", ";\n  ", ";\n\n  ", ";\n  ", ";\n"])), _styles.resetButtonStyles, function (p) {
   return p.theme.switchWidth;
 }, function (p) {
@@ -98,31 +66,29 @@ var StyledSwitch = (0, _styled["default"])('button', (0, _utils.omitEmotionProps
 }, function (p) {
   return (0, _theming.clr)(p.theme.switchColorCircleBg);
 }, (0, _styles.transitionStyles)('left'), uncheckedStyles, checkedStyles, hoverStyles, disabledStyles, _styles.sizeStyles, (0, _styles.transitionStyles)('background-color'));
+
 /**
  * The switch that can be enabled or disabled.
  */
-
 var Switch = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      value = _ref.value,
-      defaultValue = _ref.defaultValue,
-      _ref$onChange = _ref.onChange,
-      onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
-      size = _ref.size,
-      _ref$onMouseDown = _ref.onMouseDown,
-      _onMouseDown = _ref$onMouseDown === void 0 ? function () {} : _ref$onMouseDown,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    value = _ref.value,
+    defaultValue = _ref.defaultValue,
+    _ref$onChange = _ref.onChange,
+    onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
+    size = _ref.size,
+    _ref$onMouseDown = _ref.onMouseDown,
+    _onMouseDown = _ref$onMouseDown === void 0 ? function () {} : _ref$onMouseDown,
+    rest = _objectWithoutProperties(_ref, _excluded);
   var _useForwardedState = (0, _utils.useForwardedState)({
-    value: value,
-    defaultValue: defaultValue,
-    onChange: onChange
-  }),
-      _useForwardedState2 = _slicedToArray(_useForwardedState, 2),
-      forwardedValue = _useForwardedState2[0],
-      setForwardedValue = _useForwardedState2[1];
-
+      value: value,
+      defaultValue: defaultValue,
+      onChange: onChange
+    }),
+    _useForwardedState2 = _slicedToArray(_useForwardedState, 2),
+    forwardedValue = _useForwardedState2[0],
+    setForwardedValue = _useForwardedState2[1];
   return /*#__PURE__*/_react["default"].createElement(StyledSwitch, _extends({
     disabled: disabled,
     checked: forwardedValue,
@@ -133,7 +99,6 @@ var Switch = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     },
     onMouseDown: function onMouseDown(e) {
       _onMouseDown(e);
-
       e.preventDefault();
     },
     role: "switch",