@startlibs/components 1.0.4 → 1.1.0

package/lib/WarningDialog.mjs

@@ -0,0 +1,84 @@
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import _extends from '@babel/runtime/helpers/extends';
+import _isString from 'lodash/fp/isString';
+import { willUseSharedState } from '@startlibs/core';
+import { Button } from './Button.mjs';
+import { Dialog } from './Dialog.mjs';
+import { Icon } from './Icon.mjs';
+import { useDialogWithToggle } from './useDialogWithToggle.mjs';
+import { callIfFunction, getColor } from '@startlibs/utils';
+import React from 'react';
+import styled from 'styled-components';
+
+const _excluded = ["as"];
+const WarningDialog = /*#__PURE__*/styled(_ref => {
+  let {
+    content,
+    footer,
+    withX,
+    closeDialog,
+    leftButton,
+    additionalContent,
+    title,
+    rightButton,
+    className,
+    color = "alert",
+    icon = "warning",
+    confirmLabel = "Entendi",
+    noActions,
+    children
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Dialog, {
+    className: className,
+    closeDialog: withX && closeDialog
+  }, _isString(icon) ? /*#__PURE__*/React.createElement(WarningDialogIcon, {
+    icon: icon,
+    color: color
+  }) : icon, title && /*#__PURE__*/React.createElement(WarningDialogTitle, {
+    color: color
+  }, title), content && /*#__PURE__*/React.createElement(Content, {
+    noTitle: !title,
+    noActions: noActions
+  }, content), additionalContent, callIfFunction(leftButton, closeDialog), confirmLabel !== false && /*#__PURE__*/React.createElement(Button, {
+    highlight: true,
+    onClick: closeDialog
+  }, confirmLabel), callIfFunction(rightButton, closeDialog), callIfFunction(footer, closeDialog), children);
+}).withConfig({
+  displayName: "WarningDialog",
+  componentId: "sc-1jw779e-0"
+})(["text-align:center;max-width:36rem;padding:2.5rem;", "{margin:0.5rem !important;}"], Button);
+const WarningDialogTitle = /*#__PURE__*/styled.h3.withConfig({
+  displayName: "WarningDialog__WarningDialogTitle",
+  componentId: "sc-1jw779e-1"
+})(["color:", ";font-weight:500;font-size:20px;"], props => getColor(props.color)(props));
+const Content = /*#__PURE__*/styled.div.withConfig({
+  displayName: "WarningDialog__Content",
+  componentId: "sc-1jw779e-2"
+})(["font-size:15px;max-width:27rem;margin:0 auto;line-height:130%;", " ", ""], props => !props.noActions && "\n    margin: 0 auto 1.5rem;\n  ", props => props.noTitle && "\n    font-weight: 500;\n    font-size: 16px;\n  ");
+const WarningDialogIcon = /*#__PURE__*/styled(Icon).withConfig({
+  displayName: "WarningDialog__WarningDialogIcon",
+  componentId: "sc-1jw779e-3"
+})(["color:", ";;font-size:46px;display:block;margin-bottom:1.25rem;"], props => getColor(props.color)(props));
+const useWarningDialog = () => useDialogWithToggle(toggle => /*#__PURE__*/React.createElement(WarningDialog, _extends({}, toggle.isOpen, {
+  closeDialog: toggle.close
+})));
+const [useRenderDefaultWarningDialog,, _setWarningDialog] = willUseSharedState();
+const setWarningDialog = _ref2 => {
+  let {
+      as: Dialog = WarningDialog
+    } = _ref2,
+    props = _objectWithoutProperties(_ref2, _excluded);
+  return _setWarningDialog(/*#__PURE__*/React.createElement(Dialog, _extends({}, props, {
+    closeDialog: () => _setWarningDialog(null)
+  })));
+};
+const DefaultWarningDialog = () => {
+  const [warningDialog] = useRenderDefaultWarningDialog();
+  if (warningDialog) {
+    return warningDialog;
+  }
+  return null;
+};
+
+export { DefaultWarningDialog, WarningDialog, WarningDialogIcon, WarningDialogTitle, setWarningDialog, useWarningDialog };
+//# sourceMappingURL=WarningDialog.mjs.map

