@os-design/core 1.0.143 → 1.0.147

package/dist/cjs/Gallery/Status.js

@@ -0,0 +1,52 @@
+"use strict";
+
+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 _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) } })); }
+
+var Container = (0, _styled["default"])('div', (0, _utils.omitEmotionProps)('height'))(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: ", "px;\n"])), function (p) {
+  return p.height;
+});
+var Block = (0, _styled["default"])('div', (0, _utils.omitEmotionProps)('count', 'index', 'current'))(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: absolute;\n  left: ", "%;\n  width: ", ";\n  height: 100%;\n\n  background-color: ", ";\n  backdrop-filter: blur(0.2em);\n"])), function (p) {
+  return 100 / p.count * p.index;
+}, function (p) {
+  return p.index < p.count - 1 ? "calc(".concat(100 / p.count, "% - 2px)") : "".concat(100 / p.count, "%");
+}, function (p) {
+  return p.current ? (0, _theming.clr)(p.theme.galleryStatusColorBgCurrent) : (0, _theming.clr)(p.theme.galleryStatusColorBg);
+});
+
+var Status = function Status(_ref) {
+  var count = _ref.count,
+      current = _ref.current,
+      height = _ref.height;
+  return /*#__PURE__*/_react["default"].createElement(Container, {
+    height: height
+  }, Array(count).fill(0).map(function (_, index) {
+    return /*#__PURE__*/_react["default"].createElement(Block, {
+      key: index // eslint-disable-line react/no-array-index-key
+      ,
+      count: count,
+      index: index,
+      current: index === current
+    });
+  }));
+};
+
+var _default = Status;
+exports["default"] = _default;
+//# sourceMappingURL=Status.js.map

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

@@ -0,0 +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;;;;;;;;AAWA,IAAMA,SAAS,GAAG,IAAAC,kBAAA,EAAO,KAAP,EAAc,IAAAC,uBAAA,EAAiB,QAAjB,CAAd,CAAH,yJAKH,UAACC,CAAD;EAAA,OAAOA,CAAC,CAACC,MAAT;AAAA,CALG,CAAf;AAaA,IAAMC,KAAK,GAAG,IAAAJ,kBAAA,EACZ,KADY,EAEZ,IAAAC,uBAAA,EAAiB,OAAjB,EAA0B,OAA1B,EAAmC,SAAnC,CAFY,CAAH,gNAKD,UAACC,CAAD;EAAA,OAAQ,MAAMA,CAAC,CAACG,KAAT,GAAkBH,CAAC,CAACI,KAA3B;AAAA,CALC,EAMA,UAACJ,CAAD;EAAA,OACPA,CAAC,CAACI,KAAF,GAAUJ,CAAC,CAACG,KAAF,GAAU,CAApB,kBACY,MAAMH,CAAC,CAACG,KADpB,0BAEO,MAAMH,CAAC,CAACG,KAFf,MADO;AAAA,CANA,EAYW,UAACH,CAAD;EAAA,OAClBA,CAAC,CAACK,OAAF,GACI,IAAAC,YAAA,EAAIN,CAAC,CAACO,KAAF,CAAQC,2BAAZ,CADJ,GAEI,IAAAF,YAAA,EAAIN,CAAC,CAACO,KAAF,CAAQE,oBAAZ,CAHc;AAAA,CAZX,CAAX;;AAmBA,IAAMC,MAA6B,GAAG,SAAhCA,MAAgC;EAAA,IAAGP,KAAH,QAAGA,KAAH;EAAA,IAAUE,OAAV,QAAUA,OAAV;EAAA,IAAmBJ,MAAnB,QAAmBA,MAAnB;EAAA,oBACpC,gCAAC,SAAD;IAAW,MAAM,EAAEA;EAAnB,GACGU,KAAK,CAACR,KAAD,CAAL,CACES,IADF,CACO,CADP,EAEEC,GAFF,CAEM,UAACC,CAAD,EAAIV,KAAJ;IAAA,oBACH,gCAAC,KAAD;MACE,GAAG,EAAEA,KADP,CACc;MADd;MAEE,KAAK,EAAED,KAFT;MAGE,KAAK,EAAEC,KAHT;MAIE,OAAO,EAAEA,KAAK,KAAKC;IAJrB,EADG;EAAA,CAFN,CADH,CADoC;AAAA,CAAtC;;eAeeK,M"}

package/dist/cjs/Gallery/index.js

@@ -0,0 +1,154 @@
+"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 _theming = require("@os-design/theming");
+
+var _utils = require("@os-design/utils");
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Image = _interopRequireDefault(require("../Image"));
+
+var _Status = _interopRequireDefault(require("./Status"));
+
+var _excluded = ["urls", "aspectRatio", "help", "imageProps", "children"];
+
+var _templateObject, _templateObject2, _templateObject3;
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+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 Container = (0, _styled["default"])('div', (0, _utils.omitEmotionProps)('heightPercent'))(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n  padding-bottom: ", "%;\n\n  display: flex;\n  justify-content: center;\n\n  background-color: ", ";\n  border-radius: ", "em;\n  overflow: hidden;\n  touch-action: none;\n"])), function (p) {
+  return p.heightPercent;
+}, function (p) {
+  return (0, _theming.clr)(p.theme.galleryColorBg);
+}, function (p) {
+  return p.theme.borderRadius;
+});
+var StyledImage = (0, _styled["default"])(_Image["default"])(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: absolute;\n  width: auto;\n  height: 100%;\n  border-radius: 0;\n"])));
+
+var GalleryHelp = _styled["default"].div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  right: 0;\n\n  background-color: ", ";\n  color: ", ";\n  backdrop-filter: blur(0.2em);\n\n  font-size: ", "em;\n  font-weight: 500;\n\n  border-bottom-left-radius: ", "em;\n  padding: 0.1em 0.5em;\n"])), function (p) {
+  return (0, _theming.clr)(p.theme.galleryHelpColorBg);
+}, function (p) {
+  return (0, _theming.clr)(p.theme.galleryHelpColorText);
+}, function (p) {
+  return p.theme.sizes.small;
+}, function (p) {
+  return p.theme.borderRadius;
+});
+
+/**
+ * The image gallery. Change the cursor/touch position to change images.
+ * The lib 'lazysizes/plugins/attrchange/ls.attrchange' must be imported.
+ */
+var Gallery = function Gallery(_ref) {
+  var urls = _ref.urls,
+      _ref$aspectRatio = _ref.aspectRatio,
+      aspectRatio = _ref$aspectRatio === void 0 ? [16, 9] : _ref$aspectRatio,
+      help = _ref.help,
+      _ref$imageProps = _ref.imageProps,
+      imageProps = _ref$imageProps === void 0 ? {} : _ref$imageProps,
+      children = _ref.children,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var _useState = (0, _react.useState)(undefined),
+      _useState2 = _slicedToArray(_useState, 2),
+      imageUrl = _useState2[0],
+      setImageUrl = _useState2[1];
+
+  var _useState3 = (0, _react.useState)(urls.length > 0 ? 0 : null),
+      _useState4 = _slicedToArray(_useState3, 2),
+      imageIndex = _useState4[0],
+      setImageIndex = _useState4[1];
+
+  var heightPercent = (0, _react.useMemo)(function () {
+    return Math.round(aspectRatio[1] / aspectRatio[0] * 1000000) / 10000;
+  }, [aspectRatio]);
+  var imageIndexRef = (0, _react.useRef)(imageIndex);
+  (0, _react.useEffect)(function () {
+    imageIndexRef.current = imageIndex;
+  }, [imageIndex]); // Update the image if the index was changed
+
+  (0, _react.useEffect)(function () {
+    setImageUrl(imageIndex !== null ? urls[imageIndex] : undefined);
+  }, [imageIndex, urls]);
+  var containerRef = (0, _react.useRef)(null);
+  var size = (0, _utils.useSize)(containerRef);
+  var sizeRef = (0, _react.useRef)(size);
+  (0, _react.useEffect)(function () {
+    sizeRef.current = size;
+  }, [size]);
+  var statusHeight = (0, _react.useMemo)(function () {
+    return Math.round(size.height / 70);
+  }, [size.height]);
+  var updateGalleryImage = (0, _react.useCallback)(function (clientX) {
+    if (!containerRef.current) return;
+
+    var _containerRef$current = containerRef.current.getBoundingClientRect(),
+        x = _containerRef$current.x;
+
+    var widthPerImage = sizeRef.current.width / urls.length;
+    var xPos = clientX - x;
+    if (xPos < 0) return;
+    var nextIndex = Math.floor(xPos / widthPerImage);
+
+    if (imageIndexRef.current !== nextIndex) {
+      setImageIndex(nextIndex);
+    }
+  }, [urls.length]);
+  var mouseMoveHandler = (0, _react.useCallback)(function (e) {
+    return updateGalleryImage(e.clientX);
+  }, [updateGalleryImage]);
+  var touchMoveHandler = (0, _react.useCallback)(function (e) {
+    return updateGalleryImage(e.touches[0].clientX);
+  }, [updateGalleryImage]);
+  return /*#__PURE__*/_react["default"].createElement(_theming.ThemeOverrider, {
+    activeTheme: "dark"
+  }, /*#__PURE__*/_react["default"].createElement(Container, _extends({
+    ref: containerRef,
+    heightPercent: heightPercent,
+    onMouseMove: mouseMoveHandler,
+    onTouchMove: touchMoveHandler
+  }, rest), /*#__PURE__*/_react["default"].createElement(StyledImage, _extends({
+    url: imageUrl
+  }, imageProps)), urls.length > 1 && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, imageIndex !== null && /*#__PURE__*/_react["default"].createElement(_Status["default"], {
+    count: urls.length,
+    current: imageIndex,
+    height: statusHeight
+  }), help && /*#__PURE__*/_react["default"].createElement(GalleryHelp, null, help)), children));
+};
+
+var _default = Gallery;
+exports["default"] = _default;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Container","styled","omitEmotionProps","p","heightPercent","clr","theme","galleryColorBg","borderRadius","StyledImage","Image","GalleryHelp","div","galleryHelpColorBg","galleryHelpColorText","sizes","small","Gallery","urls","aspectRatio","help","imageProps","children","rest","useState","undefined","imageUrl","setImageUrl","length","imageIndex","setImageIndex","useMemo","Math","round","imageIndexRef","useRef","useEffect","current","containerRef","size","useSize","sizeRef","statusHeight","height","updateGalleryImage","useCallback","clientX","getBoundingClientRect","x","widthPerImage","width","xPos","nextIndex","floor","mouseMoveHandler","e","touchMoveHandler","touches"],"sources":["../../../src/Gallery/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { omitEmotionProps, useSize } from '@os-design/utils';\nimport React, {\n  MouseEventHandler,\n  TouchEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\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  touch-action: none;\n`;\n\nconst StyledImage = styled(Image)`\n  position: absolute;\n  width: auto;\n  height: 100%;\n  border-radius: 0;\n`;\n\nconst GalleryHelp = styled.div`\n  position: absolute;\n  top: 0;\n  right: 0;\n\n  background-color: ${(p) => clr(p.theme.galleryHelpColorBg)};\n  color: ${(p) => clr(p.theme.galleryHelpColorText)};\n  backdrop-filter: blur(0.2em);\n\n  font-size: ${(p) => p.theme.sizes.small}em;\n  font-weight: 500;\n\n  border-bottom-left-radius: ${(p) => p.theme.borderRadius}em;\n  padding: 0.1em 0.5em;\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 help message that is displayed in the upper right corner.\n   */\n  help?: string;\n  /**\n   * The props of the image component.\n   */\n  imageProps?: Omit<ImageProps, 'url'>;\n  /**\n   * The children that can be displayed on top of the image.\n   * E.g. tags.\n   */\n  children?: React.ReactNode;\n}\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: React.FC<GalleryProps> = ({\n  urls,\n  aspectRatio = [16, 9],\n  help,\n  imageProps = {},\n  children,\n  ...rest\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 containerRef = useRef<HTMLDivElement>(null);\n\n  const size = useSize(containerRef);\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 (!containerRef.current) return;\n      const { x } = containerRef.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    [urls.length]\n  );\n\n  const mouseMoveHandler = useCallback<MouseEventHandler<HTMLDivElement>>(\n    (e) => updateGalleryImage(e.clientX),\n    [updateGalleryImage]\n  );\n\n  const touchMoveHandler = useCallback<TouchEventHandler<HTMLDivElement>>(\n    (e) => updateGalleryImage(e.touches[0].clientX),\n    [updateGalleryImage]\n  );\n\n  return (\n    <ThemeOverrider activeTheme='dark'>\n      <Container\n        ref={containerRef}\n        heightPercent={heightPercent}\n        onMouseMove={mouseMoveHandler}\n        onTouchMove={touchMoveHandler}\n        {...rest}\n      >\n        <StyledImage url={imageUrl} {...imageProps} />\n        {urls.length > 1 && (\n          <>\n            {imageIndex !== null && (\n              <GalleryStatus\n                count={urls.length}\n                current={imageIndex}\n                height={statusHeight}\n              />\n            )}\n            {help && <GalleryHelp>{help}</GalleryHelp>}\n          </>\n        )}\n        {children}\n      </Container>\n    </ThemeOverrider>\n  );\n};\n\nexport default Gallery;\n"],"mappings":"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"}

package/dist/cjs/Select/SelectToggle.js

