@loja-integrada/admin-components 0.15.3 → 0.16.0

package/dist/admin-components.esm.js

@@ -66,6 +66,18 @@ function _taggedTemplateLiteralLoose(strings, raw) {
   return strings;
 }
 
+var Adjust = function Adjust() {
+  return React.createElement(React.Fragment, null, React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M2.25 5c0-.9665.7835-1.75 1.75-1.75h2c.9665 0 1.75.7835 1.75 1.75v2c0 .9665-.7835 1.75-1.75 1.75H4c-.9665 0-1.75-.7835-1.75-1.75V5ZM4 4.75c-.13807 0-.25.11193-.25.25v2c0 .13807.11193.25.25.25h2c.13807 0 .25-.11193.25-.25V5c0-.13807-.11193-.25-.25-.25H4ZM10.25 11c0-.9665.7835-1.75 1.75-1.75h2c.9665 0 1.75.7835 1.75 1.75v2c0 .9665-.7835 1.75-1.75 1.75h-2c-.9665 0-1.75-.7835-1.75-1.75v-2Zm1.75-.25c-.1381 0-.25.1119-.25.25v2c0 .1381.1119.25.25.25h2c.1381 0 .25-.1119.25-.25v-2c0-.1381-.1119-.25-.25-.25h-2Z"
+  }), React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M5.74951 4V.5h-1.5V4h1.5Zm0 4h-1.5v9.5h1.5V8ZM13.7495 10V.5h-1.5V10h1.5Zm0 4h-1.5v3.5h1.5V14Z"
+  }));
+};
+
 var AngleLeft = function AngleLeft() {
   return React.createElement("path", {
     fillRule: "evenodd",
@@ -546,6 +558,7 @@ var User = function User() {
 };
 
 var icons = {
+  adjust: Adjust,
   angleLeft: AngleLeft,
   angleRight: AngleRight,
   angleDiagonal: AngleDiagonal,
@@ -1768,11 +1781,12 @@ var CheckboxComponent = function CheckboxComponent(_ref, ref) {
     htmlFor: inputId,
     className: "inline-flex " + alignOptions[boxAlign] + " cursor-pointer"
   }, React.createElement("span", {
-    className: "rounded z-50 flex items-center justify-center focus-within:ring-2 ring-focus"
+    className: "relative rounded z-50 flex items-center justify-center focus-within:ring-2 ring-focus"
   }, React.createElement("input", Object.assign({
     ref: ref || inputRef,
     type: "checkbox",
     id: inputId,
+    name: name,
     className: "opacity-0 absolute h-4 w-4 z-50 cursor-pointer",
     checked: isChecked,
     onChange: handleChange,
@@ -2040,7 +2054,7 @@ var TableComponent = function TableComponent(_ref2) {
 var Table = /*#__PURE__*/React.memo(TableComponent);
 
 var ItemWrapperClasses = "flex relative py-6 text-f7 leading-4 break-words no-underline";
-var ItemWrapperClassesContainerHover = "before:hover:block before:hover:absolute before:hover:h-full before:hover:w-8 before:hover:top-0 before:hover:-left-8 before:hover:bg-base-2 after:hover:block after:hover:absolute after:hover:h-full after:hover:w-8 after:hover:top-0 after:hover:-right-8 after:hover:bg-base-2";
+var ItemWrapperClassesContainerHover = "before:hover:block before:hover:absolute before:hover:h-full before:hover:w-5 lg:before:hover:w-8 before:hover:top-0 before:hover:-left-5 lg:before:hover:-left-8 before:hover:bg-base-2 after:hover:block after:hover:absolute after:hover:h-full after:hover:w-5 lg:after:hover:w-8 after:hover:top-0 after:hover:-right-5 lg:after:hover:-right-8 after:hover:bg-base-2";
 
 var DefaultWrapper = function DefaultWrapper(props) {
   var children = props.children,
@@ -2182,7 +2196,7 @@ var TableListComponent = function TableListComponent(_ref) {
   }, isLoading ? React.createElement("div", {
     className: "table-list-loading"
   }, React.createElement(TableListItemLoading, null), React.createElement(TableListItemLoading, null), React.createElement(TableListItemLoading, null), React.createElement(TableListItemLoading, null)) : !itemsMemoized || !itemsMemoized.length ? React.createElement("div", {
-    className: "table-list-empty flex flex-col items-center justify-center gap-5 min-h-[80vh] lg:min-h-[60vh] max-w-sm mx-auto px-4"
+    className: "table-list-empty flex flex-col items-center justify-center gap-5 min-h-[40vh] lg:min-h-[60vh] max-w-sm mx-auto px-4"
   }, empty.illustration && React.createElement("div", {
     className: "table-list-empty-illustration text-center"
   }, empty.illustration), React.createElement("div", {
@@ -2402,6 +2416,8 @@ var ModalComponent = function ModalComponent(_ref) {
       headerClose = _ref$headerClose === void 0 ? 'Fechar' : _ref$headerClose,
       footerActions = _ref.footerActions,
       onClose = _ref.onClose,
+      _ref$closeTimeout = _ref.closeTimeout,
+      closeTimeout = _ref$closeTimeout === void 0 ? 200 : _ref$closeTimeout,
       _parentSelector = _ref.parentSelector,
       children = _ref.children;
 
@@ -2430,7 +2446,7 @@ var ModalComponent = function ModalComponent(_ref) {
     isOpen: modalIsOpen,
     onAfterClose: handleAfterCloseFunc,
     onRequestClose: handleRequestCloseFunc,
-    closeTimeoutMS: 200,
+    closeTimeoutMS: closeTimeout,
     ariaHideApp: false,
     shouldCloseOnOverlayClick: !modalPreventClose,
     shouldCloseOnEsc: !modalPreventClose,
@@ -2467,6 +2483,61 @@ var ModalComponent = function ModalComponent(_ref) {
 
 var Modal = /*#__PURE__*/React.memo(ModalComponent);
 
+var backgroundShadowEffect = ['[background:linear-gradient(#FFFFFF_33%,rgba(255,255,255,0)),linear-gradient(rgba(255,255,255,0),#FFFFFF_66%)_0_100%,radial-gradient(farthest-side_at_50%_0,rgba(156,156,156,0.5),rgba(0,0,0,0)),radial-gradient(farthest-side_at_50%_100%,_rgba(156,156,156,0.5),rgba(0,0,0,0))_0_100%]', '[background-size:100%_15px,100%_15px,100%_5px,100%_5px]', '[background-attachment:local,local,scroll,scroll]', '[background-repeat:no-repeat]', '[background-color:#FFFFFF]', '[&_.form-group_.bg-base-1]:bg-transparent'];
+var SidebarFixedComponent = function SidebarFixedComponent(_ref) {
+  var children = _ref.children,
+      footerActions = _ref.footerActions,
+      _ref$isOpen = _ref.isOpen,
+      isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
+      onClose = _ref.onClose,
+      helpLink = _ref.helpLink;
+
+  var _useState = useState(false),
+      sidebarIsOpen = _useState[0],
+      setSidebarIsOpen = _useState[1];
+
+  useEffect(function () {
+    setSidebarIsOpen(isOpen);
+  }, [isOpen]);
+
+  var handleRequestCloseFunc = function handleRequestCloseFunc() {
+    setSidebarIsOpen(false);
+    onClose == null ? void 0 : onClose();
+  };
+
+  return React.createElement("div", {
+    className: "sidebar-fixed fixed z-40 lg:z-20 right-0 bottom-0 w-full h-full transition-all overflow-x-hidden " + (sidebarIsOpen ? 'pointer-events-auto opacity-100' : 'opacity-0 pointer-events-none')
+  }, React.createElement("div", {
+    className: "sidebar-fixed-backdrop fixed inset-0 h-full w-full bg-black-alpha -z-1",
+    onClick: handleRequestCloseFunc
+  }), React.createElement("div", {
+    className: "sidebar-fixed-inner mt-10 sm:mt-0 top-0 bottom-0 right-0 absolute flex flex-col justify-between bg-base-1 transform transition-transform shadow h-auto w-full sm:max-w-[410px] sm:ml-16 rounded-t-lg sm:rounded-none " + (sidebarIsOpen ? 'translate-x-0' : 'translate-x-10')
+  }, React.createElement("div", {
+    className: "sidebar-fixed-header flex justify-between items-center p-3 lg:px-5 text-inverted-2"
+  }, React.createElement("button", {
+    className: "sidebar-fixed-close p-2 hover:text-primary transition-colors",
+    onClick: handleRequestCloseFunc
+  }, React.createElement(Icon, {
+    icon: "close",
+    block: true,
+    size: 4
+  })), helpLink && React.createElement("a", {
+    className: "sidebar-fixed-help p-2 hover:text-primary transition-colors",
+    href: helpLink,
+    target: "_blank",
+    rel: "noreferrer"
+  }, React.createElement(Icon, {
+    icon: "questionCircle",
+    block: true,
+    size: 4
+  }))), React.createElement("div", {
+    className: "sidebar-fixed-content flex-1 flex-grow w-full overflow-auto overscroll-none px-5 lg:px-7 break-words " + backgroundShadowEffect.join(' ')
+  }, children), footerActions && React.createElement("div", {
+    className: "sidebar-fixed-footer flex justify-between items-center p-5 lg:p-7 lg:pt-6"
+  }, footerActions)));
+};
+var SidebarFixed = /*#__PURE__*/React.memo(SidebarFixedComponent);
+
 var alertTypes = {
   success: {
     "class": 'bg-success-light border-success',
@@ -2596,6 +2667,34 @@ var StatusComponent = function StatusComponent(_ref2) {
 
 var Status = /*#__PURE__*/React.memo(StatusComponent);
 
+var TagTypes = {
+  neutral: 'bg-base-1 border-inverted-2',
+  primary: 'bg-primary-light border-primary',
+  danger: 'bg-danger-light border-danger',
+  success: 'bg-success-light border-success',
+  warning: 'bg-warning-light border-warning'
+};
+
+var TagComponent = function TagComponent(_ref) {
+  var _ref$type = _ref.type,
+      type = _ref$type === void 0 ? 'neutral' : _ref$type,
+      content = _ref.content,
+      _ref$fullWidth = _ref.fullWidth,
+      fullWidth = _ref$fullWidth === void 0 ? false : _ref$fullWidth,
+      _ref$className = _ref.className,
+      className = _ref$className === void 0 ? '' : _ref$className,
+      action = _ref.action;
+  return React.createElement("div", {
+    className: "tag " + (fullWidth ? 'flex' : 'inline-flex') + " items-center justify-between border rounded px-4 py-2 tracking-4 leading-6 text-f6 text-primary-bold " + TagTypes[type] + " " + className
+  }, React.createElement("div", {
+    className: "min-w-0 break-words -my-px"
+  }, content), action && React.createElement("div", {
+    className: "-my-px ml-3"
+  }, action));
+};
+
+var Tag = /*#__PURE__*/React.memo(TagComponent);
+
 var contextClass = {
   success: 'bg-primary-light border-primary-dark',
   error: 'bg-danger-light border-danger-dark',
@@ -3358,5 +3457,5 @@ var PaginationComponent = function PaginationComponent(_ref) {
 
 var Pagination = /*#__PURE__*/React.memo(PaginationComponent);
 
-export { ActionBar, Alert, Badge, Box, Breadcrumb, Button, Checkbox, Container$1 as Container, Dropdown, Icon, Input, InputCurrency, InputCurrencyComponent, InputHelpText, InputLabel, InputMask, LoadingPlaceholder, Modal, Pagination, Select, SelectComponent, Sidebar, SidebarItem, SidebarSubItem, Status, Table, TableList, TableListItem, TableListItemLoading, Tabs, Timeline, Toast, Toggle, Tooltip, Topbar, sizeClasses, varianErrorClasses, variantControlClasses, variantDisabledClasses, variantSelectedClasses, variantValueClasses };
+export { ActionBar, Alert, Badge, Box, Breadcrumb, Button, Checkbox, Container$1 as Container, Dropdown, Icon, Input, InputCurrency, InputCurrencyComponent, InputHelpText, InputLabel, InputMask, LoadingPlaceholder, Modal, Pagination, Select, SelectComponent, Sidebar, SidebarFixed, SidebarFixedComponent, SidebarItem, SidebarSubItem, Status, Table, TableList, TableListItem, TableListItemLoading, Tabs, Tag, Timeline, Toast, Toggle, Tooltip, Topbar, sizeClasses, varianErrorClasses, variantControlClasses, variantDisabledClasses, variantSelectedClasses, variantValueClasses };
 //# sourceMappingURL=admin-components.esm.js.map