package/lib/WarningDialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"WarningDialog.mjs","sources":["../src/WarningDialog.jsx"],"sourcesContent":["import {willUseSharedState} from '@startlibs/core'\nimport {Button} from './Button'\nimport {Dialog} from './Dialog'\nimport {Icon} from './Icon'\nimport {useDialogWithToggle} from './useDialogWithToggle'\nimport { getColor, callIfFunction } from '@startlibs/utils';\nimport React from 'react'\nimport _ from 'lodash/fp'\nimport styled from 'styled-components';\n\nexport const WarningDialog = styled(({content, footer, withX ,closeDialog,leftButton,additionalContent,title,rightButton,className, color = \"alert\", icon = \"warning\",confirmLabel = \"Entendi\",noActions,children}) => {\n  return <Dialog className={className} closeDialog={withX && closeDialog}>\n    {_.isString(icon) ? <WarningDialogIcon icon={icon} color={color}/> : icon}\n    {title && <WarningDialogTitle color={color}>{title}</WarningDialogTitle>}\n    {content && <Content noTitle={!title} noActions={noActions}>{content}</Content>}\n    {additionalContent}\n    {callIfFunction(leftButton,closeDialog)}\n    {confirmLabel !== false && <Button highlight onClick={closeDialog}>{confirmLabel}</Button>}\n    {callIfFunction(rightButton,closeDialog)}\n    {callIfFunction(footer,closeDialog)}\n    {children}\n  </Dialog>\n})`\n  text-align: center;\n  max-width: 36rem;\n  padding: 2.5rem;\n  ${Button} {\n    margin: 0.5rem !important;\n  }\n`\nexport const WarningDialogTitle = styled.h3 `\n  color: ${props => getColor(props.color)(props)};\n  font-weight: 500;\n  font-size: 20px;\n`\nconst Content = styled.div `\n  font-size: 15px;\n  max-width: 27rem;\n  margin: 0 auto;\n  line-height: 130%;\n  ${props => !props.noActions && `\n    margin: 0 auto 1.5rem;\n  `}\n  ${props => props.noTitle &&`\n    font-weight: 500;\n    font-size: 16px;\n  `}\n`\nexport const WarningDialogIcon = styled(Icon)`\n  color: ${props => getColor(props.color)(props)};;\n  font-size: 46px;\n  display: block;\n  margin-bottom: 1.25rem;\n`\n\nexport const useWarningDialog = () => useDialogWithToggle((toggle) =>\n  <WarningDialog {...toggle.isOpen} closeDialog={toggle.close} />\n\n)\nconst [useRenderDefaultWarningDialog,,_setWarningDialog] = willUseSharedState()\n\nexport const setWarningDialog = ({as: Dialog = WarningDialog,...props}) => _setWarningDialog(<Dialog {...props} closeDialog={() => _setWarningDialog(null)}/>)\n\nexport const DefaultWarningDialog = () => {\n  const [warningDialog] = useRenderDefaultWarningDialog()\n  if (warningDialog) {\n    return warningDialog\n  }\n  return null\n}"],"names":["WarningDialog","styled","_ref","content","footer","withX","closeDialog","leftButton","additionalContent","title","rightButton","className","color","icon","confirmLabel","noActions","children","React","createElement","Dialog","_isString","WarningDialogIcon","WarningDialogTitle","Content","noTitle","callIfFunction","Button","highlight","onClick","withConfig","displayName","componentId","h3","props","getColor","div","Icon","useWarningDialog","useDialogWithToggle","toggle","_extends","isOpen","close","useRenderDefaultWarningDialog","_setWarningDialog","willUseSharedState","setWarningDialog","_ref2","as","_objectWithoutProperties","_excluded","DefaultWarningDialog","warningDialog"],"mappings":"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"}

package/lib/alt/buttons/OnClickLoadingButton.mjs