@@ -44,10 +44,10 @@ var notHasLeftStyles = function notHasLeftStyles(p) {
 };
 
 var notHasRightStyles = function notHasRightStyles(p) {
-  return !p.hasRight && (0, _react2.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    padding-right: ", "em;\n  "])), p.theme.inputPaddingHorizontal);
+  return !p.hasRight && !p.unbordered && (0, _react2.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    padding-right: ", "em;\n  "])), p.theme.inputPaddingHorizontal);
 };
 
-var Content = (0, _styled["default"])('div', (0, _utils.omitEmotionProps)('hasLeft', 'hasRight'))(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  flex: 1;\n  ", ";\n  ", ";\n  ", ";\n"])), notHasLeftStyles, notHasRightStyles, _styles.ellipsisStyles);
+var Content = (0, _styled["default"])('div', (0, _utils.omitEmotionProps)('hasLeft', 'hasRight', 'unbordered'))(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  flex: 1;\n  ", ";\n  ", ";\n  ", ";\n"])), notHasLeftStyles, notHasRightStyles, _styles.ellipsisStyles);
 exports.Content = Content;
 
 var Placeholder = _styled["default"].span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  color: ", ";\n  ", ";\n"])), function (p) {
@@ -210,7 +210,8 @@ var SelectToggle = function SelectToggle(_ref) {
     hasPadding: leftHasPadding
   }, left)), /*#__PURE__*/_react["default"].createElement(Content, {
     hasLeft: !!left,
-    hasRight: !!right && !unbordered
+    hasRight: !!right,
+    unbordered: unbordered
   }, renderContent()), rightValue && /*#__PURE__*/_react["default"].createElement(_theming.ThemeOverrider, {
     overrides: function overrides(t) {
       return {

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

@@ -1 +1 @@
-{"version":3,"file":"SelectToggle.js","names":["Container","styled","div","notHasLeftStyles","p","hasLeft","css","theme","inputPaddingHorizontal","notHasRightStyles","hasRight","Content","omitEmotionProps","ellipsisStyles","Placeholder","span","clr","inputColorPlaceholder","unborderedTitleStyles","unbordered","disabled","colorPrimary","disabledStyles","inputDisabledColorText","Title","colorText","ListItem","Tag","selectToggleListItemHeight","List","selectToggleListItemGap","DeleteButton","button","resetButtonStyles","selectToggleDeleteButtonColorIcon","selectToggleDeleteButtonColorIconHover","transitionStyles","unborderedIconContainerStyles","IconContainer","selectColorIcon","ClearIcon","CloseCircle","Addon","LeftAddon","inputAddonPaddingHorizontal","hasPadding","RightAddon","SelectToggle","selectedItems","onDelete","onClear","opened","multiple","left","leftHasPadding","right","rightHasPadding","placeholder","loading","clearVisible","locale","renderContent","useCallback","length","map","title","value","e","stopPropagation","deleteLabel","undefined","showClearButton","useMemo","rightValue","key","clearLabel","rightHasPaddingValue","t","buttonPaddingHorizontal","baseHeight","sizes","small","displayName"],"sources":["../../../src/Select/SelectToggle.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport styled from '@emotion/styled';\nimport { Up, Down, Loading, Close, CloseCircle } from '@os-design/icons';\nimport {\n  ellipsisStyles,\n  resetButtonStyles,\n  transitionStyles,\n} from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { css } from '@emotion/react';\nimport Tag from '../Tag';\nimport Button from '../Button';\nimport { SelectLocale } from './utils/defaultLocale';\n\ninterface SelectToggleProps {\n  selectedItems: Array<{ title: string; value: string }>;\n  onDelete: (value: string) => void;\n  onClear: () => void;\n  opened: boolean;\n  multiple: boolean;\n  left?: React.ReactNode;\n  leftHasPadding?: boolean;\n  right?: React.ReactNode;\n  rightHasPadding?: boolean;\n  placeholder?: string;\n  unbordered?: boolean;\n  loading?: boolean;\n  disabled?: boolean;\n  clearVisible?: boolean;\n  locale: SelectLocale;\n}\n\nexport const Container = styled.div`\n  flex: 1;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n`;\n\nconst notHasLeftStyles = (p) =>\n  !p.hasLeft &&\n  css`\n    padding-left: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\nconst notHasRightStyles = (p) =>\n  !p.hasRight &&\n  css`\n    padding-right: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\ninterface ContentProps {\n  hasLeft?: boolean;\n  hasRight?: boolean;\n}\nexport const Content = styled(\n  'div',\n  omitEmotionProps('hasLeft', 'hasRight')\n)<ContentProps>`\n  flex: 1;\n  ${notHasLeftStyles};\n  ${notHasRightStyles};\n  ${ellipsisStyles};\n`;\n\nexport const Placeholder = styled.span`\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n  ${ellipsisStyles};\n`;\n\nconst unborderedTitleStyles = (p) =>\n  p.unbordered &&\n  css`\n    font-weight: 500;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    color: ${clr(p.theme.inputDisabledColorText)};\n  `;\n\ntype TitleProps = Pick<SelectToggleProps, 'disabled' | 'unbordered'>;\nexport const Title = styled(\n  'span',\n  omitEmotionProps('disabled', 'unbordered')\n)<TitleProps>`\n  color: ${(p) => clr(p.theme.colorText)};\n  ${unborderedTitleStyles};\n  ${disabledStyles};\n  ${ellipsisStyles};\n`;\n\ntype ListItemProps = Pick<SelectToggleProps, 'disabled'>;\nconst ListItem = styled(Tag, omitEmotionProps('disabled'))<ListItemProps>`\n  // Reset tag styles\n  padding-top: 0;\n  padding-bottom: 0;\n\n  height: ${(p) => p.theme.selectToggleListItemHeight}em;\n  ${disabledStyles};\n`;\n\nconst List = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  overflow: hidden; // For ellipsis styles\n\n  margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n    ${(p) => -p.theme.selectToggleListItemGap}em 0;\n\n  & > div {\n    margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n      ${(p) => p.theme.selectToggleListItemGap}em 0;\n  }\n`;\n\nconst DeleteButton = styled.button`\n  ${resetButtonStyles};\n  cursor: pointer;\n  display: inherit;\n  font-size: 1em;\n  margin-left: 0.2em;\n\n  background-color: transparent;\n  color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIcon)};\n\n  @media (hover: hover) {\n    &:hover,\n    &:focus {\n      color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIconHover)};\n    }\n  }\n\n  ${transitionStyles('color')};\n`;\n\nconst unborderedIconContainerStyles = (p) =>\n  p.unbordered &&\n  css`\n    padding-top: 0.2em;\n    font-size: 0.8em;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\ninterface IconContainerProps {\n  unbordered?: boolean;\n  disabled?: boolean;\n}\nexport const IconContainer = styled(\n  'span',\n  omitEmotionProps('unbordered', 'disabled')\n)<IconContainerProps>`\n  color: ${(p) => clr(p.theme.selectColorIcon)};\n  line-height: 1;\n  ${unborderedIconContainerStyles};\n`;\n\nexport const ClearIcon = styled(CloseCircle)`\n  transform: scale(1.2) !important;\n`;\n\ninterface AddonProps {\n  hasPadding: boolean;\n}\nconst Addon = styled('span', omitEmotionProps('hasPadding'))<AddonProps>`\n  display: flex;\n  align-items: center;\n  user-select: none;\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n\n  svg {\n    transform: scale(1.2);\n  }\n`;\n\nexport const LeftAddon = styled(Addon)`\n  padding-right: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-left: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nexport const RightAddon = styled(Addon)`\n  padding-left: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-right: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nconst SelectToggle: React.FC<SelectToggleProps> = ({\n  selectedItems,\n  onDelete,\n  onClear,\n  opened,\n  multiple,\n  left,\n  leftHasPadding = false,\n  right,\n  rightHasPadding = false,\n  placeholder,\n  unbordered,\n  loading,\n  disabled,\n  clearVisible,\n  locale,\n}) => {\n  const renderContent = useCallback(() => {\n    if (selectedItems.length === 0) {\n      return <Placeholder>{placeholder}</Placeholder>;\n    }\n    if (multiple) {\n      return (\n        <List>\n          {selectedItems.map(({ title, value }) => (\n            <ListItem\n              key={value}\n              disabled={disabled}\n              right={\n                !disabled ? (\n                  <DeleteButton\n                    onClick={(e) => {\n                      onDelete(value);\n                      e.stopPropagation();\n                    }}\n                    onKeyDown={(e) => e.stopPropagation()}\n                    aria-label={`${locale.deleteLabel} ${title}`}\n                    aria-hidden\n                  >\n                    <Close />\n                  </DeleteButton>\n                ) : undefined\n              }\n              aria-hidden\n            >\n              {title}\n            </ListItem>\n          ))}\n        </List>\n      );\n    }\n    return (\n      <Title disabled={disabled} unbordered={unbordered}>\n        {selectedItems[0].title}\n      </Title>\n    );\n  }, [\n    selectedItems,\n    multiple,\n    disabled,\n    unbordered,\n    placeholder,\n    locale.deleteLabel,\n    onDelete,\n  ]);\n\n  const showClearButton = useMemo(\n    () => clearVisible && selectedItems.length > 0,\n    [clearVisible, selectedItems.length]\n  );\n\n  const rightValue = useMemo(() => {\n    if (loading) return <Loading />;\n    if (showClearButton) {\n      return (\n        <Button\n          type='ghost'\n          wide='never'\n          size='small'\n          disabled={disabled}\n          onClick={(e) => {\n            onClear();\n            e.stopPropagation();\n          }}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter') onClear();\n            e.stopPropagation();\n          }}\n          aria-label={locale.clearLabel}\n        >\n          <ClearIcon />\n        </Button>\n      );\n    }\n    return (\n      right || (\n        <IconContainer unbordered={unbordered} disabled={disabled}>\n          {opened ? <Up /> : <Down />}\n        </IconContainer>\n      )\n    );\n  }, [\n    disabled,\n    loading,\n    locale.clearLabel,\n    onClear,\n    opened,\n    right,\n    showClearButton,\n    unbordered,\n  ]);\n\n  const rightHasPaddingValue = useMemo(() => {\n    if (loading) return true;\n    if (showClearButton) return false;\n    return right ? rightHasPadding : true;\n  }, [loading, right, rightHasPadding, showClearButton]);\n\n  return (\n    <Container>\n      {left && (\n        <ThemeOverrider\n          overrides={(t) => ({\n            buttonPaddingHorizontal: 0.8,\n            baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n          })}\n        >\n          <LeftAddon hasPadding={leftHasPadding}>{left}</LeftAddon>\n        </ThemeOverrider>\n      )}\n\n      <Content hasLeft={!!left} hasRight={!!right && !unbordered}>\n        {renderContent()}\n      </Content>\n\n      {rightValue && (\n        <ThemeOverrider\n          overrides={(t) => ({\n            buttonPaddingHorizontal: 0.8,\n            baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n          })}\n        >\n          <RightAddon hasPadding={rightHasPaddingValue}>\n            {rightValue}\n          </RightAddon>\n        </ThemeOverrider>\n      )}\n    </Container>\n  );\n};\n\nSelectToggle.displayName = 'SelectToggle';\n\nexport default SelectToggle;\n"],"mappings":"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"}
+{"version":3,"file":"SelectToggle.js","names":["Container","styled","div","notHasLeftStyles","p","hasLeft","css","theme","inputPaddingHorizontal","notHasRightStyles","hasRight","unbordered","Content","omitEmotionProps","ellipsisStyles","Placeholder","span","clr","inputColorPlaceholder","unborderedTitleStyles","disabled","colorPrimary","disabledStyles","inputDisabledColorText","Title","colorText","ListItem","Tag","selectToggleListItemHeight","List","selectToggleListItemGap","DeleteButton","button","resetButtonStyles","selectToggleDeleteButtonColorIcon","selectToggleDeleteButtonColorIconHover","transitionStyles","unborderedIconContainerStyles","IconContainer","selectColorIcon","ClearIcon","CloseCircle","Addon","LeftAddon","inputAddonPaddingHorizontal","hasPadding","RightAddon","SelectToggle","selectedItems","onDelete","onClear","opened","multiple","left","leftHasPadding","right","rightHasPadding","placeholder","loading","clearVisible","locale","renderContent","useCallback","length","map","title","value","e","stopPropagation","deleteLabel","undefined","showClearButton","useMemo","rightValue","key","clearLabel","rightHasPaddingValue","t","buttonPaddingHorizontal","baseHeight","sizes","small","displayName"],"sources":["../../../src/Select/SelectToggle.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport styled from '@emotion/styled';\nimport { Up, Down, Loading, Close, CloseCircle } from '@os-design/icons';\nimport {\n  ellipsisStyles,\n  resetButtonStyles,\n  transitionStyles,\n} from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { css } from '@emotion/react';\nimport Tag from '../Tag';\nimport Button from '../Button';\nimport { SelectLocale } from './utils/defaultLocale';\n\ninterface SelectToggleProps {\n  selectedItems: Array<{ title: string; value: string }>;\n  onDelete: (value: string) => void;\n  onClear: () => void;\n  opened: boolean;\n  multiple: boolean;\n  left?: React.ReactNode;\n  leftHasPadding?: boolean;\n  right?: React.ReactNode;\n  rightHasPadding?: boolean;\n  placeholder?: string;\n  unbordered?: boolean;\n  loading?: boolean;\n  disabled?: boolean;\n  clearVisible?: boolean;\n  locale: SelectLocale;\n}\n\nexport const Container = styled.div`\n  flex: 1;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n`;\n\nconst notHasLeftStyles = (p) =>\n  !p.hasLeft &&\n  css`\n    padding-left: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\nconst notHasRightStyles = (p) =>\n  !p.hasRight &&\n  !p.unbordered &&\n  css`\n    padding-right: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\ninterface ContentProps {\n  hasLeft?: boolean;\n  hasRight?: boolean;\n  unbordered?: boolean;\n}\nexport const Content = styled(\n  'div',\n  omitEmotionProps('hasLeft', 'hasRight', 'unbordered')\n)<ContentProps>`\n  flex: 1;\n  ${notHasLeftStyles};\n  ${notHasRightStyles};\n  ${ellipsisStyles};\n`;\n\nexport const Placeholder = styled.span`\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n  ${ellipsisStyles};\n`;\n\nconst unborderedTitleStyles = (p) =>\n  p.unbordered &&\n  css`\n    font-weight: 500;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    color: ${clr(p.theme.inputDisabledColorText)};\n  `;\n\ntype TitleProps = Pick<SelectToggleProps, 'disabled' | 'unbordered'>;\nexport const Title = styled(\n  'span',\n  omitEmotionProps('disabled', 'unbordered')\n)<TitleProps>`\n  color: ${(p) => clr(p.theme.colorText)};\n  ${unborderedTitleStyles};\n  ${disabledStyles};\n  ${ellipsisStyles};\n`;\n\ntype ListItemProps = Pick<SelectToggleProps, 'disabled'>;\nconst ListItem = styled(Tag, omitEmotionProps('disabled'))<ListItemProps>`\n  // Reset tag styles\n  padding-top: 0;\n  padding-bottom: 0;\n\n  height: ${(p) => p.theme.selectToggleListItemHeight}em;\n  ${disabledStyles};\n`;\n\nconst List = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  overflow: hidden; // For ellipsis styles\n\n  margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n    ${(p) => -p.theme.selectToggleListItemGap}em 0;\n\n  & > div {\n    margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n      ${(p) => p.theme.selectToggleListItemGap}em 0;\n  }\n`;\n\nconst DeleteButton = styled.button`\n  ${resetButtonStyles};\n  cursor: pointer;\n  display: inherit;\n  font-size: 1em;\n  margin-left: 0.2em;\n\n  background-color: transparent;\n  color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIcon)};\n\n  @media (hover: hover) {\n    &:hover,\n    &:focus {\n      color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIconHover)};\n    }\n  }\n\n  ${transitionStyles('color')};\n`;\n\nconst unborderedIconContainerStyles = (p) =>\n  p.unbordered &&\n  css`\n    padding-top: 0.2em;\n    font-size: 0.8em;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\ninterface IconContainerProps {\n  unbordered?: boolean;\n  disabled?: boolean;\n}\nexport const IconContainer = styled(\n  'span',\n  omitEmotionProps('unbordered', 'disabled')\n)<IconContainerProps>`\n  color: ${(p) => clr(p.theme.selectColorIcon)};\n  line-height: 1;\n  ${unborderedIconContainerStyles};\n`;\n\nexport const ClearIcon = styled(CloseCircle)`\n  transform: scale(1.2) !important;\n`;\n\ninterface AddonProps {\n  hasPadding: boolean;\n}\nconst Addon = styled('span', omitEmotionProps('hasPadding'))<AddonProps>`\n  display: flex;\n  align-items: center;\n  user-select: none;\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n\n  svg {\n    transform: scale(1.2);\n  }\n`;\n\nexport const LeftAddon = styled(Addon)`\n  padding-right: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-left: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nexport const RightAddon = styled(Addon)`\n  padding-left: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-right: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nconst SelectToggle: React.FC<SelectToggleProps> = ({\n  selectedItems,\n  onDelete,\n  onClear,\n  opened,\n  multiple,\n  left,\n  leftHasPadding = false,\n  right,\n  rightHasPadding = false,\n  placeholder,\n  unbordered,\n  loading,\n  disabled,\n  clearVisible,\n  locale,\n}) => {\n  const renderContent = useCallback(() => {\n    if (selectedItems.length === 0) {\n      return <Placeholder>{placeholder}</Placeholder>;\n    }\n    if (multiple) {\n      return (\n        <List>\n          {selectedItems.map(({ title, value }) => (\n            <ListItem\n              key={value}\n              disabled={disabled}\n              right={\n                !disabled ? (\n                  <DeleteButton\n                    onClick={(e) => {\n                      onDelete(value);\n                      e.stopPropagation();\n                    }}\n                    onKeyDown={(e) => e.stopPropagation()}\n                    aria-label={`${locale.deleteLabel} ${title}`}\n                    aria-hidden\n                  >\n                    <Close />\n                  </DeleteButton>\n                ) : undefined\n              }\n              aria-hidden\n            >\n              {title}\n            </ListItem>\n          ))}\n        </List>\n      );\n    }\n    return (\n      <Title disabled={disabled} unbordered={unbordered}>\n        {selectedItems[0].title}\n      </Title>\n    );\n  }, [\n    selectedItems,\n    multiple,\n    disabled,\n    unbordered,\n    placeholder,\n    locale.deleteLabel,\n    onDelete,\n  ]);\n\n  const showClearButton = useMemo(\n    () => clearVisible && selectedItems.length > 0,\n    [clearVisible, selectedItems.length]\n  );\n\n  const rightValue = useMemo(() => {\n    if (loading) return <Loading />;\n    if (showClearButton) {\n      return (\n        <Button\n          type='ghost'\n          wide='never'\n          size='small'\n          disabled={disabled}\n          onClick={(e) => {\n            onClear();\n            e.stopPropagation();\n          }}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter') onClear();\n            e.stopPropagation();\n          }}\n          aria-label={locale.clearLabel}\n        >\n          <ClearIcon />\n        </Button>\n      );\n    }\n    return (\n      right || (\n        <IconContainer unbordered={unbordered} disabled={disabled}>\n          {opened ? <Up /> : <Down />}\n        </IconContainer>\n      )\n    );\n  }, [\n    disabled,\n    loading,\n    locale.clearLabel,\n    onClear,\n    opened,\n    right,\n    showClearButton,\n    unbordered,\n  ]);\n\n  const rightHasPaddingValue = useMemo(() => {\n    if (loading) return true;\n    if (showClearButton) return false;\n    return right ? rightHasPadding : true;\n  }, [loading, right, rightHasPadding, showClearButton]);\n\n  return (\n    <Container>\n      {left && (\n        <ThemeOverrider\n          overrides={(t) => ({\n            buttonPaddingHorizontal: 0.8,\n            baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n          })}\n        >\n          <LeftAddon hasPadding={leftHasPadding}>{left}</LeftAddon>\n        </ThemeOverrider>\n      )}\n\n      <Content hasLeft={!!left} hasRight={!!right} unbordered={unbordered}>\n        {renderContent()}\n      </Content>\n\n      {rightValue && (\n        <ThemeOverrider\n          overrides={(t) => ({\n            buttonPaddingHorizontal: 0.8,\n            baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n          })}\n        >\n          <RightAddon hasPadding={rightHasPaddingValue}>\n            {rightValue}\n          </RightAddon>\n        </ThemeOverrider>\n      )}\n    </Container>\n  );\n};\n\nSelectToggle.displayName = 'SelectToggle';\n\nexport default SelectToggle;\n"],"mappings":"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"}

package/dist/cjs/{YouTubeVideo → Video}/index.js

@@ -33,24 +33,23 @@ var Container = _styled["default"].div(_templateObject || (_templateObject = _ta
 
 var IFrame = _styled["default"].iframe(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n"])));
 /**
- * The YouTube video player.
+ * The video player.
  */
 
 
-var YouTubeVideo = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+var Video = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var id = _ref.id,
       rest = _objectWithoutProperties(_ref, _excluded);
 
   return /*#__PURE__*/_react["default"].createElement(Container, null, /*#__PURE__*/_react["default"].createElement(IFrame, _extends({
-    src: "https://www.youtube.com/embed/".concat(id),
     frameBorder: 0,
-    allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
+    allow: "clipboard-write; autoplay",
     allowFullScreen: true
   }, rest, {
     ref: ref
   })));
 });
-YouTubeVideo.displayName = 'YouTubeVideo';
-var _default = YouTubeVideo;
+Video.displayName = 'Video';
+var _default = Video;
 exports["default"] = _default;
 //# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["Container","styled","div","IFrame","iframe","Video","forwardRef","ref","id","rest","displayName"],"sources":["../../../src/Video/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport styled from '@emotion/styled';\n\ntype JsxIFrameProps = Omit<JSX.IntrinsicElements['iframe'], 'ref'>;\nexport type VideoProps = JsxIFrameProps;\n\nconst Container = styled.div`\n  position: relative;\n  padding-bottom: 56.25%; // 16:9\n  height: 0;\n`;\n\nconst IFrame = styled.iframe`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n`;\n\n/**\n * The video player.\n */\nconst Video = forwardRef<HTMLIFrameElement, VideoProps>(\n  ({ id, ...rest }, ref) => (\n    <Container>\n      <IFrame\n        frameBorder={0}\n        allow='clipboard-write; autoplay'\n        allowFullScreen\n        {...rest}\n        ref={ref}\n      />\n    </Container>\n  )\n);\n\nVideo.displayName = 'Video';\n\nexport default Video;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;;;;;;;;;;;;;;;;;;;AAKA,IAAMA,SAAS,GAAGC,kBAAA,CAAOC,GAAV,+IAAf;;AAMA,IAAMC,MAAM,GAAGF,kBAAA,CAAOG,MAAV,wJAAZ;AAQA;AACA;AACA;;;AACA,IAAMC,KAAK,gBAAG,IAAAC,iBAAA,EACZ,gBAAkBC,GAAlB;EAAA,IAAGC,EAAH,QAAGA,EAAH;EAAA,IAAUC,IAAV;;EAAA,oBACE,gCAAC,SAAD,qBACE,gCAAC,MAAD;IACE,WAAW,EAAE,CADf;IAEE,KAAK,EAAC,2BAFR;IAGE,eAAe;EAHjB,GAIMA,IAJN;IAKE,GAAG,EAAEF;EALP,GADF,CADF;AAAA,CADY,CAAd;AAcAF,KAAK,CAACK,WAAN,GAAoB,OAApB;eAEeL,K"}

package/dist/cjs/index.js

@@ -19,6 +19,7 @@ var _exportNames = {
   Form: true,
   FormDivider: true,
   FormItem: true,
+  Gallery: true,
   GlobalStyles: true,
   HeaderSkeleton: true,
   Image: true,
@@ -66,7 +67,7 @@ var _exportNames = {
   TextArea: true,
   TextAreaSkeleton: true,
   ThemeSwitcher: true,
-  YouTubeVideo: true
+  Video: true
 };
 Object.defineProperty(exports, "Alert", {
   enumerable: true,
@@ -146,6 +147,12 @@ Object.defineProperty(exports, "FormItem", {
     return _FormItem["default"];
   }
 });
+Object.defineProperty(exports, "Gallery", {
+  enumerable: true,
+  get: function get() {
+    return _Gallery["default"];
+  }
+});
 Object.defineProperty(exports, "GlobalStyles", {
   enumerable: true,
   get: function get() {
@@ -422,10 +429,10 @@ Object.defineProperty(exports, "ThemeSwitcher", {
     return _ThemeSwitcher["default"];
   }
 });
-Object.defineProperty(exports, "YouTubeVideo", {
+Object.defineProperty(exports, "Video", {
   enumerable: true,
   get: function get() {
-    return _YouTubeVideo["default"];
+    return _Video["default"];
   }
 });
 Object.defineProperty(exports, "message", {
@@ -617,6 +624,20 @@ Object.keys(_FormItem).forEach(function (key) {
   });
 });
 
+var _Gallery = _interopRequireWildcard(require("./Gallery"));
+
+Object.keys(_Gallery).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Gallery[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Gallery[key];
+    }
+  });
+});
+
 var _GlobalStyles = _interopRequireDefault(require("./GlobalStyles"));
 
 var _HeaderSkeleton = _interopRequireWildcard(require("./HeaderSkeleton"));
@@ -1251,16 +1272,16 @@ Object.keys(_ThemeSwitcher).forEach(function (key) {
   });
 });
 
-var _YouTubeVideo = _interopRequireWildcard(require("./YouTubeVideo"));
+var _Video = _interopRequireWildcard(require("./Video"));
 
-Object.keys(_YouTubeVideo).forEach(function (key) {
+Object.keys(_Video).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _YouTubeVideo[key]) return;
+  if (key in exports && exports[key] === _Video[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _YouTubeVideo[key];
+      return _Video[key];
     }
   });
 });

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/index.ts"],"sourcesContent":["export { default as Alert } from './Alert';\nexport { default as Avatar } from './Avatar';\nexport { default as AvatarSkeleton } from './AvatarSkeleton';\nexport { default as Breadcrumb } from './Breadcrumb';\nexport { default as BreadcrumbItem } from './BreadcrumbItem';\nexport { default as Button } from './Button';\nexport { default as Checkbox } from './Checkbox';\nexport { default as CheckboxSkeleton } from './CheckboxSkeleton';\nexport { default as DatePicker } from './DatePicker';\nexport { default as Drawer } from './Drawer';\nexport { default as Form } from './Form';\nexport { default as FormDivider } from './FormDivider';\nexport { default as FormItem } from './FormItem';\nexport { default as GlobalStyles } from './GlobalStyles';\nexport { default as HeaderSkeleton } from './HeaderSkeleton';\nexport { default as Image } from './Image';\nexport { default as ImageSkeleton } from './ImageSkeleton';\nexport { default as Input } from './Input';\nexport { default as InputNumber } from './InputNumber';\nexport { default as InputPassword } from './InputPassword';\nexport { default as InputSearch } from './InputSearch';\nexport { default as InputSkeleton } from './InputSkeleton';\nexport { default as Layout } from './Layout';\nexport { default as Link } from './Link';\nexport { default as LinkButton } from './LinkButton';\nexport { default as List } from './List';\nexport { default as ListItem } from './ListItem';\nexport { default as ListItemLink } from './ListItemLink';\nexport { default as ListSkeleton } from './ListSkeleton';\nexport { default as LogoLink } from './LogoLink';\nexport { default as message } from './message';\nexport { default as Menu } from './Menu';\nexport { default as MenuDivider } from './MenuDivider';\nexport { default as MenuGroup } from './MenuGroup';\nexport { default as MenuItem } from './MenuItem';\nexport { default as Modal } from './Modal';\nexport { default as Navigation } from './Navigation';\nexport { default as NavigationItem } from './NavigationItem';\nexport { default as PageContent } from './PageContent';\nexport { default as PageHeader } from './PageHeader';\nexport { default as PageHeaderInputSearch } from './PageHeaderInputSearch';\nexport { default as PageHeaderSkeleton } from './PageHeaderSkeleton';\nexport { default as ParagraphSkeleton } from './ParagraphSkeleton';\nexport { default as Popover } from './Popover';\nexport { default as Progress } from './Progress';\nexport { default as RadioGroup } from './RadioGroup';\nexport { default as Result } from './Result';\nexport { default as ScrollButton } from './ScrollButton';\nexport { default as Select } from './Select';\nexport { default as Skeleton } from './Skeleton';\nexport { default as Switch } from './Switch';\nexport { default as SwitchSkeleton } from './SwitchSkeleton';\nexport { default as Tag } from './Tag';\nexport { default as TagLink } from './TagLink';\nexport { default as TagList } from './TagList';\nexport { default as TagListSkeleton } from './TagListSkeleton';\nexport { default as TagSkeleton } from './TagSkeleton';\nexport { default as TextArea } from './TextArea';\nexport { default as TextAreaSkeleton } from './TextAreaSkeleton';\nexport { default as ThemeSwitcher } from './ThemeSwitcher';\nexport { default as YouTubeVideo } from './YouTubeVideo';\n\nexport * from './Alert';\nexport * from './Avatar';\nexport * from './AvatarSkeleton';\nexport * from './Breadcrumb';\nexport * from './BreadcrumbItem';\nexport * from './Button';\nexport * from './Checkbox';\nexport * from './CheckboxSkeleton';\nexport * from './DatePicker';\nexport * from './Drawer';\nexport * from './Form';\nexport * from './FormDivider';\nexport * from './FormItem';\nexport * from './HeaderSkeleton';\nexport * from './Image';\nexport * from './ImageSkeleton';\nexport * from './Input';\nexport * from './InputNumber';\nexport * from './InputPassword';\nexport * from './InputSearch';\nexport * from './InputSkeleton';\nexport * from './Layout';\nexport * from './Link';\nexport * from './LinkButton';\nexport * from './List';\nexport * from './ListItem';\nexport * from './ListItemLink';\nexport * from './ListSkeleton';\nexport * from './LogoLink';\nexport * from './Menu';\nexport * from './MenuDivider';\nexport * from './MenuGroup';\nexport * from './MenuItem';\nexport * from './Modal';\nexport * from './Navigation';\nexport * from './NavigationItem';\nexport * from './PageContent';\nexport * from './PageHeader';\nexport * from './PageHeaderInputSearch';\nexport * from './PageHeaderSkeleton';\nexport * from './ParagraphSkeleton';\nexport * from './Popover';\nexport * from './Progress';\nexport * from './RadioGroup';\nexport * from './Result';\nexport * from './ScrollButton';\nexport * from './Select';\nexport * from './Skeleton';\nexport * from './Switch';\nexport * from './SwitchSkeleton';\nexport * from './Tag';\nexport * from './TagLink';\nexport * from './TagList';\nexport * from './TagListSkeleton';\nexport * from './TagSkeleton';\nexport * from './TextArea';\nexport * from './TextAreaSkeleton';\nexport * from './ThemeSwitcher';\nexport * from './YouTubeVideo';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AACA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AACA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA3DA;;AA4DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/index.ts"],"sourcesContent":["export { default as Alert } from './Alert';\nexport { default as Avatar } from './Avatar';\nexport { default as AvatarSkeleton } from './AvatarSkeleton';\nexport { default as Breadcrumb } from './Breadcrumb';\nexport { default as BreadcrumbItem } from './BreadcrumbItem';\nexport { default as Button } from './Button';\nexport { default as Checkbox } from './Checkbox';\nexport { default as CheckboxSkeleton } from './CheckboxSkeleton';\nexport { default as DatePicker } from './DatePicker';\nexport { default as Drawer } from './Drawer';\nexport { default as Form } from './Form';\nexport { default as FormDivider } from './FormDivider';\nexport { default as FormItem } from './FormItem';\nexport { default as Gallery } from './Gallery';\nexport { default as GlobalStyles } from './GlobalStyles';\nexport { default as HeaderSkeleton } from './HeaderSkeleton';\nexport { default as Image } from './Image';\nexport { default as ImageSkeleton } from './ImageSkeleton';\nexport { default as Input } from './Input';\nexport { default as InputNumber } from './InputNumber';\nexport { default as InputPassword } from './InputPassword';\nexport { default as InputSearch } from './InputSearch';\nexport { default as InputSkeleton } from './InputSkeleton';\nexport { default as Layout } from './Layout';\nexport { default as Link } from './Link';\nexport { default as LinkButton } from './LinkButton';\nexport { default as List } from './List';\nexport { default as ListItem } from './ListItem';\nexport { default as ListItemLink } from './ListItemLink';\nexport { default as ListSkeleton } from './ListSkeleton';\nexport { default as LogoLink } from './LogoLink';\nexport { default as message } from './message';\nexport { default as Menu } from './Menu';\nexport { default as MenuDivider } from './MenuDivider';\nexport { default as MenuGroup } from './MenuGroup';\nexport { default as MenuItem } from './MenuItem';\nexport { default as Modal } from './Modal';\nexport { default as Navigation } from './Navigation';\nexport { default as NavigationItem } from './NavigationItem';\nexport { default as PageContent } from './PageContent';\nexport { default as PageHeader } from './PageHeader';\nexport { default as PageHeaderInputSearch } from './PageHeaderInputSearch';\nexport { default as PageHeaderSkeleton } from './PageHeaderSkeleton';\nexport { default as ParagraphSkeleton } from './ParagraphSkeleton';\nexport { default as Popover } from './Popover';\nexport { default as Progress } from './Progress';\nexport { default as RadioGroup } from './RadioGroup';\nexport { default as Result } from './Result';\nexport { default as ScrollButton } from './ScrollButton';\nexport { default as Select } from './Select';\nexport { default as Skeleton } from './Skeleton';\nexport { default as Switch } from './Switch';\nexport { default as SwitchSkeleton } from './SwitchSkeleton';\nexport { default as Tag } from './Tag';\nexport { default as TagLink } from './TagLink';\nexport { default as TagList } from './TagList';\nexport { default as TagListSkeleton } from './TagListSkeleton';\nexport { default as TagSkeleton } from './TagSkeleton';\nexport { default as TextArea } from './TextArea';\nexport { default as TextAreaSkeleton } from './TextAreaSkeleton';\nexport { default as ThemeSwitcher } from './ThemeSwitcher';\nexport { default as Video } from './Video';\n\nexport * from './Alert';\nexport * from './Avatar';\nexport * from './AvatarSkeleton';\nexport * from './Breadcrumb';\nexport * from './BreadcrumbItem';\nexport * from './Button';\nexport * from './Checkbox';\nexport * from './CheckboxSkeleton';\nexport * from './DatePicker';\nexport * from './Drawer';\nexport * from './Form';\nexport * from './FormDivider';\nexport * from './FormItem';\nexport * from './Gallery';\nexport * from './HeaderSkeleton';\nexport * from './Image';\nexport * from './ImageSkeleton';\nexport * from './Input';\nexport * from './InputNumber';\nexport * from './InputPassword';\nexport * from './InputSearch';\nexport * from './InputSkeleton';\nexport * from './Layout';\nexport * from './Link';\nexport * from './LinkButton';\nexport * from './List';\nexport * from './ListItem';\nexport * from './ListItemLink';\nexport * from './ListSkeleton';\nexport * from './LogoLink';\nexport * from './Menu';\nexport * from './MenuDivider';\nexport * from './MenuGroup';\nexport * from './MenuItem';\nexport * from './Modal';\nexport * from './Navigation';\nexport * from './NavigationItem';\nexport * from './PageContent';\nexport * from './PageHeader';\nexport * from './PageHeaderInputSearch';\nexport * from './PageHeaderSkeleton';\nexport * from './ParagraphSkeleton';\nexport * from './Popover';\nexport * from './Progress';\nexport * from './RadioGroup';\nexport * from './Result';\nexport * from './ScrollButton';\nexport * from './Select';\nexport * from './Skeleton';\nexport * from './Switch';\nexport * from './SwitchSkeleton';\nexport * from './Tag';\nexport * from './TagLink';\nexport * from './TagList';\nexport * from './TagListSkeleton';\nexport * from './TagSkeleton';\nexport * from './TextArea';\nexport * from './TextAreaSkeleton';\nexport * from './ThemeSwitcher';\nexport * from './Video';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AA+DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA9DA;;AACA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AA8DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA7DA;;AACA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AA5DA;;AA6DA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}

package/dist/esm/Gallery/Status.js

@@ -0,0 +1,37 @@
+import React from 'react';
+import styled from '@emotion/styled';
+import { clr } from '@os-design/theming';
+import { omitEmotionProps } from '@os-design/utils';
+const Container = styled('div', omitEmotionProps('height'))`
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  height: ${p => p.height}px;
+`;
+const Block = styled('div', omitEmotionProps('count', 'index', 'current'))`
+  position: absolute;
+  left: ${p => 100 / p.count * p.index}%;
+  width: ${p => p.index < p.count - 1 ? `calc(${100 / p.count}% - 2px)` : `${100 / p.count}%`};
+  height: 100%;
+
+  background-color: ${p => p.current ? clr(p.theme.galleryStatusColorBgCurrent) : clr(p.theme.galleryStatusColorBg)};
+  backdrop-filter: blur(0.2em);
+`;
+
+const Status = ({
+  count,
+  current,
+  height
+}) => /*#__PURE__*/React.createElement(Container, {
+  height: height
+}, Array(count).fill(0).map((_, index) => /*#__PURE__*/React.createElement(Block, {
+  key: index // eslint-disable-line react/no-array-index-key
+  ,
+  count: count,
+  index: index,
+  current: index === current
+})));
+
+export default Status;
+//# sourceMappingURL=Status.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Status.js","names":["React","styled","clr","omitEmotionProps","Container","p","height","Block","count","index","current","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AACA,SAASC,GAAT,QAAoB,oBAApB;AACA,SAASC,gBAAT,QAAiC,kBAAjC;AAWA,MAAMC,SAAS,GAAGH,MAAM,CAAC,KAAD,EAAQE,gBAAgB,CAAC,QAAD,CAAxB,CAAoD;AAC5E;AACA;AACA;AACA;AACA,YAAaE,CAAD,IAAOA,CAAC,CAACC,MAAO;AAC5B,CANA;AAaA,MAAMC,KAAK,GAAGN,MAAM,CAClB,KADkB,EAElBE,gBAAgB,CAAC,OAAD,EAAU,OAAV,EAAmB,SAAnB,CAFE,CAGN;AACd;AACA,UAAWE,CAAD,IAAQ,MAAMA,CAAC,CAACG,KAAT,GAAkBH,CAAC,CAACI,KAAM;AAC3C,WAAYJ,CAAD,IACPA,CAAC,CAACI,KAAF,GAAUJ,CAAC,CAACG,KAAF,GAAU,CAApB,GACK,QAAO,MAAMH,CAAC,CAACG,KAAM,UAD1B,GAEK,GAAE,MAAMH,CAAC,CAACG,KAAM,GAAG;AAC5B;AACA;AACA,sBAAuBH,CAAD,IAClBA,CAAC,CAACK,OAAF,GACIR,GAAG,CAACG,CAAC,CAACM,KAAF,CAAQC,2BAAT,CADP,GAEIV,GAAG,CAACG,CAAC,CAACM,KAAF,CAAQE,oBAAT,CAA+B;AAC1C;AACA,CAjBA;;AAmBA,MAAMC,MAA6B,GAAG,CAAC;EAAEN,KAAF;EAASE,OAAT;EAAkBJ;AAAlB,CAAD,kBACpC,oBAAC,SAAD;EAAW,MAAM,EAAEA;AAAnB,GACGS,KAAK,CAACP,KAAD,CAAL,CACEQ,IADF,CACO,CADP,EAEEC,GAFF,CAEM,CAACC,CAAD,EAAIT,KAAJ,kBACH,oBAAC,KAAD;EACE,GAAG,EAAEA,KADP,CACc;EADd;EAEE,KAAK,EAAED,KAFT;EAGE,KAAK,EAAEC,KAHT;EAIE,OAAO,EAAEA,KAAK,KAAKC;AAJrB,EAHH,CADH,CADF;;AAeA,eAAeI,MAAf"}

package/dist/esm/Gallery/index.js

@@ -0,0 +1,106 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import styled from '@emotion/styled';
+import { clr, ThemeOverrider } from '@os-design/theming';
+import { omitEmotionProps, useSize } from '@os-design/utils';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import Image from '../Image';
+import GalleryStatus from './Status';
+const Container = styled('div', omitEmotionProps('heightPercent'))`
+  position: relative;
+  padding-bottom: ${p => p.heightPercent}%;
+
+  display: flex;
+  justify-content: center;
+
+  background-color: ${p => clr(p.theme.galleryColorBg)};
+  border-radius: ${p => p.theme.borderRadius}em;
+  overflow: hidden;
+  touch-action: none;
+`;
+const StyledImage = styled(Image)`
+  position: absolute;
+  width: auto;
+  height: 100%;
+  border-radius: 0;
+`;
+const GalleryHelp = styled.div`
+  position: absolute;
+  top: 0;
+  right: 0;
+
+  background-color: ${p => clr(p.theme.galleryHelpColorBg)};
+  color: ${p => clr(p.theme.galleryHelpColorText)};
+  backdrop-filter: blur(0.2em);
+
+  font-size: ${p => p.theme.sizes.small}em;
+  font-weight: 500;
+
+  border-bottom-left-radius: ${p => p.theme.borderRadius}em;
+  padding: 0.1em 0.5em;
+`;
+
+/**
+ * The image gallery. Change the cursor/touch position to change images.
+ * The lib 'lazysizes/plugins/attrchange/ls.attrchange' must be imported.
+ */
+const Gallery = ({
+  urls,
+  aspectRatio = [16, 9],
+  help,
+  imageProps = {},
+  children,
+  ...rest
+}) => {
+  const [imageUrl, setImageUrl] = useState(undefined);
+  const [imageIndex, setImageIndex] = useState(urls.length > 0 ? 0 : null);
+  const heightPercent = useMemo(() => Math.round(aspectRatio[1] / aspectRatio[0] * 1000000) / 10000, [aspectRatio]);
+  const imageIndexRef = useRef(imageIndex);
+  useEffect(() => {
+    imageIndexRef.current = imageIndex;
+  }, [imageIndex]); // Update the image if the index was changed
+
+  useEffect(() => {
+    setImageUrl(imageIndex !== null ? urls[imageIndex] : undefined);
+  }, [imageIndex, urls]);
+  const containerRef = useRef(null);
+  const size = useSize(containerRef);
+  const sizeRef = useRef(size);
+  useEffect(() => {
+    sizeRef.current = size;
+  }, [size]);
+  const statusHeight = useMemo(() => Math.round(size.height / 70), [size.height]);
+  const updateGalleryImage = useCallback(clientX => {
+    if (!containerRef.current) return;
+    const {
+      x
+    } = containerRef.current.getBoundingClientRect();
+    const widthPerImage = sizeRef.current.width / urls.length;
+    const xPos = clientX - x;
+    if (xPos < 0) return;
+    const nextIndex = Math.floor(xPos / widthPerImage);
+
+    if (imageIndexRef.current !== nextIndex) {
+      setImageIndex(nextIndex);
+    }
+  }, [urls.length]);
+  const mouseMoveHandler = useCallback(e => updateGalleryImage(e.clientX), [updateGalleryImage]);
+  const touchMoveHandler = useCallback(e => updateGalleryImage(e.touches[0].clientX), [updateGalleryImage]);
+  return /*#__PURE__*/React.createElement(ThemeOverrider, {
+    activeTheme: "dark"
+  }, /*#__PURE__*/React.createElement(Container, _extends({
+    ref: containerRef,
+    heightPercent: heightPercent,
+    onMouseMove: mouseMoveHandler,
+    onTouchMove: touchMoveHandler
+  }, rest), /*#__PURE__*/React.createElement(StyledImage, _extends({
+    url: imageUrl
+  }, imageProps)), urls.length > 1 && /*#__PURE__*/React.createElement(React.Fragment, null, imageIndex !== null && /*#__PURE__*/React.createElement(GalleryStatus, {
+    count: urls.length,
+    current: imageIndex,
+    height: statusHeight
+  }), help && /*#__PURE__*/React.createElement(GalleryHelp, null, help)), children));
+};
+
+export default Gallery;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["styled","clr","ThemeOverrider","omitEmotionProps","useSize","React","useCallback","useEffect","useMemo","useRef","useState","Image","GalleryStatus","Container","p","heightPercent","theme","galleryColorBg","borderRadius","StyledImage","GalleryHelp","div","galleryHelpColorBg","galleryHelpColorText","sizes","small","Gallery","urls","aspectRatio","help","imageProps","children","rest","imageUrl","setImageUrl","undefined","imageIndex","setImageIndex","length","Math","round","imageIndexRef","current","containerRef","size","sizeRef","statusHeight","height","updateGalleryImage","clientX","x","getBoundingClientRect","widthPerImage","width","xPos","nextIndex","floor","mouseMoveHandler","e","touchMoveHandler","touches"],"sources":["../../../src/Gallery/index.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { omitEmotionProps, useSize } from '@os-design/utils';\nimport React, {\n  MouseEventHandler,\n  TouchEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\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  touch-action: none;\n`;\n\nconst StyledImage = styled(Image)`\n  position: absolute;\n  width: auto;\n  height: 100%;\n  border-radius: 0;\n`;\n\nconst GalleryHelp = styled.div`\n  position: absolute;\n  top: 0;\n  right: 0;\n\n  background-color: ${(p) => clr(p.theme.galleryHelpColorBg)};\n  color: ${(p) => clr(p.theme.galleryHelpColorText)};\n  backdrop-filter: blur(0.2em);\n\n  font-size: ${(p) => p.theme.sizes.small}em;\n  font-weight: 500;\n\n  border-bottom-left-radius: ${(p) => p.theme.borderRadius}em;\n  padding: 0.1em 0.5em;\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 help message that is displayed in the upper right corner.\n   */\n  help?: string;\n  /**\n   * The props of the image component.\n   */\n  imageProps?: Omit<ImageProps, 'url'>;\n  /**\n   * The children that can be displayed on top of the image.\n   * E.g. tags.\n   */\n  children?: React.ReactNode;\n}\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: React.FC<GalleryProps> = ({\n  urls,\n  aspectRatio = [16, 9],\n  help,\n  imageProps = {},\n  children,\n  ...rest\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 containerRef = useRef<HTMLDivElement>(null);\n\n  const size = useSize(containerRef);\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 (!containerRef.current) return;\n      const { x } = containerRef.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    [urls.length]\n  );\n\n  const mouseMoveHandler = useCallback<MouseEventHandler<HTMLDivElement>>(\n    (e) => updateGalleryImage(e.clientX),\n    [updateGalleryImage]\n  );\n\n  const touchMoveHandler = useCallback<TouchEventHandler<HTMLDivElement>>(\n    (e) => updateGalleryImage(e.touches[0].clientX),\n    [updateGalleryImage]\n  );\n\n  return (\n    <ThemeOverrider activeTheme='dark'>\n      <Container\n        ref={containerRef}\n        heightPercent={heightPercent}\n        onMouseMove={mouseMoveHandler}\n        onTouchMove={touchMoveHandler}\n        {...rest}\n      >\n        <StyledImage url={imageUrl} {...imageProps} />\n        {urls.length > 1 && (\n          <>\n            {imageIndex !== null && (\n              <GalleryStatus\n                count={urls.length}\n                current={imageIndex}\n                height={statusHeight}\n              />\n            )}\n            {help && <GalleryHelp>{help}</GalleryHelp>}\n          </>\n        )}\n        {children}\n      </Container>\n    </ThemeOverrider>\n  );\n};\n\nexport default Gallery;\n"],"mappings":"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"}

package/dist/esm/Select/SelectToggle.js

@@ -18,11 +18,11 @@ const notHasLeftStyles = p => !p.hasLeft && css`
     padding-left: ${p.theme.inputPaddingHorizontal}em;
   `;
 
-const notHasRightStyles = p => !p.hasRight && css`
+const notHasRightStyles = p => !p.hasRight && !p.unbordered && css`
     padding-right: ${p.theme.inputPaddingHorizontal}em;
   `;
 
-export const Content = styled('div', omitEmotionProps('hasLeft', 'hasRight'))`
+export const Content = styled('div', omitEmotionProps('hasLeft', 'hasRight', 'unbordered'))`
   flex: 1;
   ${notHasLeftStyles};
   ${notHasRightStyles};
@@ -214,7 +214,8 @@ const SelectToggle = ({
     hasPadding: leftHasPadding
   }, left)), /*#__PURE__*/React.createElement(Content, {
     hasLeft: !!left,
-    hasRight: !!right && !unbordered
+    hasRight: !!right,
+    unbordered: unbordered
   }, renderContent()), rightValue && /*#__PURE__*/React.createElement(ThemeOverrider, {
     overrides: t => ({
       buttonPaddingHorizontal: 0.8,

package/dist/esm/Select/SelectToggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectToggle.js","names":["React","useCallback","useMemo","styled","Up","Down","Loading","Close","CloseCircle","ellipsisStyles","resetButtonStyles","transitionStyles","omitEmotionProps","clr","ThemeOverrider","css","Tag","Button","Container","div","notHasLeftStyles","p","hasLeft","theme","inputPaddingHorizontal","notHasRightStyles","hasRight","Content","Placeholder","span","inputColorPlaceholder","unborderedTitleStyles","unbordered","disabled","colorPrimary","disabledStyles","inputDisabledColorText","Title","colorText","ListItem","selectToggleListItemHeight","List","selectToggleListItemGap","DeleteButton","button","selectToggleDeleteButtonColorIcon","selectToggleDeleteButtonColorIconHover","unborderedIconContainerStyles","IconContainer","selectColorIcon","ClearIcon","Addon","LeftAddon","inputAddonPaddingHorizontal","hasPadding","RightAddon","SelectToggle","selectedItems","onDelete","onClear","opened","multiple","left","leftHasPadding","right","rightHasPadding","placeholder","loading","clearVisible","locale","renderContent","length","map","title","value","e","stopPropagation","deleteLabel","undefined","showClearButton","rightValue","key","clearLabel","rightHasPaddingValue","t","buttonPaddingHorizontal","baseHeight","sizes","small","displayName"],"sources":["../../../src/Select/SelectToggle.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport styled from '@emotion/styled';\nimport { Up, Down, Loading, Close, CloseCircle } from '@os-design/icons';\nimport {\n  ellipsisStyles,\n  resetButtonStyles,\n  transitionStyles,\n} from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { css } from '@emotion/react';\nimport Tag from '../Tag';\nimport Button from '../Button';\nimport { SelectLocale } from './utils/defaultLocale';\n\ninterface SelectToggleProps {\n  selectedItems: Array<{ title: string; value: string }>;\n  onDelete: (value: string) => void;\n  onClear: () => void;\n  opened: boolean;\n  multiple: boolean;\n  left?: React.ReactNode;\n  leftHasPadding?: boolean;\n  right?: React.ReactNode;\n  rightHasPadding?: boolean;\n  placeholder?: string;\n  unbordered?: boolean;\n  loading?: boolean;\n  disabled?: boolean;\n  clearVisible?: boolean;\n  locale: SelectLocale;\n}\n\nexport const Container = styled.div`\n  flex: 1;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n`;\n\nconst notHasLeftStyles = (p) =>\n  !p.hasLeft &&\n  css`\n    padding-left: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\nconst notHasRightStyles = (p) =>\n  !p.hasRight &&\n  css`\n    padding-right: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\ninterface ContentProps {\n  hasLeft?: boolean;\n  hasRight?: boolean;\n}\nexport const Content = styled(\n  'div',\n  omitEmotionProps('hasLeft', 'hasRight')\n)<ContentProps>`\n  flex: 1;\n  ${notHasLeftStyles};\n  ${notHasRightStyles};\n  ${ellipsisStyles};\n`;\n\nexport const Placeholder = styled.span`\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n  ${ellipsisStyles};\n`;\n\nconst unborderedTitleStyles = (p) =>\n  p.unbordered &&\n  css`\n    font-weight: 500;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    color: ${clr(p.theme.inputDisabledColorText)};\n  `;\n\ntype TitleProps = Pick<SelectToggleProps, 'disabled' | 'unbordered'>;\nexport const Title = styled(\n  'span',\n  omitEmotionProps('disabled', 'unbordered')\n)<TitleProps>`\n  color: ${(p) => clr(p.theme.colorText)};\n  ${unborderedTitleStyles};\n  ${disabledStyles};\n  ${ellipsisStyles};\n`;\n\ntype ListItemProps = Pick<SelectToggleProps, 'disabled'>;\nconst ListItem = styled(Tag, omitEmotionProps('disabled'))<ListItemProps>`\n  // Reset tag styles\n  padding-top: 0;\n  padding-bottom: 0;\n\n  height: ${(p) => p.theme.selectToggleListItemHeight}em;\n  ${disabledStyles};\n`;\n\nconst List = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  overflow: hidden; // For ellipsis styles\n\n  margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n    ${(p) => -p.theme.selectToggleListItemGap}em 0;\n\n  & > div {\n    margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n      ${(p) => p.theme.selectToggleListItemGap}em 0;\n  }\n`;\n\nconst DeleteButton = styled.button`\n  ${resetButtonStyles};\n  cursor: pointer;\n  display: inherit;\n  font-size: 1em;\n  margin-left: 0.2em;\n\n  background-color: transparent;\n  color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIcon)};\n\n  @media (hover: hover) {\n    &:hover,\n    &:focus {\n      color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIconHover)};\n    }\n  }\n\n  ${transitionStyles('color')};\n`;\n\nconst unborderedIconContainerStyles = (p) =>\n  p.unbordered &&\n  css`\n    padding-top: 0.2em;\n    font-size: 0.8em;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\ninterface IconContainerProps {\n  unbordered?: boolean;\n  disabled?: boolean;\n}\nexport const IconContainer = styled(\n  'span',\n  omitEmotionProps('unbordered', 'disabled')\n)<IconContainerProps>`\n  color: ${(p) => clr(p.theme.selectColorIcon)};\n  line-height: 1;\n  ${unborderedIconContainerStyles};\n`;\n\nexport const ClearIcon = styled(CloseCircle)`\n  transform: scale(1.2) !important;\n`;\n\ninterface AddonProps {\n  hasPadding: boolean;\n}\nconst Addon = styled('span', omitEmotionProps('hasPadding'))<AddonProps>`\n  display: flex;\n  align-items: center;\n  user-select: none;\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n\n  svg {\n    transform: scale(1.2);\n  }\n`;\n\nexport const LeftAddon = styled(Addon)`\n  padding-right: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-left: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nexport const RightAddon = styled(Addon)`\n  padding-left: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-right: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nconst SelectToggle: React.FC<SelectToggleProps> = ({\n  selectedItems,\n  onDelete,\n  onClear,\n  opened,\n  multiple,\n  left,\n  leftHasPadding = false,\n  right,\n  rightHasPadding = false,\n  placeholder,\n  unbordered,\n  loading,\n  disabled,\n  clearVisible,\n  locale,\n}) => {\n  const renderContent = useCallback(() => {\n    if (selectedItems.length === 0) {\n      return <Placeholder>{placeholder}</Placeholder>;\n    }\n    if (multiple) {\n      return (\n        <List>\n          {selectedItems.map(({ title, value }) => (\n            <ListItem\n              key={value}\n              disabled={disabled}\n              right={\n                !disabled ? (\n                  <DeleteButton\n                    onClick={(e) => {\n                      onDelete(value);\n                      e.stopPropagation();\n                    }}\n                    onKeyDown={(e) => e.stopPropagation()}\n                    aria-label={`${locale.deleteLabel} ${title}`}\n                    aria-hidden\n                  >\n                    <Close />\n                  </DeleteButton>\n                ) : undefined\n              }\n              aria-hidden\n            >\n              {title}\n            </ListItem>\n          ))}\n        </List>\n      );\n    }\n    return (\n      <Title disabled={disabled} unbordered={unbordered}>\n        {selectedItems[0].title}\n      </Title>\n    );\n  }, [\n    selectedItems,\n    multiple,\n    disabled,\n    unbordered,\n    placeholder,\n    locale.deleteLabel,\n    onDelete,\n  ]);\n\n  const showClearButton = useMemo(\n    () => clearVisible && selectedItems.length > 0,\n    [clearVisible, selectedItems.length]\n  );\n\n  const rightValue = useMemo(() => {\n    if (loading) return <Loading />;\n    if (showClearButton) {\n      return (\n        <Button\n          type='ghost'\n          wide='never'\n          size='small'\n          disabled={disabled}\n          onClick={(e) => {\n            onClear();\n            e.stopPropagation();\n          }}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter') onClear();\n            e.stopPropagation();\n          }}\n          aria-label={locale.clearLabel}\n        >\n          <ClearIcon />\n        </Button>\n      );\n    }\n    return (\n      right || (\n        <IconContainer unbordered={unbordered} disabled={disabled}>\n          {opened ? <Up /> : <Down />}\n        </IconContainer>\n      )\n    );\n  }, [\n    disabled,\n    loading,\n    locale.clearLabel,\n    onClear,\n    opened,\n    right,\n    showClearButton,\n    unbordered,\n  ]);\n\n  const rightHasPaddingValue = useMemo(() => {\n    if (loading) return true;\n    if (showClearButton) return false;\n    return right ? rightHasPadding : true;\n  }, [loading, right, rightHasPadding, showClearButton]);\n\n  return (\n    <Container>\n      {left && (\n        <ThemeOverrider\n          overrides={(t) => ({\n            buttonPaddingHorizontal: 0.8,\n            baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n          })}\n        >\n          <LeftAddon hasPadding={leftHasPadding}>{left}</LeftAddon>\n        </ThemeOverrider>\n      )}\n\n      <Content hasLeft={!!left} hasRight={!!right && !unbordered}>\n        {renderContent()}\n      </Content>\n\n      {rightValue && (\n        <ThemeOverrider\n          overrides={(t) => ({\n            buttonPaddingHorizontal: 0.8,\n            baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n          })}\n        >\n          <RightAddon hasPadding={rightHasPaddingValue}>\n            {rightValue}\n          </RightAddon>\n        </ThemeOverrider>\n      )}\n    </Container>\n  );\n};\n\nSelectToggle.displayName = 'SelectToggle';\n\nexport default SelectToggle;\n"],"mappings":"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"}
+{"version":3,"file":"SelectToggle.js","names":["React","useCallback","useMemo","styled","Up","Down","Loading","Close","CloseCircle","ellipsisStyles","resetButtonStyles","transitionStyles","omitEmotionProps","clr","ThemeOverrider","css","Tag","Button","Container","div","notHasLeftStyles","p","hasLeft","theme","inputPaddingHorizontal","notHasRightStyles","hasRight","unbordered","Content","Placeholder","span","inputColorPlaceholder","unborderedTitleStyles","disabled","colorPrimary","disabledStyles","inputDisabledColorText","Title","colorText","ListItem","selectToggleListItemHeight","List","selectToggleListItemGap","DeleteButton","button","selectToggleDeleteButtonColorIcon","selectToggleDeleteButtonColorIconHover","unborderedIconContainerStyles","IconContainer","selectColorIcon","ClearIcon","Addon","LeftAddon","inputAddonPaddingHorizontal","hasPadding","RightAddon","SelectToggle","selectedItems","onDelete","onClear","opened","multiple","left","leftHasPadding","right","rightHasPadding","placeholder","loading","clearVisible","locale","renderContent","length","map","title","value","e","stopPropagation","deleteLabel","undefined","showClearButton","rightValue","key","clearLabel","rightHasPaddingValue","t","buttonPaddingHorizontal","baseHeight","sizes","small","displayName"],"sources":["../../../src/Select/SelectToggle.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport styled from '@emotion/styled';\nimport { Up, Down, Loading, Close, CloseCircle } from '@os-design/icons';\nimport {\n  ellipsisStyles,\n  resetButtonStyles,\n  transitionStyles,\n} from '@os-design/styles';\nimport { omitEmotionProps } from '@os-design/utils';\nimport { clr, ThemeOverrider } from '@os-design/theming';\nimport { css } from '@emotion/react';\nimport Tag from '../Tag';\nimport Button from '../Button';\nimport { SelectLocale } from './utils/defaultLocale';\n\ninterface SelectToggleProps {\n  selectedItems: Array<{ title: string; value: string }>;\n  onDelete: (value: string) => void;\n  onClear: () => void;\n  opened: boolean;\n  multiple: boolean;\n  left?: React.ReactNode;\n  leftHasPadding?: boolean;\n  right?: React.ReactNode;\n  rightHasPadding?: boolean;\n  placeholder?: string;\n  unbordered?: boolean;\n  loading?: boolean;\n  disabled?: boolean;\n  clearVisible?: boolean;\n  locale: SelectLocale;\n}\n\nexport const Container = styled.div`\n  flex: 1;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n`;\n\nconst notHasLeftStyles = (p) =>\n  !p.hasLeft &&\n  css`\n    padding-left: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\nconst notHasRightStyles = (p) =>\n  !p.hasRight &&\n  !p.unbordered &&\n  css`\n    padding-right: ${p.theme.inputPaddingHorizontal}em;\n  `;\n\ninterface ContentProps {\n  hasLeft?: boolean;\n  hasRight?: boolean;\n  unbordered?: boolean;\n}\nexport const Content = styled(\n  'div',\n  omitEmotionProps('hasLeft', 'hasRight', 'unbordered')\n)<ContentProps>`\n  flex: 1;\n  ${notHasLeftStyles};\n  ${notHasRightStyles};\n  ${ellipsisStyles};\n`;\n\nexport const Placeholder = styled.span`\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n  ${ellipsisStyles};\n`;\n\nconst unborderedTitleStyles = (p) =>\n  p.unbordered &&\n  css`\n    font-weight: 500;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\nconst disabledStyles = (p) =>\n  p.disabled &&\n  css`\n    color: ${clr(p.theme.inputDisabledColorText)};\n  `;\n\ntype TitleProps = Pick<SelectToggleProps, 'disabled' | 'unbordered'>;\nexport const Title = styled(\n  'span',\n  omitEmotionProps('disabled', 'unbordered')\n)<TitleProps>`\n  color: ${(p) => clr(p.theme.colorText)};\n  ${unborderedTitleStyles};\n  ${disabledStyles};\n  ${ellipsisStyles};\n`;\n\ntype ListItemProps = Pick<SelectToggleProps, 'disabled'>;\nconst ListItem = styled(Tag, omitEmotionProps('disabled'))<ListItemProps>`\n  // Reset tag styles\n  padding-top: 0;\n  padding-bottom: 0;\n\n  height: ${(p) => p.theme.selectToggleListItemHeight}em;\n  ${disabledStyles};\n`;\n\nconst List = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  overflow: hidden; // For ellipsis styles\n\n  margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n    ${(p) => -p.theme.selectToggleListItemGap}em 0;\n\n  & > div {\n    margin: 0 ${(p) => p.theme.selectToggleListItemGap}em\n      ${(p) => p.theme.selectToggleListItemGap}em 0;\n  }\n`;\n\nconst DeleteButton = styled.button`\n  ${resetButtonStyles};\n  cursor: pointer;\n  display: inherit;\n  font-size: 1em;\n  margin-left: 0.2em;\n\n  background-color: transparent;\n  color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIcon)};\n\n  @media (hover: hover) {\n    &:hover,\n    &:focus {\n      color: ${(p) => clr(p.theme.selectToggleDeleteButtonColorIconHover)};\n    }\n  }\n\n  ${transitionStyles('color')};\n`;\n\nconst unborderedIconContainerStyles = (p) =>\n  p.unbordered &&\n  css`\n    padding-top: 0.2em;\n    font-size: 0.8em;\n    ${!p.disabled && `color: ${clr(p.theme.colorPrimary)};`}\n  `;\n\ninterface IconContainerProps {\n  unbordered?: boolean;\n  disabled?: boolean;\n}\nexport const IconContainer = styled(\n  'span',\n  omitEmotionProps('unbordered', 'disabled')\n)<IconContainerProps>`\n  color: ${(p) => clr(p.theme.selectColorIcon)};\n  line-height: 1;\n  ${unborderedIconContainerStyles};\n`;\n\nexport const ClearIcon = styled(CloseCircle)`\n  transform: scale(1.2) !important;\n`;\n\ninterface AddonProps {\n  hasPadding: boolean;\n}\nconst Addon = styled('span', omitEmotionProps('hasPadding'))<AddonProps>`\n  display: flex;\n  align-items: center;\n  user-select: none;\n  color: ${(p) => clr(p.theme.inputColorPlaceholder)};\n\n  svg {\n    transform: scale(1.2);\n  }\n`;\n\nexport const LeftAddon = styled(Addon)`\n  padding-right: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-left: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nexport const RightAddon = styled(Addon)`\n  padding-left: ${(p) => p.theme.inputAddonPaddingHorizontal}em;\n  ${(p) =>\n    p.hasPadding &&\n    css`\n      padding-right: ${p.theme.inputPaddingHorizontal}em;\n    `}\n`;\n\nconst SelectToggle: React.FC<SelectToggleProps> = ({\n  selectedItems,\n  onDelete,\n  onClear,\n  opened,\n  multiple,\n  left,\n  leftHasPadding = false,\n  right,\n  rightHasPadding = false,\n  placeholder,\n  unbordered,\n  loading,\n  disabled,\n  clearVisible,\n  locale,\n}) => {\n  const renderContent = useCallback(() => {\n    if (selectedItems.length === 0) {\n      return <Placeholder>{placeholder}</Placeholder>;\n    }\n    if (multiple) {\n      return (\n        <List>\n          {selectedItems.map(({ title, value }) => (\n            <ListItem\n              key={value}\n              disabled={disabled}\n              right={\n                !disabled ? (\n                  <DeleteButton\n                    onClick={(e) => {\n                      onDelete(value);\n                      e.stopPropagation();\n                    }}\n                    onKeyDown={(e) => e.stopPropagation()}\n                    aria-label={`${locale.deleteLabel} ${title}`}\n                    aria-hidden\n                  >\n                    <Close />\n                  </DeleteButton>\n                ) : undefined\n              }\n              aria-hidden\n            >\n              {title}\n            </ListItem>\n          ))}\n        </List>\n      );\n    }\n    return (\n      <Title disabled={disabled} unbordered={unbordered}>\n        {selectedItems[0].title}\n      </Title>\n    );\n  }, [\n    selectedItems,\n    multiple,\n    disabled,\n    unbordered,\n    placeholder,\n    locale.deleteLabel,\n    onDelete,\n  ]);\n\n  const showClearButton = useMemo(\n    () => clearVisible && selectedItems.length > 0,\n    [clearVisible, selectedItems.length]\n  );\n\n  const rightValue = useMemo(() => {\n    if (loading) return <Loading />;\n    if (showClearButton) {\n      return (\n        <Button\n          type='ghost'\n          wide='never'\n          size='small'\n          disabled={disabled}\n          onClick={(e) => {\n            onClear();\n            e.stopPropagation();\n          }}\n          onKeyDown={(e) => {\n            if (e.key === 'Enter') onClear();\n            e.stopPropagation();\n          }}\n          aria-label={locale.clearLabel}\n        >\n          <ClearIcon />\n        </Button>\n      );\n    }\n    return (\n      right || (\n        <IconContainer unbordered={unbordered} disabled={disabled}>\n          {opened ? <Up /> : <Down />}\n        </IconContainer>\n      )\n    );\n  }, [\n    disabled,\n    loading,\n    locale.clearLabel,\n    onClear,\n    opened,\n    right,\n    showClearButton,\n    unbordered,\n  ]);\n\n  const rightHasPaddingValue = useMemo(() => {\n    if (loading) return true;\n    if (showClearButton) return false;\n    return right ? rightHasPadding : true;\n  }, [loading, right, rightHasPadding, showClearButton]);\n\n  return (\n    <Container>\n      {left && (\n        <ThemeOverrider\n          overrides={(t) => ({\n            buttonPaddingHorizontal: 0.8,\n            baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n          })}\n        >\n          <LeftAddon hasPadding={leftHasPadding}>{left}</LeftAddon>\n        </ThemeOverrider>\n      )}\n\n      <Content hasLeft={!!left} hasRight={!!right} unbordered={unbordered}>\n        {renderContent()}\n      </Content>\n\n      {rightValue && (\n        <ThemeOverrider\n          overrides={(t) => ({\n            buttonPaddingHorizontal: 0.8,\n            baseHeight: t.selectToggleListItemHeight / t.sizes.small,\n          })}\n        >\n          <RightAddon hasPadding={rightHasPaddingValue}>\n            {rightValue}\n          </RightAddon>\n        </ThemeOverrider>\n      )}\n    </Container>\n  );\n};\n\nSelectToggle.displayName = 'SelectToggle';\n\nexport default SelectToggle;\n"],"mappings":"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"}

package/dist/esm/{YouTubeVideo → Video}/index.js

@@ -15,20 +15,19 @@ const IFrame = styled.iframe`
   height: 100%;
 `;
 /**
- * The YouTube video player.
+ * The video player.
  */
 
-const YouTubeVideo = /*#__PURE__*/forwardRef(({
+const Video = /*#__PURE__*/forwardRef(({
   id,
   ...rest
 }, ref) => /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(IFrame, _extends({
-  src: `https://www.youtube.com/embed/${id}`,
   frameBorder: 0,
-  allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
+  allow: "clipboard-write; autoplay",
   allowFullScreen: true
 }, rest, {
   ref: ref
 }))));
-YouTubeVideo.displayName = 'YouTubeVideo';
-export default YouTubeVideo;
+Video.displayName = 'Video';
+export default Video;
 //# sourceMappingURL=index.js.map

package/dist/esm/Video/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["React","forwardRef","styled","Container","div","IFrame","iframe","Video","id","rest","ref","displayName"],"sources":["../../../src/Video/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport styled from '@emotion/styled';\n\ntype JsxIFrameProps = Omit<JSX.IntrinsicElements['iframe'], 'ref'>;\nexport type VideoProps = JsxIFrameProps;\n\nconst Container = styled.div`\n  position: relative;\n  padding-bottom: 56.25%; // 16:9\n  height: 0;\n`;\n\nconst IFrame = styled.iframe`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n`;\n\n/**\n * The video player.\n */\nconst Video = forwardRef<HTMLIFrameElement, VideoProps>(\n  ({ id, ...rest }, ref) => (\n    <Container>\n      <IFrame\n        frameBorder={0}\n        allow='clipboard-write; autoplay'\n        allowFullScreen\n        {...rest}\n        ref={ref}\n      />\n    </Container>\n  )\n);\n\nVideo.displayName = 'Video';\n\nexport default Video;\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,UAAhB,QAAkC,OAAlC;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AAKA,MAAMC,SAAS,GAAGD,MAAM,CAACE,GAAI;AAC7B;AACA;AACA;AACA,CAJA;AAMA,MAAMC,MAAM,GAAGH,MAAM,CAACI,MAAO;AAC7B;AACA;AACA;AACA;AACA;AACA,CANA;AAQA;AACA;AACA;;AACA,MAAMC,KAAK,gBAAGN,UAAU,CACtB,CAAC;EAAEO,EAAF;EAAM,GAAGC;AAAT,CAAD,EAAkBC,GAAlB,kBACE,oBAAC,SAAD,qBACE,oBAAC,MAAD;EACE,WAAW,EAAE,CADf;EAEE,KAAK,EAAC,2BAFR;EAGE,eAAe;AAHjB,GAIMD,IAJN;EAKE,GAAG,EAAEC;AALP,GADF,CAFoB,CAAxB;AAcAH,KAAK,CAACI,WAAN,GAAoB,OAApB;AAEA,eAAeJ,KAAf"}

package/dist/esm/index.js

@@ -11,6 +11,7 @@ export { default as Drawer } from './Drawer';
 export { default as Form } from './Form';
 export { default as FormDivider } from './FormDivider';
 export { default as FormItem } from './FormItem';
+export { default as Gallery } from './Gallery';
 export { default as GlobalStyles } from './GlobalStyles';
 export { default as HeaderSkeleton } from './HeaderSkeleton';
 export { default as Image } from './Image';
@@ -58,7 +59,7 @@ export { default as TagSkeleton } from './TagSkeleton';
 export { default as TextArea } from './TextArea';
 export { default as TextAreaSkeleton } from './TextAreaSkeleton';
 export { default as ThemeSwitcher } from './ThemeSwitcher';
-export { default as YouTubeVideo } from './YouTubeVideo';
+export { default as Video } from './Video';
 export * from './Alert';
 export * from './Avatar';
 export * from './AvatarSkeleton';
@@ -72,6 +73,7 @@ export * from './Drawer';
 export * from './Form';
 export * from './FormDivider';
 export * from './FormItem';
+export * from './Gallery';
 export * from './HeaderSkeleton';
 export * from './Image';
 export * from './ImageSkeleton';
@@ -117,5 +119,5 @@ export * from './TagSkeleton';
 export * from './TextArea';
 export * from './TextAreaSkeleton';
 export * from './ThemeSwitcher';
-export * from './YouTubeVideo';
+export * from './Video';
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","Alert","Avatar","AvatarSkeleton","Breadcrumb","BreadcrumbItem","Button","Checkbox","CheckboxSkeleton","DatePicker","Drawer","Form","FormDivider","FormItem","GlobalStyles","HeaderSkeleton","Image","ImageSkeleton","Input","InputNumber","InputPassword","InputSearch","InputSkeleton","Layout","Link","LinkButton","List","ListItem","ListItemLink","ListSkeleton","LogoLink","message","Menu","MenuDivider","MenuGroup","MenuItem","Modal","Navigation","NavigationItem","PageContent","PageHeader","PageHeaderInputSearch","PageHeaderSkeleton","ParagraphSkeleton","Popover","Progress","RadioGroup","Result","ScrollButton","Select","Skeleton","Switch","SwitchSkeleton","Tag","TagLink","TagList","TagListSkeleton","TagSkeleton","TextArea","TextAreaSkeleton","ThemeSwitcher","YouTubeVideo"],"sources":["../../src/index.ts"],"sourcesContent":["export { default as Alert } from './Alert';\nexport { default as Avatar } from './Avatar';\nexport { default as AvatarSkeleton } from './AvatarSkeleton';\nexport { default as Breadcrumb } from './Breadcrumb';\nexport { default as BreadcrumbItem } from './BreadcrumbItem';\nexport { default as Button } from './Button';\nexport { default as Checkbox } from './Checkbox';\nexport { default as CheckboxSkeleton } from './CheckboxSkeleton';\nexport { default as DatePicker } from './DatePicker';\nexport { default as Drawer } from './Drawer';\nexport { default as Form } from './Form';\nexport { default as FormDivider } from './FormDivider';\nexport { default as FormItem } from './FormItem';\nexport { default as GlobalStyles } from './GlobalStyles';\nexport { default as HeaderSkeleton } from './HeaderSkeleton';\nexport { default as Image } from './Image';\nexport { default as ImageSkeleton } from './ImageSkeleton';\nexport { default as Input } from './Input';\nexport { default as InputNumber } from './InputNumber';\nexport { default as InputPassword } from './InputPassword';\nexport { default as InputSearch } from './InputSearch';\nexport { default as InputSkeleton } from './InputSkeleton';\nexport { default as Layout } from './Layout';\nexport { default as Link } from './Link';\nexport { default as LinkButton } from './LinkButton';\nexport { default as List } from './List';\nexport { default as ListItem } from './ListItem';\nexport { default as ListItemLink } from './ListItemLink';\nexport { default as ListSkeleton } from './ListSkeleton';\nexport { default as LogoLink } from './LogoLink';\nexport { default as message } from './message';\nexport { default as Menu } from './Menu';\nexport { default as MenuDivider } from './MenuDivider';\nexport { default as MenuGroup } from './MenuGroup';\nexport { default as MenuItem } from './MenuItem';\nexport { default as Modal } from './Modal';\nexport { default as Navigation } from './Navigation';\nexport { default as NavigationItem } from './NavigationItem';\nexport { default as PageContent } from './PageContent';\nexport { default as PageHeader } from './PageHeader';\nexport { default as PageHeaderInputSearch } from './PageHeaderInputSearch';\nexport { default as PageHeaderSkeleton } from './PageHeaderSkeleton';\nexport { default as ParagraphSkeleton } from './ParagraphSkeleton';\nexport { default as Popover } from './Popover';\nexport { default as Progress } from './Progress';\nexport { default as RadioGroup } from './RadioGroup';\nexport { default as Result } from './Result';\nexport { default as ScrollButton } from './ScrollButton';\nexport { default as Select } from './Select';\nexport { default as Skeleton } from './Skeleton';\nexport { default as Switch } from './Switch';\nexport { default as SwitchSkeleton } from './SwitchSkeleton';\nexport { default as Tag } from './Tag';\nexport { default as TagLink } from './TagLink';\nexport { default as TagList } from './TagList';\nexport { default as TagListSkeleton } from './TagListSkeleton';\nexport { default as TagSkeleton } from './TagSkeleton';\nexport { default as TextArea } from './TextArea';\nexport { default as TextAreaSkeleton } from './TextAreaSkeleton';\nexport { default as ThemeSwitcher } from './ThemeSwitcher';\nexport { default as YouTubeVideo } from './YouTubeVideo';\n\nexport * from './Alert';\nexport * from './Avatar';\nexport * from './AvatarSkeleton';\nexport * from './Breadcrumb';\nexport * from './BreadcrumbItem';\nexport * from './Button';\nexport * from './Checkbox';\nexport * from './CheckboxSkeleton';\nexport * from './DatePicker';\nexport * from './Drawer';\nexport * from './Form';\nexport * from './FormDivider';\nexport * from './FormItem';\nexport * from './HeaderSkeleton';\nexport * from './Image';\nexport * from './ImageSkeleton';\nexport * from './Input';\nexport * from './InputNumber';\nexport * from './InputPassword';\nexport * from './InputSearch';\nexport * from './InputSkeleton';\nexport * from './Layout';\nexport * from './Link';\nexport * from './LinkButton';\nexport * from './List';\nexport * from './ListItem';\nexport * from './ListItemLink';\nexport * from './ListSkeleton';\nexport * from './LogoLink';\nexport * from './Menu';\nexport * from './MenuDivider';\nexport * from './MenuGroup';\nexport * from './MenuItem';\nexport * from './Modal';\nexport * from './Navigation';\nexport * from './NavigationItem';\nexport * from './PageContent';\nexport * from './PageHeader';\nexport * from './PageHeaderInputSearch';\nexport * from './PageHeaderSkeleton';\nexport * from './ParagraphSkeleton';\nexport * from './Popover';\nexport * from './Progress';\nexport * from './RadioGroup';\nexport * from './Result';\nexport * from './ScrollButton';\nexport * from './Select';\nexport * from './Skeleton';\nexport * from './Switch';\nexport * from './SwitchSkeleton';\nexport * from './Tag';\nexport * from './TagLink';\nexport * from './TagList';\nexport * from './TagListSkeleton';\nexport * from './TagSkeleton';\nexport * from './TextArea';\nexport * from './TextAreaSkeleton';\nexport * from './ThemeSwitcher';\nexport * from './YouTubeVideo';\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["default","Alert","Avatar","AvatarSkeleton","Breadcrumb","BreadcrumbItem","Button","Checkbox","CheckboxSkeleton","DatePicker","Drawer","Form","FormDivider","FormItem","Gallery","GlobalStyles","HeaderSkeleton","Image","ImageSkeleton","Input","InputNumber","InputPassword","InputSearch","InputSkeleton","Layout","Link","LinkButton","List","ListItem","ListItemLink","ListSkeleton","LogoLink","message","Menu","MenuDivider","MenuGroup","MenuItem","Modal","Navigation","NavigationItem","PageContent","PageHeader","PageHeaderInputSearch","PageHeaderSkeleton","ParagraphSkeleton","Popover","Progress","RadioGroup","Result","ScrollButton","Select","Skeleton","Switch","SwitchSkeleton","Tag","TagLink","TagList","TagListSkeleton","TagSkeleton","TextArea","TextAreaSkeleton","ThemeSwitcher","Video"],"sources":["../../src/index.ts"],"sourcesContent":["export { default as Alert } from './Alert';\nexport { default as Avatar } from './Avatar';\nexport { default as AvatarSkeleton } from './AvatarSkeleton';\nexport { default as Breadcrumb } from './Breadcrumb';\nexport { default as BreadcrumbItem } from './BreadcrumbItem';\nexport { default as Button } from './Button';\nexport { default as Checkbox } from './Checkbox';\nexport { default as CheckboxSkeleton } from './CheckboxSkeleton';\nexport { default as DatePicker } from './DatePicker';\nexport { default as Drawer } from './Drawer';\nexport { default as Form } from './Form';\nexport { default as FormDivider } from './FormDivider';\nexport { default as FormItem } from './FormItem';\nexport { default as Gallery } from './Gallery';\nexport { default as GlobalStyles } from './GlobalStyles';\nexport { default as HeaderSkeleton } from './HeaderSkeleton';\nexport { default as Image } from './Image';\nexport { default as ImageSkeleton } from './ImageSkeleton';\nexport { default as Input } from './Input';\nexport { default as InputNumber } from './InputNumber';\nexport { default as InputPassword } from './InputPassword';\nexport { default as InputSearch } from './InputSearch';\nexport { default as InputSkeleton } from './InputSkeleton';\nexport { default as Layout } from './Layout';\nexport { default as Link } from './Link';\nexport { default as LinkButton } from './LinkButton';\nexport { default as List } from './List';\nexport { default as ListItem } from './ListItem';\nexport { default as ListItemLink } from './ListItemLink';\nexport { default as ListSkeleton } from './ListSkeleton';\nexport { default as LogoLink } from './LogoLink';\nexport { default as message } from './message';\nexport { default as Menu } from './Menu';\nexport { default as MenuDivider } from './MenuDivider';\nexport { default as MenuGroup } from './MenuGroup';\nexport { default as MenuItem } from './MenuItem';\nexport { default as Modal } from './Modal';\nexport { default as Navigation } from './Navigation';\nexport { default as NavigationItem } from './NavigationItem';\nexport { default as PageContent } from './PageContent';\nexport { default as PageHeader } from './PageHeader';\nexport { default as PageHeaderInputSearch } from './PageHeaderInputSearch';\nexport { default as PageHeaderSkeleton } from './PageHeaderSkeleton';\nexport { default as ParagraphSkeleton } from './ParagraphSkeleton';\nexport { default as Popover } from './Popover';\nexport { default as Progress } from './Progress';\nexport { default as RadioGroup } from './RadioGroup';\nexport { default as Result } from './Result';\nexport { default as ScrollButton } from './ScrollButton';\nexport { default as Select } from './Select';\nexport { default as Skeleton } from './Skeleton';\nexport { default as Switch } from './Switch';\nexport { default as SwitchSkeleton } from './SwitchSkeleton';\nexport { default as Tag } from './Tag';\nexport { default as TagLink } from './TagLink';\nexport { default as TagList } from './TagList';\nexport { default as TagListSkeleton } from './TagListSkeleton';\nexport { default as TagSkeleton } from './TagSkeleton';\nexport { default as TextArea } from './TextArea';\nexport { default as TextAreaSkeleton } from './TextAreaSkeleton';\nexport { default as ThemeSwitcher } from './ThemeSwitcher';\nexport { default as Video } from './Video';\n\nexport * from './Alert';\nexport * from './Avatar';\nexport * from './AvatarSkeleton';\nexport * from './Breadcrumb';\nexport * from './BreadcrumbItem';\nexport * from './Button';\nexport * from './Checkbox';\nexport * from './CheckboxSkeleton';\nexport * from './DatePicker';\nexport * from './Drawer';\nexport * from './Form';\nexport * from './FormDivider';\nexport * from './FormItem';\nexport * from './Gallery';\nexport * from './HeaderSkeleton';\nexport * from './Image';\nexport * from './ImageSkeleton';\nexport * from './Input';\nexport * from './InputNumber';\nexport * from './InputPassword';\nexport * from './InputSearch';\nexport * from './InputSkeleton';\nexport * from './Layout';\nexport * from './Link';\nexport * from './LinkButton';\nexport * from './List';\nexport * from './ListItem';\nexport * from './ListItemLink';\nexport * from './ListSkeleton';\nexport * from './LogoLink';\nexport * from './Menu';\nexport * from './MenuDivider';\nexport * from './MenuGroup';\nexport * from './MenuItem';\nexport * from './Modal';\nexport * from './Navigation';\nexport * from './NavigationItem';\nexport * from './PageContent';\nexport * from './PageHeader';\nexport * from './PageHeaderInputSearch';\nexport * from './PageHeaderSkeleton';\nexport * from './ParagraphSkeleton';\nexport * from './Popover';\nexport * from './Progress';\nexport * from './RadioGroup';\nexport * from './Result';\nexport * from './ScrollButton';\nexport * from './Select';\nexport * from './Skeleton';\nexport * from './Switch';\nexport * from './SwitchSkeleton';\nexport * from './Tag';\nexport * from './TagLink';\nexport * from './TagList';\nexport * from './TagListSkeleton';\nexport * from './TagSkeleton';\nexport * from './TextArea';\nexport * from './TextAreaSkeleton';\nexport * from './ThemeSwitcher';\nexport * from './Video';\n"],"mappings":"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"}

package/dist/types/Gallery/Status.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+interface StatusProps {
+    count: number;
+    current: number;
+    height: number;
+}
+declare const Status: React.FC<StatusProps>;
+export default Status;
+//# sourceMappingURL=Status.d.ts.map

package/dist/types/Gallery/Status.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Status.d.ts","sourceRoot":"","sources":["../../../src/Gallery/Status.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,UAAU,WAAW;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;CAChB;AAqCD,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAajC,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/types/Gallery/index.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { ImageProps } from '../Image';
+declare type JsxDivProps = Omit<JSX.IntrinsicElements['div'], 'ref'>;
+export interface GalleryProps extends JsxDivProps {
+    urls: string[] | ReadonlyArray<string>;
+    aspectRatio?: [number, number];
+    help?: string;
+    imageProps?: Omit<ImageProps, 'url'>;
+    children?: React.ReactNode;
+}
+declare const Gallery: React.FC<GalleryProps>;
+export default Gallery;
+//# sourceMappingURL=index.d.ts.map

package/dist/types/Gallery/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Gallery/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAQN,MAAM,OAAO,CAAC;AACf,OAAc,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AA6C7C,aAAK,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;AAC7D,MAAM,WAAW,YAAa,SAAQ,WAAW;IAI/C,IAAI,EAAE,MAAM,EAAE,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IAKvC,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAI/B,IAAI,CAAC,EAAE,MAAM,CAAC;IAId,UAAU,CAAC,EAAE,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IAKrC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAMD,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CA0FnC,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/types/Select/SelectToggle.d.ts

@@ -27,6 +27,7 @@ export declare const Container: import("@emotion/styled").StyledComponent<{
 interface ContentProps {
     hasLeft?: boolean;
     hasRight?: boolean;
+    unbordered?: boolean;
 }
 export declare const Content: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;

package/dist/types/Select/SelectToggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectToggle.d.ts","sourceRoot":"","sources":["../../../src/Select/SelectToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAapD,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,UAAU,iBAAiB;IACzB,aAAa,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACvD,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,EAAE,YAAY,CAAC;CACtB;AAED,eAAO,MAAM,SAAS;;;qFAKrB,CAAC;AAcF,UAAU,YAAY;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AACD,eAAO,MAAM,OAAO;;;oGAQnB,CAAC;AAEF,eAAO,MAAM,WAAW;;;uFAGvB,CAAC;AAeF,aAAK,UAAU,GAAG,IAAI,CAAC,iBAAiB,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC;AACrE,eAAO,MAAM,KAAK;;;oGAQjB,CAAC;AAsDF,UAAU,kBAAkB;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AACD,eAAO,MAAM,aAAa;;;4GAOzB,CAAC;AAEF,eAAO,MAAM,SAAS;;UAErB,CAAC;AAEF,UAAU,UAAU;IAClB,UAAU,EAAE,OAAO,CAAC;CACrB;AAYD,eAAO,MAAM,SAAS;;;;;UAOrB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;UAOtB,CAAC;AAEF,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAqJ7C,CAAC;AAIF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"SelectToggle.d.ts","sourceRoot":"","sources":["../../../src/Select/SelectToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAapD,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAErD,UAAU,iBAAiB;IACzB,aAAa,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACvD,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,EAAE,YAAY,CAAC;CACtB;AAED,eAAO,MAAM,SAAS;;;qFAKrB,CAAC;AAeF,UAAU,YAAY;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AACD,eAAO,MAAM,OAAO;;;oGAQnB,CAAC;AAEF,eAAO,MAAM,WAAW;;;uFAGvB,CAAC;AAeF,aAAK,UAAU,GAAG,IAAI,CAAC,iBAAiB,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC;AACrE,eAAO,MAAM,KAAK;;;oGAQjB,CAAC;AAsDF,UAAU,kBAAkB;IAC1B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AACD,eAAO,MAAM,aAAa;;;4GAOzB,CAAC;AAEF,eAAO,MAAM,SAAS;;UAErB,CAAC;AAEF,UAAU,UAAU;IAClB,UAAU,EAAE,OAAO,CAAC;CACrB;AAYD,eAAO,MAAM,SAAS;;;;;UAOrB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;UAOtB,CAAC;AAEF,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAqJ7C,CAAC;AAIF,eAAe,YAAY,CAAC"}

package/dist/types/Video/index.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare type JsxIFrameProps = Omit<JSX.IntrinsicElements['iframe'], 'ref'>;
+export declare type VideoProps = JsxIFrameProps;
+declare const Video: React.ForwardRefExoticComponent<JsxIFrameProps & React.RefAttributes<HTMLIFrameElement>>;
+export default Video;
+//# sourceMappingURL=index.d.ts.map

package/dist/types/Video/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Video/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,aAAK,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,CAAC;AACnE,oBAAY,UAAU,GAAG,cAAc,CAAC;AAmBxC,QAAA,MAAM,KAAK,0FAYV,CAAC;AAIF,eAAe,KAAK,CAAC"}

package/dist/types/index.d.ts

@@ -11,6 +11,7 @@ export { default as Drawer } from './Drawer';
 export { default as Form } from './Form';
 export { default as FormDivider } from './FormDivider';
 export { default as FormItem } from './FormItem';
+export { default as Gallery } from './Gallery';
 export { default as GlobalStyles } from './GlobalStyles';
 export { default as HeaderSkeleton } from './HeaderSkeleton';
 export { default as Image } from './Image';
@@ -58,7 +59,7 @@ export { default as TagSkeleton } from './TagSkeleton';
 export { default as TextArea } from './TextArea';
 export { default as TextAreaSkeleton } from './TextAreaSkeleton';
 export { default as ThemeSwitcher } from './ThemeSwitcher';
-export { default as YouTubeVideo } from './YouTubeVideo';
+export { default as Video } from './Video';
 export * from './Alert';
 export * from './Avatar';
 export * from './AvatarSkeleton';
@@ -72,6 +73,7 @@ export * from './Drawer';
 export * from './Form';
 export * from './FormDivider';
 export * from './FormItem';
+export * from './Gallery';
 export * from './HeaderSkeleton';
 export * from './Image';
 export * from './ImageSkeleton';
@@ -117,5 +119,5 @@ export * from './TagSkeleton';
 export * from './TextArea';
 export * from './TextAreaSkeleton';
 export * from './ThemeSwitcher';
-export * from './YouTubeVideo';
+export * from './Video';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@os-design/core",
-  "version": "1.0.143",
+  "version": "1.0.147",
   "license": "UNLICENSED",
   "repository": "git@gitlab.com:os-team/libs/os-design.git",
   "main": "dist/cjs/index.js",
@@ -29,15 +29,15 @@
     "access": "public"
   },
   "dependencies": {
-    "@os-design/date-picker-utils": "^1.0.8",
-    "@os-design/icons": "^1.0.37",
-    "@os-design/input-number-utils": "^1.0.15",
-    "@os-design/media": "^1.0.14",
-    "@os-design/menu-utils": "^1.0.9",
-    "@os-design/portal": "^1.0.4",
-    "@os-design/styles": "^1.0.35",
-    "@os-design/theming": "^1.0.33",
-    "@os-design/utils": "^1.0.50",
+    "@os-design/date-picker-utils": "^1.0.9",
+    "@os-design/icons": "^1.0.39",
+    "@os-design/input-number-utils": "^1.0.16",
+    "@os-design/media": "^1.0.15",
+    "@os-design/menu-utils": "^1.0.10",
+    "@os-design/portal": "^1.0.5",
+    "@os-design/styles": "^1.0.37",
+    "@os-design/theming": "^1.0.35",
+    "@os-design/utils": "^1.0.52",
     "@os-team/password-score": "^1.0.3",
     "facepaint": "^1.2.1",
     "react-focus-lock": "^2.9.1",
@@ -57,5 +57,5 @@
     "react": ">=18",
     "react-dom": ">=18"
   },
-  "gitHead": "3fbab69122bb1ffb06fd786253aa36c011374d34"
+  "gitHead": "174987fc6c9d55db201be10abde3a4cf5a790573"
 }

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["Container","styled","div","IFrame","iframe","YouTubeVideo","forwardRef","ref","id","rest","displayName"],"sources":["../../../src/YouTubeVideo/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport styled from '@emotion/styled';\n\ntype JsxIFrameProps = Omit<JSX.IntrinsicElements['iframe'], 'src' | 'ref'>;\nexport interface YouTubeVideoProps extends JsxIFrameProps {\n  /**\n   * ID of the YouTube video.\n   */\n  id: string;\n}\n\nconst Container = styled.div`\n  position: relative;\n  padding-bottom: 56.25%; // 16:9\n  height: 0;\n`;\n\nconst IFrame = styled.iframe`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n`;\n\n/**\n * The YouTube video player.\n */\nconst YouTubeVideo = forwardRef<HTMLIFrameElement, YouTubeVideoProps>(\n  ({ id, ...rest }, ref) => (\n    <Container>\n      <IFrame\n        src={`https://www.youtube.com/embed/${id}`}\n        frameBorder={0}\n        allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture'\n        allowFullScreen\n        {...rest}\n        ref={ref}\n      />\n    </Container>\n  )\n);\n\nYouTubeVideo.displayName = 'YouTubeVideo';\n\nexport default YouTubeVideo;\n"],"mappings":";;;;;;;;;AAAA;;AACA;;;;;;;;;;;;;;;;;;;;AAUA,IAAMA,SAAS,GAAGC,kBAAA,CAAOC,GAAV,+IAAf;;AAMA,IAAMC,MAAM,GAAGF,kBAAA,CAAOG,MAAV,wJAAZ;AAQA;AACA;AACA;;;AACA,IAAMC,YAAY,gBAAG,IAAAC,iBAAA,EACnB,gBAAkBC,GAAlB;EAAA,IAAGC,EAAH,QAAGA,EAAH;EAAA,IAAUC,IAAV;;EAAA,oBACE,gCAAC,SAAD,qBACE,gCAAC,MAAD;IACE,GAAG,0CAAmCD,EAAnC,CADL;IAEE,WAAW,EAAE,CAFf;IAGE,KAAK,EAAC,0FAHR;IAIE,eAAe;EAJjB,GAKMC,IALN;IAME,GAAG,EAAEF;EANP,GADF,CADF;AAAA,CADmB,CAArB;AAeAF,YAAY,CAACK,WAAb,GAA2B,cAA3B;eAEeL,Y"}

package/dist/esm/YouTubeVideo/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["React","forwardRef","styled","Container","div","IFrame","iframe","YouTubeVideo","id","rest","ref","displayName"],"sources":["../../../src/YouTubeVideo/index.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport styled from '@emotion/styled';\n\ntype JsxIFrameProps = Omit<JSX.IntrinsicElements['iframe'], 'src' | 'ref'>;\nexport interface YouTubeVideoProps extends JsxIFrameProps {\n  /**\n   * ID of the YouTube video.\n   */\n  id: string;\n}\n\nconst Container = styled.div`\n  position: relative;\n  padding-bottom: 56.25%; // 16:9\n  height: 0;\n`;\n\nconst IFrame = styled.iframe`\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n`;\n\n/**\n * The YouTube video player.\n */\nconst YouTubeVideo = forwardRef<HTMLIFrameElement, YouTubeVideoProps>(\n  ({ id, ...rest }, ref) => (\n    <Container>\n      <IFrame\n        src={`https://www.youtube.com/embed/${id}`}\n        frameBorder={0}\n        allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture'\n        allowFullScreen\n        {...rest}\n        ref={ref}\n      />\n    </Container>\n  )\n);\n\nYouTubeVideo.displayName = 'YouTubeVideo';\n\nexport default YouTubeVideo;\n"],"mappings":";;AAAA,OAAOA,KAAP,IAAgBC,UAAhB,QAAkC,OAAlC;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AAUA,MAAMC,SAAS,GAAGD,MAAM,CAACE,GAAI;AAC7B;AACA;AACA;AACA,CAJA;AAMA,MAAMC,MAAM,GAAGH,MAAM,CAACI,MAAO;AAC7B;AACA;AACA;AACA;AACA;AACA,CANA;AAQA;AACA;AACA;;AACA,MAAMC,YAAY,gBAAGN,UAAU,CAC7B,CAAC;EAAEO,EAAF;EAAM,GAAGC;AAAT,CAAD,EAAkBC,GAAlB,kBACE,oBAAC,SAAD,qBACE,oBAAC,MAAD;EACE,GAAG,EAAG,iCAAgCF,EAAG,EAD3C;EAEE,WAAW,EAAE,CAFf;EAGE,KAAK,EAAC,0FAHR;EAIE,eAAe;AAJjB,GAKMC,IALN;EAME,GAAG,EAAEC;AANP,GADF,CAF2B,CAA/B;AAeAH,YAAY,CAACI,WAAb,GAA2B,cAA3B;AAEA,eAAeJ,YAAf"}

package/dist/types/YouTubeVideo/index.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-declare type JsxIFrameProps = Omit<JSX.IntrinsicElements['iframe'], 'src' | 'ref'>;
-export interface YouTubeVideoProps extends JsxIFrameProps {
-    id: string;
-}
-declare const YouTubeVideo: React.ForwardRefExoticComponent<YouTubeVideoProps & React.RefAttributes<HTMLIFrameElement>>;
-export default YouTubeVideo;
-//# sourceMappingURL=index.d.ts.map

package/dist/types/YouTubeVideo/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/YouTubeVideo/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,aAAK,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC,CAAC;AAC3E,MAAM,WAAW,iBAAkB,SAAQ,cAAc;IAIvD,EAAE,EAAE,MAAM,CAAC;CACZ;AAmBD,QAAA,MAAM,YAAY,6FAajB,CAAC;AAIF,eAAe,YAAY,CAAC"}