@tecsinapse/react-web-kit 1.21.3 → 1.22.0

package/esm/components/molecules/Menubar/Menubar.js

@@ -1,138 +1,127 @@
-var _excluded = ["leftComponents", "rightComponents", "searchPlaceholder", "options", "mostUsed", "mostUsedLabel", "searchResultsLabel", "searchable"];
-
-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; }
-
 import React, { useRef } from 'react';
-import { Icon, Text, useDebouncedState } from '@tecsinapse/react-core';
+import { useDebouncedState, Icon, Text } from '@tecsinapse/react-core';
 import { Transition } from 'react-transition-group';
-import { StyledIconInput, StyledMenuBar, StyledMenuButton, StyledContainerOpenMenu, StyledInput, StyledInputContainer, StyledSearchResultsContainer, StyledSearchTextContainer } from "./styled";
-import { MostUsed } from "./MostUsed";
-import { MenuBlock } from "./MenuBlock";
-import { SearchResultItem } from "./SearchResultItem";
-import { filterAndTransform } from "./utils";
-import { getContainerOpenMenuStyles, getInputContainerStyles } from "./animations";
-import { useClickAwayListener } from "../../../hooks";
-
-var Menubar = function Menubar(_ref) {
-  var leftComponents = _ref.leftComponents,
-      rightComponents = _ref.rightComponents,
-      _ref$searchPlaceholde = _ref.searchPlaceholder,
-      searchPlaceholder = _ref$searchPlaceholde === void 0 ? 'O quê você deseja buscar?' : _ref$searchPlaceholde,
-      options = _ref.options,
-      mostUsed = _ref.mostUsed,
-      _ref$mostUsedLabel = _ref.mostUsedLabel,
-      mostUsedLabel = _ref$mostUsedLabel === void 0 ? 'Mais acessados' : _ref$mostUsedLabel,
-      _ref$searchResultsLab = _ref.searchResultsLabel,
-      searchResultsLabel = _ref$searchResultsLab === void 0 ? 'Resultados da busca' : _ref$searchResultsLab,
-      _ref$searchable = _ref.searchable,
-      searchable = _ref$searchable === void 0 ? true : _ref$searchable,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
-  var _React$useState = React.useState(''),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      search = _React$useState2[0],
-      setSearch = _React$useState2[1];
-
-  var _React$useState3 = React.useState([]),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      results = _React$useState4[0],
-      setResults = _React$useState4[1];
-
-  var _useDebouncedState = useDebouncedState('', setSearch),
-      _useDebouncedState2 = _slicedToArray(_useDebouncedState, 2),
-      input = _useDebouncedState2[0],
-      setInput = _useDebouncedState2[1];
-
-  var _React$useState5 = React.useState(false),
-      _React$useState6 = _slicedToArray(_React$useState5, 2),
-      open = _React$useState6[0],
-      setOpen = _React$useState6[1];
-
-  var menuRef = useRef(null);
-  useClickAwayListener(menuRef, setOpen, 'mouseup');
-  var toggleOpen = React.useCallback(function () {
-    return setOpen(function (state) {
-      return !state;
-    });
-  }, [setOpen]);
-  React.useEffect(function () {
-    if (search === '') return;
+import { StyledMenuBar, StyledMenuButton, StyledInputContainer, StyledInput, StyledIconInput, StyledContainerOpenMenu, StyledSearchResultsContainer, StyledSearchTextContainer } from './styled.js';
+import MostUsed from './MostUsed/MostUsed.js';
+import MenuBlock from './MenuBlock/MenuBlock.js';
+import SearchResultItem from './SearchResultItem/SearchResultItem.js';
+import { filterAndTransform } from './utils.js';
+import { getInputContainerStyles, getContainerOpenMenuStyles } from './animations.js';
+import { useClickAwayListener } from '../../../hooks/useClickAwayListener.js';
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const Menubar = (_a) => {
+  var _b = _a, {
+    leftComponents,
+    rightComponents,
+    searchPlaceholder = "O qu\xEA voc\xEA deseja buscar?",
+    options,
+    mostUsed,
+    mostUsedLabel = "Mais acessados",
+    searchResultsLabel = "Resultados da busca",
+    searchable = true
+  } = _b, rest = __objRest(_b, [
+    "leftComponents",
+    "rightComponents",
+    "searchPlaceholder",
+    "options",
+    "mostUsed",
+    "mostUsedLabel",
+    "searchResultsLabel",
+    "searchable"
+  ]);
+  const [search, setSearch] = React.useState("");
+  const [results, setResults] = React.useState([]);
+  const [input, setInput] = useDebouncedState("", setSearch);
+  const [open, setOpen] = React.useState(false);
+  const menuRef = useRef(null);
+  useClickAwayListener(menuRef, setOpen, "mouseup");
+  const toggleOpen = React.useCallback(
+    () => setOpen((state) => !state),
+    [setOpen]
+  );
+  React.useEffect(() => {
+    if (search === "")
+      return;
     setResults(filterAndTransform(options, search));
   }, [search]);
-  return React.createElement("div", _extends({
-    ref: function ref(_ref2) {
-      return menuRef.current = _ref2;
-    }
-  }, rest), React.createElement(StyledMenuBar, null, React.createElement(StyledMenuButton, {
+  return /* @__PURE__ */ React.createElement("div", __spreadValues({
+    ref: (ref) => menuRef.current = ref
+  }, rest), /* @__PURE__ */ React.createElement(StyledMenuBar, null, /* @__PURE__ */ React.createElement(StyledMenuButton, {
     variant: "filled",
     color: "primary",
     onPress: toggleOpen
-  }, !open ? React.createElement(Icon, {
+  }, !open ? /* @__PURE__ */ React.createElement(Icon, {
     size: "deca",
     name: "menu",
     type: "material-community",
     fontColor: "light"
-  }) : React.createElement(Icon, {
+  }) : /* @__PURE__ */ React.createElement(Icon, {
     size: "deca",
     name: "close",
     type: "material-community",
     fontColor: "light"
-  })), leftComponents, React.createElement(Transition, {
-    "in": open,
+  })), leftComponents, /* @__PURE__ */ React.createElement(Transition, {
+    in: open,
     timeout: 250
-  }, function (state) {
-    return React.createElement(StyledInputContainer, {
-      style: getInputContainerStyles(state)
-    }, searchable && React.createElement(StyledInput, {
-      placeholder: searchPlaceholder,
-      leftComponent: React.createElement(StyledIconInput, null, React.createElement(Icon, {
-        name: "magnify",
-        type: "material-community"
-      })),
-      value: input,
-      onChange: setInput
-    }));
-  }), rightComponents), React.createElement(Transition, {
-    "in": open,
+  }, (state) => /* @__PURE__ */ React.createElement(StyledInputContainer, {
+    style: getInputContainerStyles(state)
+  }, searchable && /* @__PURE__ */ React.createElement(StyledInput, {
+    placeholder: searchPlaceholder,
+    leftComponent: /* @__PURE__ */ React.createElement(StyledIconInput, null, /* @__PURE__ */ React.createElement(Icon, {
+      name: "magnify",
+      type: "material-community"
+    })),
+    value: input,
+    onChange: setInput
+  }))), rightComponents), /* @__PURE__ */ React.createElement(Transition, {
+    in: open,
     timeout: 250
-  }, function (state) {
-    return React.createElement(StyledContainerOpenMenu, {
-      style: getContainerOpenMenuStyles(state)
-    }, !search ? React.createElement(React.Fragment, null, mostUsed && React.createElement(MostUsed, {
-      label: mostUsedLabel,
-      data: mostUsed,
-      toggle: toggleOpen
-    }), React.createElement(MenuBlock, {
-      options: options,
-      toggle: toggleOpen
-    })) : React.createElement(StyledSearchResultsContainer, null, React.createElement(StyledSearchTextContainer, null, React.createElement(Text, {
-      fontWeight: "bold"
-    }, searchResultsLabel)), results.map(function (result) {
-      return React.createElement(SearchResultItem, {
-        key: "".concat(result.title, "-").concat(result.category),
-        data: result,
-        searchTerm: search,
-        toggle: toggleOpen
-      });
-    })));
-  }));
+  }, (state) => /* @__PURE__ */ React.createElement(StyledContainerOpenMenu, {
+    style: getContainerOpenMenuStyles(state)
+  }, !search ? /* @__PURE__ */ React.createElement(React.Fragment, null, mostUsed && /* @__PURE__ */ React.createElement(MostUsed, {
+    label: mostUsedLabel,
+    data: mostUsed,
+    toggle: toggleOpen
+  }), /* @__PURE__ */ React.createElement(MenuBlock, {
+    options,
+    toggle: toggleOpen
+  })) : /* @__PURE__ */ React.createElement(StyledSearchResultsContainer, null, /* @__PURE__ */ React.createElement(StyledSearchTextContainer, null, /* @__PURE__ */ React.createElement(Text, {
+    fontWeight: "bold"
+  }, searchResultsLabel)), results.map((result) => /* @__PURE__ */ React.createElement(SearchResultItem, {
+    key: `${result.title}-${result.category}`,
+    data: result,
+    searchTerm: search,
+    toggle: toggleOpen
+  }))))));
 };
 
-export default Menubar;
-//# sourceMappingURL=Menubar.js.map
+export { Menubar as default };
+//# sourceMappingURL=Menubar.js.map

package/esm/components/molecules/Menubar/Menubar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Menubar.js","names":["React","useRef","Icon","Text","useDebouncedState","Transition","StyledIconInput","StyledMenuBar","StyledMenuButton","StyledContainerOpenMenu","StyledInput","StyledInputContainer","StyledSearchResultsContainer","StyledSearchTextContainer","MostUsed","MenuBlock","SearchResultItem","filterAndTransform","getContainerOpenMenuStyles","getInputContainerStyles","useClickAwayListener","Menubar","leftComponents","rightComponents","searchPlaceholder","options","mostUsed","mostUsedLabel","searchResultsLabel","searchable","rest","useState","search","setSearch","results","setResults","input","setInput","open","setOpen","menuRef","toggleOpen","useCallback","state","useEffect","ref","current","map","result","title","category"],"sources":["../../../../src/components/molecules/Menubar/Menubar.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { Icon, Text, useDebouncedState } from '@tecsinapse/react-core';\nimport { Transition } from 'react-transition-group';\nimport {\n  StyledIconInput,\n  StyledMenuBar,\n  StyledMenuButton,\n  StyledContainerOpenMenu,\n  StyledInput,\n  StyledInputContainer,\n  StyledSearchResultsContainer,\n  StyledSearchTextContainer,\n} from './styled';\nimport { MostUsedType, OptionsType } from './types';\nimport { MostUsed } from './MostUsed';\nimport { MenuBlock } from './MenuBlock';\nimport { SearchResultItem } from './SearchResultItem';\nimport { filterAndTransform } from './utils';\nimport {\n  getContainerOpenMenuStyles,\n  getInputContainerStyles,\n} from './animations';\nimport { useClickAwayListener } from '../../../hooks';\n\nexport interface MenubarProps extends React.HTMLAttributes<HTMLDivElement> {\n  options: OptionsType[];\n  leftComponents?: React.ReactNode;\n  rightComponents?: React.ReactNode;\n  /** Limited to first 4 elements */\n  mostUsed?: MostUsedType[];\n  mostUsedLabel?: string;\n  searchable?: boolean;\n  searchPlaceholder?: string;\n  searchResultsLabel?: string;\n}\n\nconst Menubar: React.FC<MenubarProps> = ({\n  leftComponents,\n  rightComponents,\n  searchPlaceholder = 'O quê você deseja buscar?',\n  options,\n  mostUsed,\n  mostUsedLabel = 'Mais acessados',\n  searchResultsLabel = 'Resultados da busca',\n  searchable = true,\n  ...rest\n}) => {\n  const [search, setSearch] = React.useState<string>('');\n  const [results, setResults] = React.useState<MostUsedType[]>([]);\n  const [input, setInput] = useDebouncedState<string>('', setSearch);\n  const [open, setOpen] = React.useState<boolean>(false);\n  const menuRef = useRef<HTMLDivElement | null>(null);\n  useClickAwayListener(menuRef, setOpen, 'mouseup');\n\n  const toggleOpen = React.useCallback(\n    () => setOpen(state => !state),\n    [setOpen]\n  );\n\n  React.useEffect(() => {\n    if (search === '') return;\n    setResults(filterAndTransform(options, search));\n  }, [search]);\n\n  return (\n    <div ref={ref => (menuRef.current = ref)} {...rest}>\n      <StyledMenuBar>\n        <StyledMenuButton variant=\"filled\" color=\"primary\" onPress={toggleOpen}>\n          {!open ? (\n            <Icon\n              size=\"deca\"\n              name=\"menu\"\n              type=\"material-community\"\n              fontColor=\"light\"\n            />\n          ) : (\n            <Icon\n              size=\"deca\"\n              name=\"close\"\n              type=\"material-community\"\n              fontColor=\"light\"\n            />\n          )}\n        </StyledMenuButton>\n        {leftComponents}\n        <Transition in={open} timeout={250}>\n          {state => (\n            <StyledInputContainer style={getInputContainerStyles(state)}>\n              {searchable && (\n                <StyledInput\n                  placeholder={searchPlaceholder}\n                  leftComponent={\n                    <StyledIconInput>\n                      <Icon name=\"magnify\" type=\"material-community\" />\n                    </StyledIconInput>\n                  }\n                  value={input}\n                  onChange={setInput}\n                />\n              )}\n            </StyledInputContainer>\n          )}\n        </Transition>\n        {rightComponents}\n      </StyledMenuBar>\n      <Transition in={open} timeout={250}>\n        {state => (\n          <StyledContainerOpenMenu style={getContainerOpenMenuStyles(state)}>\n            {!search ? (\n              <>\n                {mostUsed && (\n                  <MostUsed\n                    label={mostUsedLabel}\n                    data={mostUsed}\n                    toggle={toggleOpen}\n                  />\n                )}\n                <MenuBlock options={options} toggle={toggleOpen} />\n              </>\n            ) : (\n              <StyledSearchResultsContainer>\n                <StyledSearchTextContainer>\n                  <Text fontWeight=\"bold\">{searchResultsLabel}</Text>\n                </StyledSearchTextContainer>\n                {results.map(result => (\n                  <SearchResultItem\n                    key={`${result.title}-${result.category}`}\n                    data={result}\n                    searchTerm={search}\n                    toggle={toggleOpen}\n                  />\n                ))}\n              </StyledSearchResultsContainer>\n            )}\n          </StyledContainerOpenMenu>\n        )}\n      </Transition>\n    </div>\n  );\n};\n\nexport default Menubar;\n"],"mappings":"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"}
+{"version":3,"file":"Menubar.js","sources":["../../../../src/components/molecules/Menubar/Menubar.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { Icon, Text, useDebouncedState } from '@tecsinapse/react-core';\nimport { Transition } from 'react-transition-group';\nimport {\n  StyledIconInput,\n  StyledMenuBar,\n  StyledMenuButton,\n  StyledContainerOpenMenu,\n  StyledInput,\n  StyledInputContainer,\n  StyledSearchResultsContainer,\n  StyledSearchTextContainer,\n} from './styled';\nimport { MostUsedType, OptionsType } from './types';\nimport { MostUsed } from './MostUsed';\nimport { MenuBlock } from './MenuBlock';\nimport { SearchResultItem } from './SearchResultItem';\nimport { filterAndTransform } from './utils';\nimport {\n  getContainerOpenMenuStyles,\n  getInputContainerStyles,\n} from './animations';\nimport { useClickAwayListener } from '../../../hooks';\n\nexport interface MenubarProps extends React.HTMLAttributes<HTMLDivElement> {\n  options: OptionsType[];\n  leftComponents?: React.ReactNode;\n  rightComponents?: React.ReactNode;\n  /** Limited to first 4 elements */\n  mostUsed?: MostUsedType[];\n  mostUsedLabel?: string;\n  searchable?: boolean;\n  searchPlaceholder?: string;\n  searchResultsLabel?: string;\n}\n\nconst Menubar: React.FC<MenubarProps> = ({\n  leftComponents,\n  rightComponents,\n  searchPlaceholder = 'O quê você deseja buscar?',\n  options,\n  mostUsed,\n  mostUsedLabel = 'Mais acessados',\n  searchResultsLabel = 'Resultados da busca',\n  searchable = true,\n  ...rest\n}) => {\n  const [search, setSearch] = React.useState<string>('');\n  const [results, setResults] = React.useState<MostUsedType[]>([]);\n  const [input, setInput] = useDebouncedState<string>('', setSearch);\n  const [open, setOpen] = React.useState<boolean>(false);\n  const menuRef = useRef<HTMLDivElement | null>(null);\n  useClickAwayListener(menuRef, setOpen, 'mouseup');\n\n  const toggleOpen = React.useCallback(\n    () => setOpen(state => !state),\n    [setOpen]\n  );\n\n  React.useEffect(() => {\n    if (search === '') return;\n    setResults(filterAndTransform(options, search));\n  }, [search]);\n\n  return (\n    <div ref={ref => (menuRef.current = ref)} {...rest}>\n      <StyledMenuBar>\n        <StyledMenuButton variant=\"filled\" color=\"primary\" onPress={toggleOpen}>\n          {!open ? (\n            <Icon\n              size=\"deca\"\n              name=\"menu\"\n              type=\"material-community\"\n              fontColor=\"light\"\n            />\n          ) : (\n            <Icon\n              size=\"deca\"\n              name=\"close\"\n              type=\"material-community\"\n              fontColor=\"light\"\n            />\n          )}\n        </StyledMenuButton>\n        {leftComponents}\n        <Transition in={open} timeout={250}>\n          {state => (\n            <StyledInputContainer style={getInputContainerStyles(state)}>\n              {searchable && (\n                <StyledInput\n                  placeholder={searchPlaceholder}\n                  leftComponent={\n                    <StyledIconInput>\n                      <Icon name=\"magnify\" type=\"material-community\" />\n                    </StyledIconInput>\n                  }\n                  value={input}\n                  onChange={setInput}\n                />\n              )}\n            </StyledInputContainer>\n          )}\n        </Transition>\n        {rightComponents}\n      </StyledMenuBar>\n      <Transition in={open} timeout={250}>\n        {state => (\n          <StyledContainerOpenMenu style={getContainerOpenMenuStyles(state)}>\n            {!search ? (\n              <>\n                {mostUsed && (\n                  <MostUsed\n                    label={mostUsedLabel}\n                    data={mostUsed}\n                    toggle={toggleOpen}\n                  />\n                )}\n                <MenuBlock options={options} toggle={toggleOpen} />\n              </>\n            ) : (\n              <StyledSearchResultsContainer>\n                <StyledSearchTextContainer>\n                  <Text fontWeight=\"bold\">{searchResultsLabel}</Text>\n                </StyledSearchTextContainer>\n                {results.map(result => (\n                  <SearchResultItem\n                    key={`${result.title}-${result.category}`}\n                    data={result}\n                    searchTerm={search}\n                    toggle={toggleOpen}\n                  />\n                ))}\n              </StyledSearchResultsContainer>\n            )}\n          </StyledContainerOpenMenu>\n        )}\n      </Transition>\n    </div>\n  );\n};\n\nexport default Menubar;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCM,MAAA,OAAA,GAAkC,CAAC,EAUnC,KAAA;AAVmC,EACvC,IAAA,EAAA,GAAA,EAAA,EAAA;AAAA,IAAA,cAAA;AAAA,IACA,eAAA;AAAA,IACA,iBAAoB,GAAA,iCAAA;AAAA,IACpB,OAAA;AAAA,IACA,QAAA;AAAA,IACA,aAAgB,GAAA,gBAAA;AAAA,IAChB,kBAAqB,GAAA,qBAAA;AAAA,IACrB,UAAa,GAAA,IAAA;AAAA,GA5Cf,GAoCyC,EASpC,EAAA,IAAA,GAAA,SAAA,CAToC,EASpC,EAAA;AAAA,IARH,gBAAA;AAAA,IACA,iBAAA;AAAA,IACA,mBAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,IACA,eAAA;AAAA,IACA,oBAAA;AAAA,IACA,YAAA;AAAA,GAAA,CAAA,CAAA;AAGA,EAAA,MAAM,CAAC,MAAQ,EAAA,SAAS,CAAI,GAAA,KAAA,CAAM,SAAiB,EAAE,CAAA,CAAA;AACrD,EAAA,MAAM,CAAC,OAAS,EAAA,UAAU,IAAI,KAAM,CAAA,QAAA,CAAyB,EAAE,CAAA,CAAA;AAC/D,EAAA,MAAM,CAAC,KAAO,EAAA,QAAQ,CAAI,GAAA,iBAAA,CAA0B,IAAI,SAAS,CAAA,CAAA;AACjE,EAAA,MAAM,CAAC,IAAM,EAAA,OAAO,CAAI,GAAA,KAAA,CAAM,SAAkB,KAAK,CAAA,CAAA;AACrD,EAAM,MAAA,OAAA,GAAU,OAA8B,IAAI,CAAA,CAAA;AAClD,EAAqB,oBAAA,CAAA,OAAA,EAAS,SAAS,SAAS,CAAA,CAAA;AAEhD,EAAA,MAAM,aAAa,KAAM,CAAA,WAAA;AAAA,IACvB,MAAM,OAAA,CAAQ,CAAS,KAAA,KAAA,CAAC,KAAK,CAAA;AAAA,IAC7B,CAAC,OAAO,CAAA;AAAA,GACV,CAAA;AAEA,EAAA,KAAA,CAAM,UAAU,MAAM;AACpB,IAAA,IAAI,MAAW,KAAA,EAAA;AAAI,MAAA,OAAA;AACnB,IAAW,UAAA,CAAA,kBAAA,CAAmB,OAAS,EAAA,MAAM,CAAC,CAAA,CAAA;AAAA,GAChD,EAAG,CAAC,MAAM,CAAC,CAAA,CAAA;AAEX,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,cAAA,CAAA;AAAA,IAAI,GAAA,EAAK,CAAQ,GAAA,KAAA,OAAA,CAAQ,OAAU,GAAA,GAAA;AAAA,GAAU,EAAA,IAAA,CAAA,kBAC3C,KAAA,CAAA,aAAA,CAAA,aAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,gBAAA,EAAA;AAAA,IAAiB,OAAQ,EAAA,QAAA;AAAA,IAAS,KAAM,EAAA,SAAA;AAAA,IAAU,OAAS,EAAA,UAAA;AAAA,GACzD,EAAA,CAAC,uBACC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IACC,IAAK,EAAA,MAAA;AAAA,IACL,IAAK,EAAA,MAAA;AAAA,IACL,IAAK,EAAA,oBAAA;AAAA,IACL,SAAU,EAAA,OAAA;AAAA,GACZ,oBAEC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IACC,IAAK,EAAA,MAAA;AAAA,IACL,IAAK,EAAA,OAAA;AAAA,IACL,IAAK,EAAA,oBAAA;AAAA,IACL,SAAU,EAAA,OAAA;AAAA,GACZ,CAEJ,CACC,EAAA,cAAA,kBACA,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IAAW,EAAI,EAAA,IAAA;AAAA,IAAM,OAAS,EAAA,GAAA;AAAA,GAAA,EAC5B,2BACE,KAAA,CAAA,aAAA,CAAA,oBAAA,EAAA;AAAA,IAAqB,KAAA,EAAO,wBAAwB,KAAK,CAAA;AAAA,GAAA,EACvD,8BACE,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA;AAAA,IACC,WAAa,EAAA,iBAAA;AAAA,IACb,aAAA,kBACG,KAAA,CAAA,aAAA,CAAA,eAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,MAAK,IAAK,EAAA,SAAA;AAAA,MAAU,IAAK,EAAA,oBAAA;AAAA,KAAqB,CACjD,CAAA;AAAA,IAEF,KAAO,EAAA,KAAA;AAAA,IACP,QAAU,EAAA,QAAA;AAAA,GACZ,CAEJ,CAEJ,CACC,EAAA,eACH,mBACC,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IAAW,EAAI,EAAA,IAAA;AAAA,IAAM,OAAS,EAAA,GAAA;AAAA,GAAA,EAC5B,2BACE,KAAA,CAAA,aAAA,CAAA,uBAAA,EAAA;AAAA,IAAwB,KAAA,EAAO,2BAA2B,KAAK,CAAA;AAAA,GAAA,EAC7D,CAAC,MAAA,mBAEG,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EAAA,QAAA,oBACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAA,IACC,KAAO,EAAA,aAAA;AAAA,IACP,IAAM,EAAA,QAAA;AAAA,IACN,MAAQ,EAAA,UAAA;AAAA,GACV,mBAED,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA;AAAA,IAAU,OAAA;AAAA,IAAkB,MAAQ,EAAA,UAAA;AAAA,GAAY,CACnD,CAEA,mBAAA,KAAA,CAAA,aAAA,CAAC,4BACC,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,iDACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IAAK,UAAW,EAAA,MAAA;AAAA,GAAA,EAAQ,kBAAmB,CAC9C,CAAA,EACC,OAAQ,CAAA,GAAA,CAAI,4BACV,KAAA,CAAA,aAAA,CAAA,gBAAA,EAAA;AAAA,IACC,GAAK,EAAA,CAAA,EAAG,MAAO,CAAA,KAAA,CAAA,CAAA,EAAS,MAAO,CAAA,QAAA,CAAA,CAAA;AAAA,IAC/B,IAAM,EAAA,MAAA;AAAA,IACN,UAAY,EAAA,MAAA;AAAA,IACZ,MAAQ,EAAA,UAAA;AAAA,GACV,CACD,CACH,CAEJ,CAEJ,CACF,CAAA,CAAA;AAEJ;;;;"}

package/esm/components/molecules/Menubar/MostUsed/MostUsed.js

@@ -1,42 +1,54 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from 'react';
 import { Text } from '@tecsinapse/react-core';
-import { StyledCard, StyledCardContainer } from "./styled";
+import { StyledCardContainer, StyledCard } from './styled.js';
 
-var MostUsed = function MostUsed(_ref) {
-  var data = _ref.data,
-      label = _ref.label,
-      toggle = _ref.toggle;
-  var noTextDecoration = {
-    textDecoration: 'none'
-  };
-  return React.createElement(React.Fragment, null, React.createElement(Text, {
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const MostUsed = ({ data, label, toggle }) => {
+  const noTextDecoration = { textDecoration: "none" };
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Text, {
     fontWeight: "bold"
-  }, label), React.createElement(StyledCardContainer, null, data.slice(0, 4).map(function (_ref2) {
-    var title = _ref2.title,
-        category = _ref2.category,
-        _ref2$Component = _ref2.Component,
-        Component = _ref2$Component === void 0 ? 'a' : _ref2$Component,
-        _ref2$props = _ref2.props,
-        props = _ref2$props === void 0 ? {} : _ref2$props;
-    return React.createElement(Component, _extends({}, props, {
+  }, label), /* @__PURE__ */ React.createElement(StyledCardContainer, null, data.slice(0, 4).map(
+    ({
+      title,
+      category,
+      Component = "a",
+      props = {}
+    }) => /* @__PURE__ */ React.createElement(Component, __spreadProps(__spreadValues({}, props), {
       style: noTextDecoration,
-      key: "".concat(title, "-").concat(category),
+      key: `${title}-${category}`,
       onClick: toggle
-    }), React.createElement(StyledCard, {
+    }), /* @__PURE__ */ React.createElement(StyledCard, {
       elevated: true,
-      key: "".concat(title, "-").concat(category)
-    }, React.createElement(Text, {
+      key: `${title}-${category}`
+    }, /* @__PURE__ */ React.createElement(Text, {
       fontWeight: "bold",
       colorVariant: "primary"
-    }, title), React.createElement(Text, {
+    }, title), /* @__PURE__ */ React.createElement(Text, {
       fontWeight: "bold",
       colorVariant: "secondary",
       typography: "label"
-    }, category)));
-  })));
+    }, category)))
+  )));
 };
+var MostUsed$1 = React.memo(MostUsed);
 
-export default React.memo(MostUsed);
-//# sourceMappingURL=MostUsed.js.map
+export { MostUsed$1 as default };
+//# sourceMappingURL=MostUsed.js.map

package/esm/components/molecules/Menubar/MostUsed/MostUsed.js.map

@@ -1 +1 @@
-{"version":3,"file":"MostUsed.js","names":["React","Text","StyledCard","StyledCardContainer","MostUsed","data","label","toggle","noTextDecoration","textDecoration","slice","map","title","category","Component","props","memo"],"sources":["../../../../../src/components/molecules/Menubar/MostUsed/MostUsed.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from '@tecsinapse/react-core';\nimport { StyledCard, StyledCardContainer } from './styled';\nimport { MostUsedType } from '../types';\n\ninterface MostUsedProps {\n  data: MostUsedType[];\n  label: string;\n  toggle: () => void;\n}\n\nconst MostUsed: React.FC<MostUsedProps> = ({ data, label, toggle }) => {\n  const noTextDecoration = { textDecoration: 'none' };\n\n  return (\n    <>\n      <Text fontWeight=\"bold\">{label}</Text>\n      <StyledCardContainer>\n        {data\n          .slice(0, 4)\n          .map(\n            ({\n              title,\n              category,\n              Component = 'a',\n              props = {},\n            }: MostUsedType) => (\n              <Component\n                {...props}\n                style={noTextDecoration}\n                key={`${title}-${category}`}\n                onClick={toggle}\n              >\n                <StyledCard elevated key={`${title}-${category}`}>\n                  <Text fontWeight=\"bold\" colorVariant=\"primary\">\n                    {title}\n                  </Text>\n                  <Text\n                    fontWeight=\"bold\"\n                    colorVariant=\"secondary\"\n                    typography=\"label\"\n                  >\n                    {category}\n                  </Text>\n                </StyledCard>\n              </Component>\n            )\n          )}\n      </StyledCardContainer>\n    </>\n  );\n};\n\nexport default React.memo(MostUsed);\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,wBAArB;AACA,SAASC,UAAT,EAAqBC,mBAArB;;AASA,IAAMC,QAAiC,GAAG,SAApCA,QAAoC,OAA6B;EAAA,IAA1BC,IAA0B,QAA1BA,IAA0B;EAAA,IAApBC,KAAoB,QAApBA,KAAoB;EAAA,IAAbC,MAAa,QAAbA,MAAa;EACrE,IAAMC,gBAAgB,GAAG;IAAEC,cAAc,EAAE;EAAlB,CAAzB;EAEA,OACE,0CACE,oBAAC,IAAD;IAAM,UAAU,EAAC;EAAjB,GAAyBH,KAAzB,CADF,EAEE,oBAAC,mBAAD,QACGD,IAAI,CACFK,KADF,CACQ,CADR,EACW,CADX,EAEEC,GAFF,CAGG;IAAA,IACEC,KADF,SACEA,KADF;IAAA,IAEEC,QAFF,SAEEA,QAFF;IAAA,4BAGEC,SAHF;IAAA,IAGEA,SAHF,gCAGc,GAHd;IAAA,wBAIEC,KAJF;IAAA,IAIEA,KAJF,4BAIU,EAJV;IAAA,OAME,oBAAC,SAAD,eACMA,KADN;MAEE,KAAK,EAAEP,gBAFT;MAGE,GAAG,YAAKI,KAAL,cAAcC,QAAd,CAHL;MAIE,OAAO,EAAEN;IAJX,IAME,oBAAC,UAAD;MAAY,QAAQ,MAApB;MAAqB,GAAG,YAAKK,KAAL,cAAcC,QAAd;IAAxB,GACE,oBAAC,IAAD;MAAM,UAAU,EAAC,MAAjB;MAAwB,YAAY,EAAC;IAArC,GACGD,KADH,CADF,EAIE,oBAAC,IAAD;MACE,UAAU,EAAC,MADb;MAEE,YAAY,EAAC,WAFf;MAGE,UAAU,EAAC;IAHb,GAKGC,QALH,CAJF,CANF,CANF;EAAA,CAHH,CADH,CAFF,CADF;AAqCD,CAxCD;;AA0CA,eAAeb,KAAK,CAACgB,IAAN,CAAWZ,QAAX,CAAf"}
+{"version":3,"file":"MostUsed.js","sources":["../../../../../src/components/molecules/Menubar/MostUsed/MostUsed.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from '@tecsinapse/react-core';\nimport { StyledCard, StyledCardContainer } from './styled';\nimport { MostUsedType } from '../types';\n\ninterface MostUsedProps {\n  data: MostUsedType[];\n  label: string;\n  toggle: () => void;\n}\n\nconst MostUsed: React.FC<MostUsedProps> = ({ data, label, toggle }) => {\n  const noTextDecoration = { textDecoration: 'none' };\n\n  return (\n    <>\n      <Text fontWeight=\"bold\">{label}</Text>\n      <StyledCardContainer>\n        {data\n          .slice(0, 4)\n          .map(\n            ({\n              title,\n              category,\n              Component = 'a',\n              props = {},\n            }: MostUsedType) => (\n              <Component\n                {...props}\n                style={noTextDecoration}\n                key={`${title}-${category}`}\n                onClick={toggle}\n              >\n                <StyledCard elevated key={`${title}-${category}`}>\n                  <Text fontWeight=\"bold\" colorVariant=\"primary\">\n                    {title}\n                  </Text>\n                  <Text\n                    fontWeight=\"bold\"\n                    colorVariant=\"secondary\"\n                    typography=\"label\"\n                  >\n                    {category}\n                  </Text>\n                </StyledCard>\n              </Component>\n            )\n          )}\n      </StyledCardContainer>\n    </>\n  );\n};\n\nexport default React.memo(MostUsed);\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,WAAoC,CAAC,EAAE,IAAM,EAAA,KAAA,EAAO,QAAa,KAAA;AACrE,EAAM,MAAA,gBAAA,GAAmB,EAAE,cAAA,EAAgB,MAAO,EAAA,CAAA;AAElD,EAAA,iFAEK,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IAAK,UAAW,EAAA,MAAA;AAAA,GAAQ,EAAA,KAAM,mBAC9B,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAA,EACE,KACE,KAAM,CAAA,CAAA,EAAG,CAAC,CACV,CAAA,GAAA;AAAA,IACC,CAAC;AAAA,MACC,KAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAY,GAAA,GAAA;AAAA,MACZ,QAAQ,EAAC;AAAA,KACX,qBACG,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,aAAA,CAAA,cAAA,CAAA,EAAA,EACK,KADL,CAAA,EAAA;AAAA,MAEC,KAAO,EAAA,gBAAA;AAAA,MACP,GAAA,EAAK,GAAG,KAAS,CAAA,CAAA,EAAA,QAAA,CAAA,CAAA;AAAA,MACjB,OAAS,EAAA,MAAA;AAAA,KAAA,CAAA,kBAER,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,MAAW,QAAQ,EAAA,IAAA;AAAA,MAAC,GAAA,EAAK,GAAG,KAAS,CAAA,CAAA,EAAA,QAAA,CAAA,CAAA;AAAA,KAAA,kBACnC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,MAAK,UAAW,EAAA,MAAA;AAAA,MAAO,YAAa,EAAA,SAAA;AAAA,KAClC,EAAA,KACH,mBACC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,MACC,UAAW,EAAA,MAAA;AAAA,MACX,YAAa,EAAA,WAAA;AAAA,MACb,UAAW,EAAA,OAAA;AAAA,KAEV,EAAA,QACH,CACF,CACF,CAAA;AAAA,GAGR,CACF,CAAA,CAAA;AAEJ,CAAA,CAAA;AAEA,iBAAe,KAAA,CAAM,KAAK,QAAQ,CAAA;;;;"}

package/esm/components/molecules/Menubar/MostUsed/styled.js

@@ -1,31 +1,20 @@
-var _templateObject, _templateObject2;
+import styled from '@emotion/styled';
+import { Card } from '@tecsinapse/react-core';
+import nativeStyled from '@emotion/native';
 
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+const StyledCardContainer = styled("div")`
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    grid-column-gap: ${({ theme }) => theme.spacing.mega};
+    margin-bottom: ${({ theme }) => theme.spacing.kilo};
+    margin-top: ${({ theme }) => theme.spacing.centi};
+`;
+const StyledCard = nativeStyled(Card)`
+    padding-top: ${({ theme }) => theme.spacing.mili};
+    padding-bottom: ${({ theme }) => theme.spacing.mili};
+    padding-left: ${({ theme }) => theme.spacing.deca};
+    padding-right: ${({ theme }) => theme.spacing.deca};
+`;
 
-import { default as webStyled } from '@emotion/styled';
-import { Card } from '@tecsinapse/react-core';
-import { default as nativeStyled } from '@emotion/native';
-export var StyledCardContainer = webStyled('div')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    grid-column-gap: ", ";\n    margin-bottom: ", ";\n    margin-top: ", ";\n"])), function (_ref) {
-  var theme = _ref.theme;
-  return theme.spacing.mega;
-}, function (_ref2) {
-  var theme = _ref2.theme;
-  return theme.spacing.kilo;
-}, function (_ref3) {
-  var theme = _ref3.theme;
-  return theme.spacing.centi;
-});
-export var StyledCard = nativeStyled(Card)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    padding-top: ", ";\n    padding-bottom: ", ";\n    padding-left: ", ";\n    padding-right: ", ";\n"])), function (_ref4) {
-  var theme = _ref4.theme;
-  return theme.spacing.mili;
-}, function (_ref5) {
-  var theme = _ref5.theme;
-  return theme.spacing.mili;
-}, function (_ref6) {
-  var theme = _ref6.theme;
-  return theme.spacing.deca;
-}, function (_ref7) {
-  var theme = _ref7.theme;
-  return theme.spacing.deca;
-});
-//# sourceMappingURL=styled.js.map
+export { StyledCard, StyledCardContainer };
+//# sourceMappingURL=styled.js.map

package/esm/components/molecules/Menubar/MostUsed/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","names":["default","webStyled","Card","nativeStyled","StyledCardContainer","theme","spacing","mega","kilo","centi","StyledCard","mili","deca"],"sources":["../../../../../src/components/molecules/Menubar/MostUsed/styled.ts"],"sourcesContent":["import { default as webStyled } from '@emotion/styled';\nimport { Card, StyleProps } from '@tecsinapse/react-core';\nimport { default as nativeStyled } from '@emotion/native';\n\nexport const StyledCardContainer = webStyled('div')<Partial<StyleProps>>`\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    grid-column-gap: ${({ theme }) => theme.spacing.mega};\n    margin-bottom: ${({ theme }) => theme.spacing.kilo};\n    margin-top: ${({ theme }) => theme.spacing.centi};\n`;\n\nexport const StyledCard = nativeStyled(Card)<Partial<StyleProps>>`\n    padding-top: ${({ theme }) => theme.spacing.mili};\n    padding-bottom: ${({ theme }) => theme.spacing.mili};\n    padding-left: ${({ theme }) => theme.spacing.deca};\n    padding-right: ${({ theme }) => theme.spacing.deca};\n`;\n"],"mappings":";;;;AAAA,SAASA,OAAO,IAAIC,SAApB,QAAqC,iBAArC;AACA,SAASC,IAAT,QAAiC,wBAAjC;AACA,SAASF,OAAO,IAAIG,YAApB,QAAwC,iBAAxC;AAEA,OAAO,IAAMC,mBAAmB,GAAGH,SAAS,CAAC,KAAD,CAAZ,qNAGT;EAAA,IAAGI,KAAH,QAAGA,KAAH;EAAA,OAAeA,KAAK,CAACC,OAAN,CAAcC,IAA7B;AAAA,CAHS,EAIX;EAAA,IAAGF,KAAH,SAAGA,KAAH;EAAA,OAAeA,KAAK,CAACC,OAAN,CAAcE,IAA7B;AAAA,CAJW,EAKd;EAAA,IAAGH,KAAH,SAAGA,KAAH;EAAA,OAAeA,KAAK,CAACC,OAAN,CAAcG,KAA7B;AAAA,CALc,CAAzB;AAQP,OAAO,IAAMC,UAAU,GAAGP,YAAY,CAACD,IAAD,CAAf,gLACJ;EAAA,IAAGG,KAAH,SAAGA,KAAH;EAAA,OAAeA,KAAK,CAACC,OAAN,CAAcK,IAA7B;AAAA,CADI,EAED;EAAA,IAAGN,KAAH,SAAGA,KAAH;EAAA,OAAeA,KAAK,CAACC,OAAN,CAAcK,IAA7B;AAAA,CAFC,EAGH;EAAA,IAAGN,KAAH,SAAGA,KAAH;EAAA,OAAeA,KAAK,CAACC,OAAN,CAAcM,IAA7B;AAAA,CAHG,EAIF;EAAA,IAAGP,KAAH,SAAGA,KAAH;EAAA,OAAeA,KAAK,CAACC,OAAN,CAAcM,IAA7B;AAAA,CAJE,CAAhB"}
+{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/Menubar/MostUsed/styled.ts"],"sourcesContent":["import { default as webStyled } from '@emotion/styled';\nimport { Card, StyleProps } from '@tecsinapse/react-core';\nimport { default as nativeStyled } from '@emotion/native';\n\nexport const StyledCardContainer = webStyled('div')<Partial<StyleProps>>`\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    grid-column-gap: ${({ theme }) => theme.spacing.mega};\n    margin-bottom: ${({ theme }) => theme.spacing.kilo};\n    margin-top: ${({ theme }) => theme.spacing.centi};\n`;\n\nexport const StyledCard = nativeStyled(Card)<Partial<StyleProps>>`\n    padding-top: ${({ theme }) => theme.spacing.mili};\n    padding-bottom: ${({ theme }) => theme.spacing.mili};\n    padding-left: ${({ theme }) => theme.spacing.deca};\n    padding-right: ${({ theme }) => theme.spacing.deca};\n`;\n"],"names":["webStyled"],"mappings":";;;;AAIa,MAAA,mBAAA,GAAsBA,OAAU,KAAK,CAAA,CAAA;AAAA;AAAA;AAAA,qBAAA,EAG3B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,mBAAA,EAC/B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,gBAAA,EAChC,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,KAAA,CAAA;AAAA,EAAA;AAGlC,MAAA,UAAA,GAAa,aAAa,IAAI,CAAA,CAAA;AAAA,iBAAA,EACxB,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,oBAAA,EAC1B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,kBAAA,EAC/B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,mBAAA,EAC5B,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA;;;;"}

package/esm/components/molecules/Menubar/SearchResultItem/SearchResultItem.js

@@ -1,33 +1,43 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from 'react';
 import { Text } from '@tecsinapse/react-core';
-import { StyledSearchItemContainer, HighlightText } from "./styled";
-import { highlight } from "./utils";
+import { StyledSearchItemContainer, HighlightText } from './styled.js';
+import { highlight } from './utils.js';
 
-var SearchResultItem = function SearchResultItem(_ref) {
-  var data = _ref.data,
-      searchTerm = _ref.searchTerm,
-      toggle = _ref.toggle;
-  var title = data.title,
-      category = data.category,
-      Component = data.Component,
-      props = data.props;
-  var noTextDecoration = {
-    textDecoration: 'none'
-  };
-  var textProps = {
-    fontColor: 'orange',
-    fontWeight: 'bold'
-  };
-  return React.createElement(Component, _extends({}, props, {
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const SearchResultItem = ({
+  data,
+  searchTerm,
+  toggle
+}) => {
+  const { title, category, Component, props } = data;
+  const noTextDecoration = { textDecoration: "none" };
+  const textProps = { fontColor: "orange", fontWeight: "bold" };
+  return /* @__PURE__ */ React.createElement(Component, __spreadProps(__spreadValues({}, props), {
     style: noTextDecoration,
     onClick: toggle
-  }), React.createElement(StyledSearchItemContainer, null, React.createElement(Text, {
+  }), /* @__PURE__ */ React.createElement(StyledSearchItemContainer, null, /* @__PURE__ */ React.createElement(Text, {
     typography: "base",
     colorVariant: "secondary",
     colorTone: "dark"
-  }, highlight(searchTerm, title, HighlightText, textProps)), React.createElement(Text, {
+  }, highlight(searchTerm, title, HighlightText, textProps)), /* @__PURE__ */ React.createElement(Text, {
     typography: "sub",
     fontWeight: "bold",
     colorVariant: "secondary",
@@ -35,5 +45,5 @@ var SearchResultItem = function SearchResultItem(_ref) {
   }, category)));
 };
 
-export default SearchResultItem;
-//# sourceMappingURL=SearchResultItem.js.map
+export { SearchResultItem as default };
+//# sourceMappingURL=SearchResultItem.js.map

package/esm/components/molecules/Menubar/SearchResultItem/SearchResultItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchResultItem.js","names":["React","Text","StyledSearchItemContainer","HighlightText","highlight","SearchResultItem","data","searchTerm","toggle","title","category","Component","props","noTextDecoration","textDecoration","textProps","fontColor","fontWeight"],"sources":["../../../../../src/components/molecules/Menubar/SearchResultItem/SearchResultItem.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, TextProps } from '@tecsinapse/react-core';\nimport { MostUsedType } from '../types';\nimport { StyledSearchItemContainer, HighlightText } from './styled';\nimport { highlight } from './utils';\n\ninterface SearchResultItem {\n  data: MostUsedType;\n  searchTerm: string;\n  toggle: () => void;\n}\n\nconst SearchResultItem: React.FC<SearchResultItem> = ({\n  data,\n  searchTerm,\n  toggle,\n}) => {\n  const { title, category, Component, props } = data;\n  const noTextDecoration = { textDecoration: 'none' };\n\n  const textProps: TextProps = { fontColor: 'orange', fontWeight: 'bold' };\n\n  return (\n    <Component {...props} style={noTextDecoration} onClick={toggle}>\n      <StyledSearchItemContainer>\n        <Text typography=\"base\" colorVariant=\"secondary\" colorTone=\"dark\">\n          {highlight(searchTerm, title, HighlightText, textProps)}\n        </Text>\n        <Text\n          typography=\"sub\"\n          fontWeight=\"bold\"\n          colorVariant=\"secondary\"\n          colorTone=\"medium\"\n        >\n          {category}\n        </Text>\n      </StyledSearchItemContainer>\n    </Component>\n  );\n};\n\nexport default SearchResultItem;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAgC,wBAAhC;AAEA,SAASC,yBAAT,EAAoCC,aAApC;AACA,SAASC,SAAT;;AAQA,IAAMC,gBAA4C,GAAG,SAA/CA,gBAA+C,OAI/C;EAAA,IAHJC,IAGI,QAHJA,IAGI;EAAA,IAFJC,UAEI,QAFJA,UAEI;EAAA,IADJC,MACI,QADJA,MACI;EACJ,IAAQC,KAAR,GAA8CH,IAA9C,CAAQG,KAAR;EAAA,IAAeC,QAAf,GAA8CJ,IAA9C,CAAeI,QAAf;EAAA,IAAyBC,SAAzB,GAA8CL,IAA9C,CAAyBK,SAAzB;EAAA,IAAoCC,KAApC,GAA8CN,IAA9C,CAAoCM,KAApC;EACA,IAAMC,gBAAgB,GAAG;IAAEC,cAAc,EAAE;EAAlB,CAAzB;EAEA,IAAMC,SAAoB,GAAG;IAAEC,SAAS,EAAE,QAAb;IAAuBC,UAAU,EAAE;EAAnC,CAA7B;EAEA,OACE,oBAAC,SAAD,eAAeL,KAAf;IAAsB,KAAK,EAAEC,gBAA7B;IAA+C,OAAO,EAAEL;EAAxD,IACE,oBAAC,yBAAD,QACE,oBAAC,IAAD;IAAM,UAAU,EAAC,MAAjB;IAAwB,YAAY,EAAC,WAArC;IAAiD,SAAS,EAAC;EAA3D,GACGJ,SAAS,CAACG,UAAD,EAAaE,KAAb,EAAoBN,aAApB,EAAmCY,SAAnC,CADZ,CADF,EAIE,oBAAC,IAAD;IACE,UAAU,EAAC,KADb;IAEE,UAAU,EAAC,MAFb;IAGE,YAAY,EAAC,WAHf;IAIE,SAAS,EAAC;EAJZ,GAMGL,QANH,CAJF,CADF,CADF;AAiBD,CA3BD;;AA6BA,eAAeL,gBAAf"}
+{"version":3,"file":"SearchResultItem.js","sources":["../../../../../src/components/molecules/Menubar/SearchResultItem/SearchResultItem.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, TextProps } from '@tecsinapse/react-core';\nimport { MostUsedType } from '../types';\nimport { StyledSearchItemContainer, HighlightText } from './styled';\nimport { highlight } from './utils';\n\ninterface SearchResultItem {\n  data: MostUsedType;\n  searchTerm: string;\n  toggle: () => void;\n}\n\nconst SearchResultItem: React.FC<SearchResultItem> = ({\n  data,\n  searchTerm,\n  toggle,\n}) => {\n  const { title, category, Component, props } = data;\n  const noTextDecoration = { textDecoration: 'none' };\n\n  const textProps: TextProps = { fontColor: 'orange', fontWeight: 'bold' };\n\n  return (\n    <Component {...props} style={noTextDecoration} onClick={toggle}>\n      <StyledSearchItemContainer>\n        <Text typography=\"base\" colorVariant=\"secondary\" colorTone=\"dark\">\n          {highlight(searchTerm, title, HighlightText, textProps)}\n        </Text>\n        <Text\n          typography=\"sub\"\n          fontWeight=\"bold\"\n          colorVariant=\"secondary\"\n          colorTone=\"medium\"\n        >\n          {category}\n        </Text>\n      </StyledSearchItemContainer>\n    </Component>\n  );\n};\n\nexport default SearchResultItem;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,mBAA+C,CAAC;AAAA,EACpD,IAAA;AAAA,EACA,UAAA;AAAA,EACA,MAAA;AACF,CAAM,KAAA;AACJ,EAAA,MAAM,EAAE,KAAA,EAAO,QAAU,EAAA,SAAA,EAAW,OAAU,GAAA,IAAA,CAAA;AAC9C,EAAM,MAAA,gBAAA,GAAmB,EAAE,cAAA,EAAgB,MAAO,EAAA,CAAA;AAElD,EAAA,MAAM,SAAuB,GAAA,EAAE,SAAW,EAAA,QAAA,EAAU,YAAY,MAAO,EAAA,CAAA;AAEvE,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,4CAAc,KAAd,CAAA,EAAA;AAAA,IAAqB,KAAO,EAAA,gBAAA;AAAA,IAAkB,OAAS,EAAA,MAAA;AAAA,GACtD,CAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,iDACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IAAK,UAAW,EAAA,MAAA;AAAA,IAAO,YAAa,EAAA,WAAA;AAAA,IAAY,SAAU,EAAA,MAAA;AAAA,GAAA,EACxD,UAAU,UAAY,EAAA,KAAA,EAAO,eAAe,SAAS,CACxD,mBACC,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IACC,UAAW,EAAA,KAAA;AAAA,IACX,UAAW,EAAA,MAAA;AAAA,IACX,YAAa,EAAA,WAAA;AAAA,IACb,SAAU,EAAA,QAAA;AAAA,GAET,EAAA,QACH,CACF,CACF,CAAA,CAAA;AAEJ;;;;"}