@@ -0,0 +1,36 @@
+import _extends from '@babel/runtime/helpers/extends';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import React from 'react';
+import { useToggle } from '@startlibs/core';
+import { callIfFunction } from '@startlibs/utils';
+import { Button } from '../../Button.mjs';
+
+const _excluded = ["onClick", "children", "onSuccess", "as", "onFailure", "className"];
+const OnClickLoadingButton = _ref => {
+  let {
+      onClick,
+      children,
+      onSuccess,
+      as = Button,
+      onFailure,
+      className
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  const loading = useToggle();
+  const Element = as;
+  return /*#__PURE__*/React.createElement(Element, _extends({
+    className: className,
+    isLoading: loading.isOpen
+  }, props, {
+    onClick: e => loading.wait(onClick(e).then(async e => {
+      await callIfFunction(onSuccess, e);
+      return e;
+    }, async e => {
+      await callIfFunction(onFailure, e);
+      throw e;
+    }))
+  }), children);
+};
+
+export { OnClickLoadingButton };
+//# sourceMappingURL=OnClickLoadingButton.mjs.map

package/lib/alt/buttons/OnClickLoadingButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"OnClickLoadingButton.mjs","sources":["../../../src/alt/buttons/OnClickLoadingButton.jsx"],"sourcesContent":["import React from 'react'\nimport {useToggle} from '@startlibs/core'\nimport {callIfFunction} from '@startlibs/utils'\nimport {Button} from '../../Button'\n\nexport const OnClickLoadingButton = ({onClick,children,onSuccess, as = Button, onFailure, className,...props}) => {\n  const loading = useToggle()\n  const Element = as\n  return <Element className={className} isLoading={loading.isOpen} {...props} onClick={(e) => loading.wait(onClick(e).then(async (e) => {\n    await callIfFunction(onSuccess,e)\n    return e\n  },async (e) => {\n    await callIfFunction(onFailure,e)\n    throw e\n  }))}>{children}</Element>\n}"],"names":["OnClickLoadingButton","_ref","onClick","children","onSuccess","as","Button","onFailure","className","props","_objectWithoutProperties","_excluded","loading","useToggle","Element","React","createElement","_extends","isLoading","isOpen","e","wait","then","callIfFunction"],"mappings":";;;;;;;;AAKaA,MAAAA,oBAAoB,GAAGC,IAAA,IAA8E;EAAA,IAA7E;MAACC,OAAO;MAACC,QAAQ;MAACC,SAAS;AAAEC,MAAAA,EAAE,GAAGC,MAAM;MAAEC,SAAS;AAAEC,MAAAA,SAAAA;AAAkB,KAAC,GAAAP,IAAA;AAANQ,IAAAA,KAAK,GAAAC,wBAAA,CAAAT,IAAA,EAAAU,SAAA,CAAA,CAAA;AAC1G,EAAA,MAAMC,OAAO,GAAGC,SAAS,EAAE,CAAA;EAC3B,MAAMC,OAAO,GAAGT,EAAE,CAAA;AAClB,EAAA,oBAAOU,KAAA,CAAAC,aAAA,CAACF,OAAO,EAAAG,QAAA,CAAA;AAACT,IAAAA,SAAS,EAAEA,SAAU;IAACU,SAAS,EAAEN,OAAO,CAACO,MAAAA;AAAO,GAAA,EAAKV,KAAK,EAAA;AAAEP,IAAAA,OAAO,EAAGkB,CAAC,IAAKR,OAAO,CAACS,IAAI,CAACnB,OAAO,CAACkB,CAAC,CAAC,CAACE,IAAI,CAAC,MAAOF,CAAC,IAAK;AACpI,MAAA,MAAMG,cAAc,CAACnB,SAAS,EAACgB,CAAC,CAAC,CAAA;AACjC,MAAA,OAAOA,CAAC,CAAA;KACT,EAAC,MAAOA,CAAC,IAAK;AACb,MAAA,MAAMG,cAAc,CAAChB,SAAS,EAACa,CAAC,CAAC,CAAA;AACjC,MAAA,MAAMA,CAAC,CAAA;AACT,KAAC,CAAC,CAAA;AAAE,GAAA,CAAA,EAAEjB,QAAkB,CAAC,CAAA;AAC3B;;;;"}

package/lib/alt/dialogs/DialogWithImageHeader.mjs

@@ -0,0 +1,14 @@
+import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
+import 'react';
+import styled from 'styled-components';
+import { getColor, media } from '@startlibs/utils';
+import { Dialog, CloseIcon } from '../../Dialog.mjs';
+
+var _templateObject;
+const DialogWithImageHeader = /*#__PURE__*/styled(Dialog).withConfig({
+  displayName: "DialogWithImageHeader",
+  componentId: "sc-1f1ry4g-0"
+})(["max-width:51rem;", "{background:", ";text-shadow:none;color:rgba(120,120,120,1);font-size:20px;box-shadow:rgba(0,0,0,0.2) 0px 1px 3px 0px,rgba(0,0,0,0.05) 0px 0px 0px 1px;width:36px;height:36px;line-height:36px;transition:0.1s ease-out;:hover{background-color:rgb(230,230,230);}:active{background-color:rgb(220,220,220);transition:0s ease-out;}@supports (position:sticky){position:sticky;top:-2.5rem;right:0rem;float:right;margin-right:-1.25rem;margin-top:0.75rem;}", "}"], CloseIcon, getColor('gray240'), media.mobile(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      @supports (position: sticky) {\n        top: 0;\n        margin-right: -1rem;\n      }\n    "]))));
+
+export { DialogWithImageHeader };
+//# sourceMappingURL=DialogWithImageHeader.mjs.map

package/lib/alt/dialogs/DialogWithImageHeader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogWithImageHeader.mjs","sources":["../../../src/alt/dialogs/DialogWithImageHeader.jsx"],"sourcesContent":["import React from 'react'\nimport styled from 'styled-components'\nimport {media, getColor} from '@startlibs/utils'\nimport {CloseIcon, Dialog} from '../../Dialog'\n\nexport const DialogWithImageHeader = styled(Dialog)`\n  max-width: 51rem;\n  \n  ${CloseIcon} {\n    background: ${getColor('gray240')};\n    text-shadow: none;\n    color: rgba(120,120,120,1);\n    font-size: 20px;\n    box-shadow: rgba(0,0,0,0.2) 0px 1px 3px 0px, rgba(0,0,0,0.05) 0px 0px 0px 1px;\n    width: 36px;\n    height: 36px;\n    line-height: 36px;\n    transition: 0.1s ease-out;\n    :hover {\n      background-color: rgb(230,230,230);\n    }\n    :active {\n      background-color: rgb(220,220,220);\n      transition: 0s ease-out;\n    }\n    @supports (position: sticky) {\n      position: sticky;\n      top: -2.5rem;\n      right: 0rem;\n      float: right;\n      margin-right: -1.25rem;\n      margin-top: 0.75rem;\n    }\n    ${media.mobile`\n      @supports (position: sticky) {\n        top: 0;\n        margin-right: -1rem;\n      }\n    `}\n    \n  }\n`"],"names":["DialogWithImageHeader","styled","Dialog","withConfig","displayName","componentId","CloseIcon","getColor","media","mobile","_templateObject","_taggedTemplateLiteral"],"mappings":";;;;;;;AAKO,MAAMA,qBAAqB,gBAAGC,MAAM,CAACC,MAAM,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,uBAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAAA,CAAA,CAAA,CAAA,kBAAA,EAAA,cAAA,EAAA,+aAAA,EAAA,GAAA,CAAA,EAG/CC,SAAS,EACKC,QAAQ,CAAC,SAAS,CAAC,EAwB/BC,KAAK,CAACC,MAAM,CAAAC,eAAA,KAAAA,eAAA,GAAAC,sBAAA,CAQjB,CAAA,sGAAA,CAAA,CAAA,CAAA,CAAA;;;;"}

package/lib/alt/dialogs/DialogWithSidebar.mjs

@@ -0,0 +1,106 @@
+import _extends from '@babel/runtime/helpers/extends';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
+import React, { useRef } from 'react';
+import styled from 'styled-components';
+import { getColor, media, twoWayAnimation, oneWayAnimation, callIfFunction } from '@startlibs/utils';
+import { useToggle, usePopupToggle, useLazyConstant } from '@startlibs/core';
+import { CloseIcon, Dialog } from '../../Dialog.mjs';
+import { willUseFlipSwitch } from '../../Flip.mjs';
+import { Loading } from '../../Loading.mjs';
+import { DialogContainer } from '../../containers/DialogContainer.mjs';
+
+const _excluded = ["className", "tabIsOpen", "menuIsOpen", "sidebar", "Content", "openTab", "children", "title"];
+var _templateObject, _templateObject2, _templateObject3;
+const SideMenu = /*#__PURE__*/styled.div.withConfig({
+  displayName: "DialogWithSidebar__SideMenu",
+  componentId: "sc-suvg9r-0"
+})(["background-color:", ";border-top-left-radius:18px;border-bottom-left-radius:18px;width:19rem;flex-shrink:0;padding:1.25rem 0;", " ", ""], getColor('lightBluishGray'), props => !props.visibleOnDesktop && 'display:none;', media.mobile(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display:block;\n    position:fixed;\n    top:0;\n    left:0;\n    bottom:0;\n    z-index:1000;\n    transition: 0.25s transform ease-out;\n    background-color: ", ";\n    box-shadow: -5px 0 20px 5px rgba(0,0,0,0.4);\n    border-radius: 0;\n    ", "\n  "])), getColor('gray240'), props => !props.isOpen && "\n      transform: translateX(-100%);\n      box-shadow: none;\n    "));
+const DialogTabMenu = /*#__PURE__*/styled.ul.withConfig({
+  displayName: "DialogWithSidebar__DialogTabMenu",
+  componentId: "sc-suvg9r-1"
+})(["cursor:default;overflow:auto;text-align:left;color:inherit;user-select:none;li{position:relative;padding:1rem 2rem 1rem 4.1rem;font-size:14px;", ":hover{background-color:", ";cursor:pointer;}&.selected{color:", ";background:rgba(0,132,214,0.125);pointer-events:none;}}.icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);width:3rem;text-align:center;line-height:0;font-size:26px;}", ""], media.mobile(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      font-size: 16px;\n    "]))), getColor('bluishGray'), getColor('main'), props => props.menuTabIsOpen && "\n    li {\n      padding: 1.25rem 2rem 1.25rem 3.25rem;\n      border-radius: 6px\n    }\n    .icon{\n      left: 0;\n    }\n  ");
+const [fadeIn, relativeFadeout] = twoWayAnimation('opacity: 0;', 'opacity: 0;', 'opacity: 1;');
+const absoluteOnLeave = oneWayAnimation('position: absolute;', 'position: absolute;');
+const fadeOut = [absoluteOnLeave, relativeFadeout];
+const MENU_TAB = '$menu$';
+
+// ponytail: sem footer — padrão do dialog com barra lateral; fecha pelo X ou por fora
+const DialogWithSidebarPresentation = _ref => {
+  let {
+      className,
+      tabIsOpen,
+      menuIsOpen,
+      sidebar,
+      Content,
+      openTab,
+      children,
+      title
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  const tab = useToggle(tabIsOpen);
+  const sideMenu = usePopupToggle(menuIsOpen);
+  const ref = useRef();
+  const switchAnimation = useLazyConstant(willUseFlipSwitch);
+  const menuTabIsOpen = tab.isOpen === MENU_TAB;
+  return /*#__PURE__*/React.createElement(DialogContainer, _extends({}, props, {
+    ref: ref
+  }), _ref2 => {
+    let {
+      confirmCloseDialog
+    } = _ref2;
+    return /*#__PURE__*/React.createElement("div", {
+      className: className + " JS-has-wc",
+      ref: ref
+    }, props.closeDialog && /*#__PURE__*/React.createElement(CloseIcon, {
+      onClick: confirmCloseDialog
+    }), /*#__PURE__*/React.createElement(SideMenu, {
+      isOpen: sideMenu.isOpen,
+      visibleOnDesktop: true
+    }, sidebar(tab)), /*#__PURE__*/React.createElement("div", {
+      className: (menuTabIsOpen ? "menuTabIsOpen " : "") + "main-container"
+    }, /*#__PURE__*/React.createElement("h2", null, menuTabIsOpen ? "Configurações gerais" : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
+      className: "icon icon-menu mobile-only",
+      onClick: sideMenu.open
+    }), title(tab))), /*#__PURE__*/React.createElement(React.Suspense, {
+      fallback: /*#__PURE__*/React.createElement(TabContent, {
+        key: "loading",
+        switchAnimation: switchAnimation,
+        tab: tab,
+        children: /*#__PURE__*/React.createElement(Loading, {
+          absolute: true
+        })
+      })
+    }, /*#__PURE__*/React.createElement(TabContent, {
+      key: tab.isOpen,
+      switchAnimation: switchAnimation,
+      tab: tab,
+      Content: Content,
+      children: children
+    }))));
+  });
+};
+const TabContent = _ref3 => {
+  let {
+    Content,
+    children,
+    tab,
+    switchAnimation
+  } = _ref3;
+  const contentRef = useRef();
+  switchAnimation(contentRef, fadeIn, fadeOut);
+  return /*#__PURE__*/React.createElement("div", {
+    ref: contentRef,
+    className: "dialog-content"
+  }, callIfFunction(Content, tab), callIfFunction(children, tab));
+};
+const DialogWithSidebar = /*#__PURE__*/styled(props => /*#__PURE__*/React.createElement(Dialog, _extends({
+  fullscreenOnMobile: true,
+  as: DialogWithSidebarPresentation
+}, props))).withConfig({
+  displayName: "DialogWithSidebar",
+  componentId: "sc-suvg9r-2"
+})(["max-width:59rem;display:flex;padding:0;flex-direction:row;", ""], media.mobile(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    min-height: 100%;\n    overflow: hidden;\n  "]))));
+
+export { DialogTabMenu, DialogWithSidebar, DialogWithSidebarPresentation, MENU_TAB, SideMenu };
+//# sourceMappingURL=DialogWithSidebar.mjs.map

package/lib/alt/dialogs/DialogWithSidebar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DialogWithSidebar.mjs","sources":["../../../src/alt/dialogs/DialogWithSidebar.jsx"],"sourcesContent":["import React, {useRef} from 'react'\nimport styled from 'styled-components'\nimport {media, callIfFunction, getColor, twoWayAnimation, oneWayAnimation} from '@startlibs/utils'\nimport {useToggle, usePopupToggle, useLazyConstant} from '@startlibs/core'\nimport {CloseIcon, Dialog} from '../../Dialog'\nimport {willUseFlipSwitch} from '../../Flip'\nimport {Loading} from '../../Loading'\nimport {DialogContainer} from '../../containers/DialogContainer'\n\nexport const SideMenu = styled.div`\n  background-color: ${getColor('lightBluishGray')};\n  border-top-left-radius: 18px;\n  border-bottom-left-radius: 18px;\n  width: 19rem;\n  flex-shrink: 0;\n  padding: 1.25rem 0;\n  ${props => !props.visibleOnDesktop && 'display:none;'}\n  ${media.mobile`\n    display:block;\n    position:fixed;\n    top:0;\n    left:0;\n    bottom:0;\n    z-index:1000;\n    transition: 0.25s transform ease-out;\n    background-color: ${getColor('gray240')};\n    box-shadow: -5px 0 20px 5px rgba(0,0,0,0.4);\n    border-radius: 0;\n    ${props => !props.isOpen && `\n      transform: translateX(-100%);\n      box-shadow: none;\n    `}\n  `}\n`\nexport const DialogTabMenu = styled.ul`\n  cursor: default;\n  overflow: auto;\n  text-align: left;\n  color: inherit;\n  user-select: none;\n  li {\n    position: relative;\n    padding: 1rem 2rem 1rem 4.1rem;\n    font-size: 14px;\n    ${media.mobile`\n      font-size: 16px;\n    `}\n    :hover {\n      background-color: ${getColor('bluishGray')};\n      cursor: pointer;\n    }\n    &.selected {\n      color: ${getColor('main')};\n      background: rgba(0, 132, 214, 0.125);\n      pointer-events: none;\n    }\n  }\n  .icon{\n    position: absolute;\n    left: 1rem;\n    top: 50%;\n    transform: translateY(-50%);\n    width: 3rem;\n    text-align: center;\n    line-height: 0;\n    font-size: 26px;\n  }\n  ${props => props.menuTabIsOpen && `\n    li {\n      padding: 1.25rem 2rem 1.25rem 3.25rem;\n      border-radius: 6px\n    }\n    .icon{\n      left: 0;\n    }\n  `}\n`\n\nconst [fadeIn, relativeFadeout] = twoWayAnimation('opacity: 0;','opacity: 0;', 'opacity: 1;')\nconst absoluteOnLeave = oneWayAnimation('position: absolute;', 'position: absolute;')\nconst fadeOut = [absoluteOnLeave,relativeFadeout]\n\nexport const MENU_TAB = '$menu$'\n\n// ponytail: sem footer — padrão do dialog com barra lateral; fecha pelo X ou por fora\nexport const DialogWithSidebarPresentation = ({className, tabIsOpen, menuIsOpen, sidebar, Content, openTab, children, title, ...props}) => {\n  const tab = useToggle(tabIsOpen)\n  const sideMenu = usePopupToggle(menuIsOpen)\n  const ref = useRef()\n  const switchAnimation = useLazyConstant(willUseFlipSwitch)\n\n  const menuTabIsOpen = tab.isOpen === MENU_TAB\n\n  return <DialogContainer {...props} ref={ref}>{({confirmCloseDialog}) =>\n      <div className={className + \" JS-has-wc\"} ref={ref}>\n        {\n          props.closeDialog &&\n          <CloseIcon onClick={confirmCloseDialog}/>\n        }\n        <SideMenu isOpen={sideMenu.isOpen} visibleOnDesktop>\n          {sidebar(tab)}\n        </SideMenu>\n\n        <div className={(menuTabIsOpen ? \"menuTabIsOpen \" : \"\") + \"main-container\"}>\n          <h2>{\n            menuTabIsOpen ? \"Configurações gerais\" : <><span className=\"icon icon-menu mobile-only\" onClick={sideMenu.open}/>\n          {title(tab)}</>}</h2>\n          <React.Suspense fallback={<TabContent key=\"loading\" switchAnimation={switchAnimation} tab={tab} children={<Loading absolute/>} />}>\n            <TabContent key={tab.isOpen} switchAnimation={switchAnimation} tab={tab} Content={Content} children={children} />\n          </React.Suspense>\n        </div>\n      </div>\n    }</DialogContainer>\n}\n\nconst TabContent = ({Content,children,tab,switchAnimation}) => {\n  const contentRef = useRef()\n  switchAnimation(contentRef,fadeIn,fadeOut)\n\n  return <div ref={contentRef} className=\"dialog-content\">\n    {callIfFunction(Content,tab)}\n    {callIfFunction(children,tab)}\n  </div>\n}\n\nexport const DialogWithSidebar = styled((props) => <Dialog fullscreenOnMobile as={DialogWithSidebarPresentation} {...props} />)`\n  max-width: 59rem;\n  display: flex;\n  padding: 0;\n  flex-direction: row;\n  ${media.mobile`\n    min-height: 100%;\n    overflow: hidden;\n  `}\n`\n"],"names":["SideMenu","styled","div","withConfig","displayName","componentId","getColor","props","visibleOnDesktop","media","mobile","_templateObject","_taggedTemplateLiteral","isOpen","DialogTabMenu","ul","_templateObject2","menuTabIsOpen","fadeIn","relativeFadeout","twoWayAnimation","absoluteOnLeave","oneWayAnimation","fadeOut","MENU_TAB","DialogWithSidebarPresentation","_ref","className","tabIsOpen","menuIsOpen","sidebar","Content","openTab","children","title","_objectWithoutProperties","_excluded","tab","useToggle","sideMenu","usePopupToggle","ref","useRef","switchAnimation","useLazyConstant","willUseFlipSwitch","React","createElement","DialogContainer","_extends","_ref2","confirmCloseDialog","closeDialog","CloseIcon","onClick","Fragment","open","Suspense","fallback","TabContent","key","Loading","absolute","_ref3","contentRef","callIfFunction","DialogWithSidebar","Dialog","fullscreenOnMobile","as","_templateObject3"],"mappings":"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"}

package/lib/alt/dialogs/MobileBubbleDialog.mjs

@@ -0,0 +1,49 @@
+import _extends from '@babel/runtime/helpers/extends';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import React, { useRef } from 'react';
+import { getColor, callIfFunction } from '@startlibs/utils';
+import styled from 'styled-components';
+import { DialogErrorContent } from '../../Dialog.mjs';
+import { DialogContainer } from '../../containers/DialogContainer.mjs';
+
+const _excluded = ["className", "footer", "Content", "children", "title", "illustration", "icon", "auxiliarActions"];
+const MobileBubbleDialogFooter = /*#__PURE__*/styled.div.withConfig({
+  displayName: "MobileBubbleDialog__MobileBubbleDialogFooter",
+  componentId: "sc-riqrem-0"
+})(["background-color:", ";min-height:5rem;color:", ";font-size:13px;font-weight:500;text-transform:uppercase;padding:1rem;user-select:none;display:flex;align-items:center;justify-content:center;cursor:pointer;border-bottom-left-radius:10px;border-bottom-right-radius:10px;:active{background:rgb(232,232,232);}"], getColor('gray240'), getColor('main'));
+const MobileBubbleDialog = /*#__PURE__*/styled(_ref => {
+  let {
+      className,
+      footer,
+      Content,
+      children,
+      title,
+      illustration,
+      icon,
+      auxiliarActions
+    } = _ref,
+    props = _objectWithoutProperties(_ref, _excluded);
+  const ref = useRef();
+  return /*#__PURE__*/React.createElement(DialogContainer, _extends({}, props, {
+    closeOnClick: true,
+    ref: ref,
+    DialogErrorContent: DialogErrorContent,
+    title: title
+  }), _ref2 => {
+    let {
+      confirmCloseDialog
+    } = _ref2;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+      className: className,
+      ref: ref
+    }, children && callIfFunction(children), /*#__PURE__*/React.createElement(MobileBubbleDialogFooter, {
+      onClick: confirmCloseDialog
+    }, "Fechar")));
+  });
+}).withConfig({
+  displayName: "MobileBubbleDialog",
+  componentId: "sc-riqrem-1"
+})(["border-radius:10px;background-color:white;width:100%;margin:auto;position:relative;align-self:baseline;overflow:hidden;@supports (flex-wrap:wrap){display:flex;flex-direction:column;}"]);
+
+export { MobileBubbleDialog };
+//# sourceMappingURL=MobileBubbleDialog.mjs.map

package/lib/alt/dialogs/MobileBubbleDialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"MobileBubbleDialog.mjs","sources":["../../../src/alt/dialogs/MobileBubbleDialog.jsx"],"sourcesContent":["import React, {useRef} from 'react'\n\nimport {callIfFunction, getColor} from '@startlibs/utils'\nimport styled from 'styled-components'\n\nimport {DialogErrorContent} from '../../Dialog'\nimport {DialogContainer} from '../../containers/DialogContainer'\n\nconst MobileBubbleDialogFooter = styled.div `\n  background-color: ${getColor('gray240')};\n  min-height: 5rem;\n  color: ${getColor('main')};\n  font-size: 13px;\n  font-weight: 500;\n  text-transform: uppercase;\n  padding: 1rem;\n  user-select: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  border-bottom-left-radius: 10px;\n  border-bottom-right-radius: 10px;\n  :active {\n    background: rgb(232,232,232);\n  }\n`\n\nexport const MobileBubbleDialog = styled(({className, footer, Content, children, title, illustration, icon, auxiliarActions, ...props}) => {\n  const ref = useRef()\n  return <DialogContainer {...props} closeOnClick ref={ref} DialogErrorContent={DialogErrorContent} title={title}>{({confirmCloseDialog}) =>\n    <>\n    <div className={className} ref={ref}>\n      {\n        children && callIfFunction(children)\n      }\n      <MobileBubbleDialogFooter onClick={confirmCloseDialog}>\n        Fechar\n      </MobileBubbleDialogFooter>\n    </div>\n    </>\n  }</DialogContainer>\n})`\n  border-radius: 10px;\n  background-color: white;\n  width: 100%;\n  margin: auto;\n  position: relative;\n  align-self: baseline;\n  overflow: hidden;\n  @supports (flex-wrap: wrap) {\n    display: flex;\n    flex-direction: column;\n  }\n`\n\n"],"names":["MobileBubbleDialogFooter","styled","div","withConfig","displayName","componentId","getColor","MobileBubbleDialog","_ref","className","footer","Content","children","title","illustration","icon","auxiliarActions","props","_objectWithoutProperties","_excluded","ref","useRef","React","createElement","DialogContainer","_extends","closeOnClick","DialogErrorContent","_ref2","confirmCloseDialog","Fragment","callIfFunction","onClick"],"mappings":";;;;;;;;;AAQA,MAAMA,wBAAwB,gBAAGC,MAAM,CAACC,GAAG,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,8CAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CACrBC,CAAAA,CAAAA,CAAAA,mBAAAA,EAAAA,yBAAAA,EAAAA,mQAAAA,CAAAA,EAAAA,QAAQ,CAAC,SAAS,CAAC,EAE9BA,QAAQ,CAAC,MAAM,CAAC,CAe1B,CAAA;MAEYC,kBAAkB,gBAAGN,MAAM,CAACO,IAAA,IAAkG;EAAA,IAAjG;MAACC,SAAS;MAAEC,MAAM;MAAEC,OAAO;MAAEC,QAAQ;MAAEC,KAAK;MAAEC,YAAY;MAAEC,IAAI;AAAEC,MAAAA,eAAAA;AAAyB,KAAC,GAAAR,IAAA;AAANS,IAAAA,KAAK,GAAAC,wBAAA,CAAAV,IAAA,EAAAW,SAAA,CAAA,CAAA;AACnI,EAAA,MAAMC,GAAG,GAAGC,MAAM,EAAE,CAAA;EACpB,oBAAOC,KAAA,CAAAC,aAAA,CAACC,eAAe,EAAAC,QAAA,KAAKR,KAAK,EAAA;IAAES,YAAY,EAAA,IAAA;AAACN,IAAAA,GAAG,EAAEA,GAAI;AAACO,IAAAA,kBAAkB,EAAEA,kBAAmB;AAACd,IAAAA,KAAK,EAAEA,KAAAA;AAAM,GAAA,CAAA,EAAEe,KAAA,IAAA;IAAA,IAAC;AAACC,MAAAA,kBAAAA;AAAkB,KAAC,GAAAD,KAAA,CAAA;IAAA,oBACpIN,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAQ,QAAA,EAAA,IAAA,eACAR,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKd,MAAAA,SAAS,EAAEA,SAAU;AAACW,MAAAA,GAAG,EAAEA,GAAAA;KAE5BR,EAAAA,QAAQ,IAAImB,cAAc,CAACnB,QAAQ,CAAC,eAEtCU,KAAA,CAAAC,aAAA,CAACvB,wBAAwB,EAAA;AAACgC,MAAAA,OAAO,EAAEH,kBAAAA;KAAoB,EAAA,QAE7B,CACvB,CACH,CAAC,CAAA;AAAA,GACa,CAAC,CAAA;AACrB,CAAC,CAAC,CAAA1B,UAAA,CAAA;EAAAC,WAAA,EAAA,oBAAA;EAAAC,WAAA,EAAA,aAAA;AAAA,CAYD,CAAA,CAAA,CAAA,wLAAA,CAAA;;;;"}