@startlibs/components 1.1.4 → 1.2.0-rc.1

package/lib/SplitColumnsContainer.mjs

@@ -1,9 +1,10 @@
-import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
+import _extends from '@babel/runtime/helpers/extends';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import React from 'react';
-import { media, getMargin } from '@startlibs/utils';
-import styled, { css } from 'styled-components';
+import { getMargin, callIfFunction, scrollWidth } from '@startlibs/utils';
+import styled, { useTheme } from 'styled-components';
 
-var _templateObject, _templateObject2;
+const _excluded = ["viewportMinWidth", "twoColumnsBelowVW", "margin", "last", "className"];
 const getMarginFromFieldChild = props => {
   if (!props.last) return 0;
   const fields = React.Children.toArray(props.children).filter(c => c.type.displayName === "Field" || c.type.displayName === "EnhancedInput");
@@ -16,10 +17,80 @@ const splitColumnMargins = {
   'default': 1,
   big: 2
 };
-const SplitColumnsContainer = /*#__PURE__*/styled.div.withConfig({
+
+// viewportMinWidth/twoColumnsBelowVW vêm de props: não tem CSS estático possível pra eles (yak
+// extrai @media em tempo de build, não a partir de uma prop em tempo de render). Troca o
+// `media.min`/`media.max` (que embutiam um `@media` dinâmico) por um hook que ouve
+// `matchMedia` e liga/desliga classe — as duas regras de CSS ficam estáticas, e a mesma soma de
+// `scrollWidth` que `media()` já fazia entra aqui, pro breakpoint bater igual em px (inclusive
+// a 610px, entre 600 e 600 + barra de rolagem).
+const useMatchMedia = query => {
+  const getMatch = () => typeof window !== 'undefined' && window.matchMedia ? window.matchMedia(query).matches : false;
+  const [matches, setMatches] = React.useState(getMatch);
+  React.useEffect(() => {
+    if (typeof window === 'undefined' || !window.matchMedia) return;
+    const mql = window.matchMedia(query);
+    const onChange = () => setMatches(mql.matches);
+    onChange();
+    const addListener = mql.addEventListener ? cb => mql.addEventListener('change', cb) : cb => mql.addListener(cb);
+    const removeListener = mql.removeEventListener ? cb => mql.removeEventListener('change', cb) : cb => mql.removeListener(cb);
+    addListener(onChange);
+    return () => removeListener(onChange);
+  }, [query]);
+  return matches;
+};
+
+// Mesma comparação que checkCustomScreenWidth (utils/src/styled.js) fazia pro theme.overrideMediaWidth:
+// ignora o browser de verdade e compara direto contra o breakpoint (sem somar scrollWidth — o
+// override já é uma largura "combinada", não a viewport física). Usado em testes/impressão.
+const matchesOverrideWidth = (overrideWidth, breakpoint, type) => {
+  const currentWidth = callIfFunction(overrideWidth);
+  return type === 'min-width' ? currentWidth >= breakpoint : currentWidth <= breakpoint;
+};
+
+// `breakpoint` null/undefined == bloco original não tinha condição nenhuma pra testar (o `&&`
+// de `props.twoColumnsBelowVW &&`): nem entra no matchMedia, nem no overrideMediaWidth.
+const useBreakpointMatch = (breakpoint, type, overrideWidth) => {
+  const hasBreakpoint = breakpoint !== undefined && breakpoint !== null;
+  const useOverride = hasBreakpoint && overrideWidth !== undefined;
+  const query = hasBreakpoint && !useOverride ? "(".concat(type, ": ").concat(breakpoint + scrollWidth, "px)") : 'not all';
+  const mediaMatch = useMatchMedia(query);
+  if (!hasBreakpoint) return false;
+  return useOverride ? matchesOverrideWidth(overrideWidth, breakpoint, type) : mediaMatch;
+};
+
+// styled(Base) mira num componente, não numa tag: ao contrário do antigo styled.div, o
+// styled-components não filtra prop inválida pra <div> nesse caso. Por isso tira aqui, à mão,
+// toda prop que ou é lida só pelo template (margin, last) ou só existe pra decidir a classe
+// aqui dentro (viewportMinWidth, twoColumnsBelowVW), antes de espalhar o resto no elemento real.
+const SplitColumnsContainerBase = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  var _useTheme;
+  let {
+      viewportMinWidth = 0,
+      twoColumnsBelowVW,
+      margin,
+      last,
+      className
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  const overrideWidth = (_useTheme = useTheme()) === null || _useTheme === void 0 ? void 0 : _useTheme.overrideMediaWidth;
+  const isFlex = useBreakpointMatch(viewportMinWidth, 'min-width', overrideWidth);
+  const isTwoColumns = useBreakpointMatch(twoColumnsBelowVW, 'max-width', overrideWidth);
+  const classes = [className, isFlex && 'JS-flex-columns', isTwoColumns && 'JS-two-columns'].filter(Boolean).join(' ');
+  return /*#__PURE__*/React.createElement("div", _extends({
+    ref: ref,
+    className: classes || undefined
+  }, rest));
+});
+const SplitColumnsContainer = /*#__PURE__*/styled(SplitColumnsContainerBase).withConfig({
   displayName: "SplitColumnsContainer",
   componentId: "sc-1h4sw88-0"
-})(["margin-bottom:", "rem;", " ", ""], getMarginFromFieldChild, props => css(["", ""], media.min(props.viewportMinWidth || 0)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      display: flex;\n      flex-wrap: nowrap;\n      margin-left: -", "rem;\n      margin-right: -", "rem;\n      margin-top: -", "rem;\n      > * {\n        flex-basis: 0;\n        flex-grow: 1;\n        margin-left: ", "rem;\n        margin-right: ", "rem;\n        margin-top: ", "rem;\n      }\n    "])), props => getMargin(splitColumnMargins)(props) / 2, props => getMargin(splitColumnMargins)(props) / 2, props => getMargin(splitColumnMargins)(props), props => getMargin(splitColumnMargins)(props) / 2, props => getMargin(splitColumnMargins)(props) / 2, props => getMargin(splitColumnMargins)(props))), props => props.twoColumnsBelowVW && css(["", ""], media.max(props.twoColumnsBelowVW)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      flex-wrap: wrap;\n      > * {\n        flex-basis: 47%;\n      }\n    "])))));
+})(["margin-bottom:", "rem;&.JS-flex-columns{display:flex;flex-wrap:nowrap;margin-left:", "rem;margin-right:", "rem;margin-top:", "rem;> *{flex-basis:0;flex-grow:1;margin-left:", "rem;margin-right:", "rem;margin-top:", "rem;}}&.JS-two-columns{flex-wrap:wrap;> *{flex-basis:47%;}}"], props => getMarginFromFieldChild(props), props => -getMargin(splitColumnMargins)(props) / 2, props => -getMargin(splitColumnMargins)(props) / 2, props => -getMargin(splitColumnMargins)(props), props => getMargin(splitColumnMargins)(props) / 2, props => getMargin(splitColumnMargins)(props) / 2, props => getMargin(splitColumnMargins)(props));
+// O plugin/babel-plugin-styled-components infere o displayName do nome da variável — mas só
+// quando o import `styled` vem de 'styled-components' (modo sc). No lib-yak o arquivo passa a
+// importar `styled` de '@yak/react' e isso não acontece mais, então fica explícito aqui, nos dois
+// modos: fixDoubledLastMarginBottom precisa do mesmo valor em "SplitColumnsContainer.displayName".
+SplitColumnsContainer.displayName = 'SplitColumnsContainer';
 const fixDoubledLastMarginBottom = children => {
   let last = React.Children.count(children) - 1;
   function processChild(child, i) {

package/lib/SplitColumnsContainer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SplitColumnsContainer.mjs","sources":["../src/SplitColumnsContainer.jsx"],"sourcesContent":["import React from 'react'\n\nimport {getMargin, media} from '@startlibs/utils'\nimport styled, {css} from 'styled-components'\n\nconst getMarginFromFieldChild = (props) => {\n  if (!props.last) return 0;\n  const fields = React.Children.toArray(props.children).filter(c => c.type.displayName === \"Field\" || c.type.displayName === \"EnhancedInput\")\n  if (!fields.length) return 0\n  const lastField = fields.slice(-1)[0]\n  return '-' + getMargin(props.theme.Field.margins)(lastField.props)\n}\n\n\nconst splitColumnMargins = {small:0.5,'default':1, big:2}\n\nexport const SplitColumnsContainer = styled.div`\n\n  margin-bottom: ${getMarginFromFieldChild}rem;\n  \n  ${props => css`\n    ${media.min(props.viewportMinWidth || 0)`\n      display: flex;\n      flex-wrap: nowrap;\n      margin-left: -${props=>getMargin(splitColumnMargins)(props)/2}rem;\n      margin-right: -${props=>getMargin(splitColumnMargins)(props)/2}rem;\n      margin-top: -${props=>getMargin(splitColumnMargins)(props)}rem;\n      > * {\n        flex-basis: 0;\n        flex-grow: 1;\n        margin-left: ${props=>getMargin(splitColumnMargins)(props)/2}rem;\n        margin-right: ${props=>getMargin(splitColumnMargins)(props)/2}rem;\n        margin-top: ${props=>getMargin(splitColumnMargins)(props)}rem;\n      }\n    `}\n  `}\n  ${props => props.twoColumnsBelowVW && css`\n    ${media.max(props.twoColumnsBelowVW)`\n      flex-wrap: wrap;\n      > * {\n        flex-basis: 47%;\n      }\n    `}\n  `}\n`\n\nexport const fixDoubledLastMarginBottom = (children) => {\n  let last = React.Children.count(children)-1\n\n  function processChild(child, i) {\n    if (i === last && child && child.type && child.type.displayName === SplitColumnsContainer.displayName) {\n      return React.cloneElement(child, {last: true})\n    }\n    return child\n  }\n  if (!Array.isArray(children) || children.length===0) {\n    return processChild(children,0)\n  }\n  while ((!children[last] || (children[last] && children[last].type && children[last].type.displayName === \"Errors\")) && last > 0) {\n    last--\n  }\n  return React.Children.map(children,processChild)\n}\n"],"names":["getMarginFromFieldChild","props","last","fields","React","Children","toArray","children","filter","c","type","displayName","length","lastField","slice","getMargin","theme","Field","margins","splitColumnMargins","small","big","SplitColumnsContainer","styled","div","withConfig","componentId","css","media","min","viewportMinWidth","_templateObject","_taggedTemplateLiteral","twoColumnsBelowVW","max","_templateObject2","fixDoubledLastMarginBottom","count","processChild","child","i","cloneElement","Array","isArray","map"],"mappings":"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"}
+{"version":3,"file":"SplitColumnsContainer.mjs","sources":["../src/SplitColumnsContainer.jsx"],"sourcesContent":["import React from 'react'\n\nimport {callIfFunction, getMargin, scrollWidth} from '@startlibs/utils'\nimport styled, {useTheme} from 'styled-components'\n\nconst getMarginFromFieldChild = (props) => {\n  if (!props.last) return 0;\n  const fields = React.Children.toArray(props.children).filter(c => c.type.displayName === \"Field\" || c.type.displayName === \"EnhancedInput\")\n  if (!fields.length) return 0\n  const lastField = fields.slice(-1)[0]\n  return '-' + getMargin(props.theme.Field.margins)(lastField.props)\n}\n\n\nconst splitColumnMargins = {small:0.5,'default':1, big:2}\n\n// viewportMinWidth/twoColumnsBelowVW vêm de props: não tem CSS estático possível pra eles (yak\n// extrai @media em tempo de build, não a partir de uma prop em tempo de render). Troca o\n// `media.min`/`media.max` (que embutiam um `@media` dinâmico) por um hook que ouve\n// `matchMedia` e liga/desliga classe — as duas regras de CSS ficam estáticas, e a mesma soma de\n// `scrollWidth` que `media()` já fazia entra aqui, pro breakpoint bater igual em px (inclusive\n// a 610px, entre 600 e 600 + barra de rolagem).\nconst useMatchMedia = (query) => {\n  const getMatch = () => (typeof window !== 'undefined' && window.matchMedia) ? window.matchMedia(query).matches : false\n  const [matches, setMatches] = React.useState(getMatch)\n  React.useEffect(() => {\n    if (typeof window === 'undefined' || !window.matchMedia) return\n    const mql = window.matchMedia(query)\n    const onChange = () => setMatches(mql.matches)\n    onChange()\n    const addListener = mql.addEventListener ? (cb) => mql.addEventListener('change', cb) : (cb) => mql.addListener(cb)\n    const removeListener = mql.removeEventListener ? (cb) => mql.removeEventListener('change', cb) : (cb) => mql.removeListener(cb)\n    addListener(onChange)\n    return () => removeListener(onChange)\n  }, [query])\n  return matches\n}\n\n// Mesma comparação que checkCustomScreenWidth (utils/src/styled.js) fazia pro theme.overrideMediaWidth:\n// ignora o browser de verdade e compara direto contra o breakpoint (sem somar scrollWidth — o\n// override já é uma largura \"combinada\", não a viewport física). Usado em testes/impressão.\nconst matchesOverrideWidth = (overrideWidth, breakpoint, type) => {\n  const currentWidth = callIfFunction(overrideWidth)\n  return type === 'min-width' ? currentWidth >= breakpoint : currentWidth <= breakpoint\n}\n\n// `breakpoint` null/undefined == bloco original não tinha condição nenhuma pra testar (o `&&`\n// de `props.twoColumnsBelowVW &&`): nem entra no matchMedia, nem no overrideMediaWidth.\nconst useBreakpointMatch = (breakpoint, type, overrideWidth) => {\n  const hasBreakpoint = breakpoint !== undefined && breakpoint !== null\n  const useOverride = hasBreakpoint && overrideWidth !== undefined\n  const query = (hasBreakpoint && !useOverride)\n    ? `(${type}: ${breakpoint + scrollWidth}px)`\n    : 'not all'\n  const mediaMatch = useMatchMedia(query)\n  if (!hasBreakpoint) return false\n  return useOverride ? matchesOverrideWidth(overrideWidth, breakpoint, type) : mediaMatch\n}\n\n// styled(Base) mira num componente, não numa tag: ao contrário do antigo styled.div, o\n// styled-components não filtra prop inválida pra <div> nesse caso. Por isso tira aqui, à mão,\n// toda prop que ou é lida só pelo template (margin, last) ou só existe pra decidir a classe\n// aqui dentro (viewportMinWidth, twoColumnsBelowVW), antes de espalhar o resto no elemento real.\nconst SplitColumnsContainerBase = React.forwardRef(({viewportMinWidth = 0, twoColumnsBelowVW, margin, last, className, ...rest}, ref) => {\n  const overrideWidth = useTheme()?.overrideMediaWidth\n  const isFlex = useBreakpointMatch(viewportMinWidth, 'min-width', overrideWidth)\n  const isTwoColumns = useBreakpointMatch(twoColumnsBelowVW, 'max-width', overrideWidth)\n  const classes = [className, isFlex && 'JS-flex-columns', isTwoColumns && 'JS-two-columns'].filter(Boolean).join(' ')\n  return <div ref={ref} className={classes || undefined} {...rest}/>\n})\n\nexport const SplitColumnsContainer = styled(SplitColumnsContainerBase)`\n  margin-bottom: ${props => getMarginFromFieldChild(props)}rem;\n\n  &.JS-flex-columns {\n    display: flex;\n    flex-wrap: nowrap;\n    /* O yak extrai essas interpolações pra var(--...): um sinal de menos solto no texto estático,\n       logo antes da interpolação, vira \"-var(--x)\" na folha final — sintaxe de CSS inválida\n       (margin cai pro valor inicial, 0px). O sinal de menos tem que estar DENTRO do valor\n       calculado, não no texto ao redor. */\n    margin-left: ${props=> -getMargin(splitColumnMargins)(props)/2}rem;\n    margin-right: ${props=> -getMargin(splitColumnMargins)(props)/2}rem;\n    margin-top: ${props=> -getMargin(splitColumnMargins)(props)}rem;\n    > * {\n      flex-basis: 0;\n      flex-grow: 1;\n      margin-left: ${props=>getMargin(splitColumnMargins)(props)/2}rem;\n      margin-right: ${props=>getMargin(splitColumnMargins)(props)/2}rem;\n      margin-top: ${props=>getMargin(splitColumnMargins)(props)}rem;\n    }\n  }\n  &.JS-two-columns {\n    flex-wrap: wrap;\n    > * {\n      flex-basis: 47%;\n    }\n  }\n`\n// O plugin/babel-plugin-styled-components infere o displayName do nome da variável — mas só\n// quando o import `styled` vem de 'styled-components' (modo sc). No lib-yak o arquivo passa a\n// importar `styled` de '@yak/react' e isso não acontece mais, então fica explícito aqui, nos dois\n// modos: fixDoubledLastMarginBottom precisa do mesmo valor em \"SplitColumnsContainer.displayName\".\nSplitColumnsContainer.displayName = 'SplitColumnsContainer'\n\nexport const fixDoubledLastMarginBottom = (children) => {\n  let last = React.Children.count(children)-1\n\n  function processChild(child, i) {\n    if (i === last && child && child.type && child.type.displayName === SplitColumnsContainer.displayName) {\n      return React.cloneElement(child, {last: true})\n    }\n    return child\n  }\n  if (!Array.isArray(children) || children.length===0) {\n    return processChild(children,0)\n  }\n  while ((!children[last] || (children[last] && children[last].type && children[last].type.displayName === \"Errors\")) && last > 0) {\n    last--\n  }\n  return React.Children.map(children,processChild)\n}\n"],"names":["getMarginFromFieldChild","props","last","fields","React","Children","toArray","children","filter","c","type","displayName","length","lastField","slice","getMargin","theme","Field","margins","splitColumnMargins","small","big","useMatchMedia","query","getMatch","window","matchMedia","matches","setMatches","useState","useEffect","mql","onChange","addListener","addEventListener","cb","removeListener","removeEventListener","matchesOverrideWidth","overrideWidth","breakpoint","currentWidth","callIfFunction","useBreakpointMatch","hasBreakpoint","undefined","useOverride","concat","scrollWidth","mediaMatch","SplitColumnsContainerBase","forwardRef","_ref","ref","_useTheme","viewportMinWidth","twoColumnsBelowVW","margin","className","rest","_objectWithoutProperties","_excluded","useTheme","overrideMediaWidth","isFlex","isTwoColumns","classes","Boolean","join","createElement","_extends","SplitColumnsContainer","styled","withConfig","componentId","fixDoubledLastMarginBottom","count","processChild","child","i","cloneElement","Array","isArray","map"],"mappings":"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"}

package/lib/TextButton.mjs

@@ -27,7 +27,7 @@ const TextButton = /*#__PURE__*/styled(_ref => {
 }).withConfig({
   displayName: "TextButton",
   componentId: "sc-1eydmhc-0"
-})(["display:inline-block;font-weight:600;font-size:", "px;color:", ";cursor:pointer;text-decoration:none;:hover,:active{color:", ";}", "{display:inline-block;margin-left:0.25rem;vertical-align:-3px;}", " & ~ &{margin-left:1rem;}"], props => props.fontSize ? props.fontSize : "14", props => props.alert ? getColor('alert') : getColor('main'), props => props.alert ? darken(0.1, getColor("alert")(props)) : darken(0.1, getColor("main")(props)), Loading, props => props.nowrap && "\n    white-space: nowrap;\n  ");
+})(["display:inline-block;font-weight:600;font-size:", "px;color:", ";cursor:pointer;text-decoration:none;&:hover,&:active{color:", ";}", "{display:inline-block;margin-left:0.25rem;vertical-align:-3px;}", " & ~ &{margin-left:1rem;}"], props => props.fontSize ? props.fontSize : "14", props => props.alert ? getColor('alert') : getColor('main'), props => props.alert ? darken(0.1, getColor("alert")(props)) : darken(0.1, getColor("main")(props)), Loading, props => props.nowrap && "\n    white-space: nowrap;\n  ");
 TextButton.a = props => /*#__PURE__*/React.createElement(TextButton, _extends({}, props, {
   className: props.className,
   innerAs: "a"

package/lib/TextButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TextButton.mjs","sources":["../src/TextButton.jsx"],"sourcesContent":["import React from 'react'\nimport styled from 'styled-components';\nimport {darken} from 'polished'\nimport { getColor } from '@startlibs/utils';\nimport {Link} from './Link'\nimport {Loading} from './Loading'\n\nexport const TextButton = styled(({className,isLoading,alert, fontSize, children, innerAs: Wrapper = 'div', ...props}) => <Wrapper className={className} {...props}>\n  {children} {isLoading && <Loading size={14} borderWidth={3} />}\n</Wrapper>)`\n  display: inline-block;\n  font-weight: 600;\n  font-size: ${props => props.fontSize ? props.fontSize : \"14\"}px;\n  color: ${props => props.alert ? getColor('alert') : getColor('main')};\n  cursor: pointer;\n  text-decoration: none;\n  :hover, :active {\n    color: ${props => props.alert ? darken(0.1, getColor(\"alert\")(props)) : darken(0.1, getColor(\"main\")(props))};\n  }\n  ${Loading} {\n    display: inline-block;\n    margin-left: 0.25rem;\n    vertical-align: -3px;\n  }\n  ${props => props.nowrap && `\n    white-space: nowrap;\n  `}\n  & ~ & {\n    margin-left: 1rem;\n  }\n`\n\nTextButton.a = (props) => <TextButton {...props} className={props.className} innerAs=\"a\"/>\nTextButton.Link = (props) => <TextButton {...props} className={props.className} innerAs={Link}/>"],"names":["TextButton","styled","_ref","className","isLoading","alert","fontSize","children","innerAs","Wrapper","props","_objectWithoutProperties","_excluded","React","createElement","_extends","Loading","size","borderWidth","withConfig","displayName","componentId","getColor","darken","nowrap","a","Link"],"mappings":";;;;;;;;;;AAOaA,MAAAA,UAAU,gBAAGC,MAAM,CAACC,IAAA,IAAA;EAAA,IAAC;MAACC,SAAS;MAACC,SAAS;MAACC,KAAK;MAAEC,QAAQ;MAAEC,QAAQ;MAAEC,OAAO,EAAEC,OAAO,GAAG,KAAA;AAAe,KAAC,GAAAP,IAAA;AAANQ,IAAAA,KAAK,GAAAC,wBAAA,CAAAT,IAAA,EAAAU,SAAA,CAAA,CAAA;AAAA,EAAA,oBAAMC,KAAA,CAAAC,aAAA,CAACL,OAAO,EAAAM,QAAA,CAAA;AAACZ,IAAAA,SAAS,EAAEA,SAAAA;AAAU,GAAA,EAAKO,KAAK,CAAA,EAC/JH,QAAQ,EAAC,GAAC,EAACH,SAAS,iBAAIS,KAAA,CAAAC,aAAA,CAACE,OAAO,EAAA;AAACC,IAAAA,IAAI,EAAE,EAAG;AAACC,IAAAA,WAAW,EAAE,CAAA;AAAE,GAAE,CACtD,CAAC,CAAA;AAAA,CAAA,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,YAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAAA,CAAA,CAAA,CAAA,iDAAA,EAAA,WAAA,EAAA,4DAAA,EAAA,IAAA,EAAA,iEAAA,EAAA,2BAAA,CAAA,EAGIX,KAAK,IAAIA,KAAK,CAACJ,QAAQ,GAAGI,KAAK,CAACJ,QAAQ,GAAG,IAAI,EACnDI,KAAK,IAAIA,KAAK,CAACL,KAAK,GAAGiB,QAAQ,CAAC,OAAO,CAAC,GAAGA,QAAQ,CAAC,MAAM,CAAC,EAIzDZ,KAAK,IAAIA,KAAK,CAACL,KAAK,GAAGkB,MAAM,CAAC,GAAG,EAAED,QAAQ,CAAC,OAAO,CAAC,CAACZ,KAAK,CAAC,CAAC,GAAGa,MAAM,CAAC,GAAG,EAAED,QAAQ,CAAC,MAAM,CAAC,CAACZ,KAAK,CAAC,CAAC,EAE5GM,OAAO,EAKPN,KAAK,IAAIA,KAAK,CAACc,MAAM,oCAEtB,EAIF;AAEDxB,UAAU,CAACyB,CAAC,GAAIf,KAAK,iBAAKG,KAAA,CAAAC,aAAA,CAACd,UAAU,EAAAe,QAAA,KAAKL,KAAK,EAAA;EAAEP,SAAS,EAAEO,KAAK,CAACP,SAAU;AAACK,EAAAA,OAAO,EAAC,GAAA;AAAG,CAAA,CAAC,CAAC,CAAA;AAC1FR,UAAU,CAAC0B,IAAI,GAAIhB,KAAK,iBAAKG,KAAA,CAAAC,aAAA,CAACd,UAAU,EAAAe,QAAA,KAAKL,KAAK,EAAA;EAAEP,SAAS,EAAEO,KAAK,CAACP,SAAU;AAACK,EAAAA,OAAO,EAAEkB,IAAAA;AAAK,CAAA,CAAC,CAAC;;;;"}
+{"version":3,"file":"TextButton.mjs","sources":["../src/TextButton.jsx"],"sourcesContent":["import React from 'react'\nimport styled from 'styled-components';\nimport {darken} from 'polished'\nimport { getColor } from '@startlibs/utils';\nimport {Link} from './Link'\nimport {Loading} from './Loading'\n\nexport const TextButton = styled(({className,isLoading,alert, fontSize, children, innerAs: Wrapper = 'div', ...props}) => <Wrapper className={className} {...props}>\n  {children} {isLoading && <Loading size={14} borderWidth={3} />}\n</Wrapper>)`\n  display: inline-block;\n  font-weight: 600;\n  font-size: ${props => props.fontSize ? props.fontSize : \"14\"}px;\n  color: ${props => props.alert ? getColor('alert') : getColor('main')};\n  cursor: pointer;\n  text-decoration: none;\n  &:hover, &:active {\n    color: ${props => props.alert ? darken(0.1, getColor(\"alert\")(props)) : darken(0.1, getColor(\"main\")(props))};\n  }\n  ${Loading} {\n    display: inline-block;\n    margin-left: 0.25rem;\n    vertical-align: -3px;\n  }\n  ${props => props.nowrap && `\n    white-space: nowrap;\n  `}\n  & ~ & {\n    margin-left: 1rem;\n  }\n`\n\nTextButton.a = (props) => <TextButton {...props} className={props.className} innerAs=\"a\"/>\nTextButton.Link = (props) => <TextButton {...props} className={props.className} innerAs={Link}/>"],"names":["TextButton","styled","_ref","className","isLoading","alert","fontSize","children","innerAs","Wrapper","props","_objectWithoutProperties","_excluded","React","createElement","_extends","Loading","size","borderWidth","withConfig","displayName","componentId","getColor","darken","nowrap","a","Link"],"mappings":";;;;;;;;;;AAOaA,MAAAA,UAAU,gBAAGC,MAAM,CAACC,IAAA,IAAA;EAAA,IAAC;MAACC,SAAS;MAACC,SAAS;MAACC,KAAK;MAAEC,QAAQ;MAAEC,QAAQ;MAAEC,OAAO,EAAEC,OAAO,GAAG,KAAA;AAAe,KAAC,GAAAP,IAAA;AAANQ,IAAAA,KAAK,GAAAC,wBAAA,CAAAT,IAAA,EAAAU,SAAA,CAAA,CAAA;AAAA,EAAA,oBAAMC,KAAA,CAAAC,aAAA,CAACL,OAAO,EAAAM,QAAA,CAAA;AAACZ,IAAAA,SAAS,EAAEA,SAAAA;AAAU,GAAA,EAAKO,KAAK,CAAA,EAC/JH,QAAQ,EAAC,GAAC,EAACH,SAAS,iBAAIS,KAAA,CAAAC,aAAA,CAACE,OAAO,EAAA;AAACC,IAAAA,IAAI,EAAE,EAAG;AAACC,IAAAA,WAAW,EAAE,CAAA;AAAE,GAAE,CACtD,CAAC,CAAA;AAAA,CAAA,CAAC,CAAAC,UAAA,CAAA;EAAAC,WAAA,EAAA,YAAA;EAAAC,WAAA,EAAA,cAAA;AAAA,CAAA,CAAA,CAAA,CAAA,iDAAA,EAAA,WAAA,EAAA,8DAAA,EAAA,IAAA,EAAA,iEAAA,EAAA,2BAAA,CAAA,EAGIX,KAAK,IAAIA,KAAK,CAACJ,QAAQ,GAAGI,KAAK,CAACJ,QAAQ,GAAG,IAAI,EACnDI,KAAK,IAAIA,KAAK,CAACL,KAAK,GAAGiB,QAAQ,CAAC,OAAO,CAAC,GAAGA,QAAQ,CAAC,MAAM,CAAC,EAIzDZ,KAAK,IAAIA,KAAK,CAACL,KAAK,GAAGkB,MAAM,CAAC,GAAG,EAAED,QAAQ,CAAC,OAAO,CAAC,CAACZ,KAAK,CAAC,CAAC,GAAGa,MAAM,CAAC,GAAG,EAAED,QAAQ,CAAC,MAAM,CAAC,CAACZ,KAAK,CAAC,CAAC,EAE5GM,OAAO,EAKPN,KAAK,IAAIA,KAAK,CAACc,MAAM,oCAEtB,EAIF;AAEDxB,UAAU,CAACyB,CAAC,GAAIf,KAAK,iBAAKG,KAAA,CAAAC,aAAA,CAACd,UAAU,EAAAe,QAAA,KAAKL,KAAK,EAAA;EAAEP,SAAS,EAAEO,KAAK,CAACP,SAAU;AAACK,EAAAA,OAAO,EAAC,GAAA;AAAG,CAAA,CAAC,CAAC,CAAA;AAC1FR,UAAU,CAAC0B,IAAI,GAAIhB,KAAK,iBAAKG,KAAA,CAAAC,aAAA,CAACd,UAAU,EAAAe,QAAA,KAAKL,KAAK,EAAA;EAAEP,SAAS,EAAEO,KAAK,CAACP,SAAU;AAACK,EAAAA,OAAO,EAAEkB,IAAAA;AAAK,CAAA,CAAC,CAAC;;;;"}

package/lib/ToastNotifications.mjs

@@ -1,12 +1,12 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
-import styled, { css } from 'styled-components';
 import _map from 'lodash/fp/map';
 import _concat from 'lodash/fp/concat';
 import _differenceBy from 'lodash/fp/differenceBy';
 import _isObject from 'lodash/fp/isObject';
 import React, { useMemo, useEffect, useRef } from 'react';
 import { media, getColor, ifUndefined, getUID, oneWayAnimation, callIfFunction, constrainEvent } from '@startlibs/utils';
+import styled, { css } from 'styled-components';
 import { rgba } from 'polished';
 import { willUseSharedState, useToggle, Fill } from '@startlibs/core';
 import { FlipList } from './FlipList.mjs';
@@ -14,17 +14,17 @@ import { Icon } from './Icon.mjs';
 import { Loading } from './Loading.mjs';
 import { SwitchDiv } from './SwitchDiv.mjs';
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 const NotificationContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "ToastNotifications__NotificationContainer",
   componentId: "sc-inycsj-0"
-})(["position:fixed;bottom:0;max-height:100%;z-index:999999;display:flex;flex-direction:column-reverse;align-items:flex-end;overflow-y:auto;right:1.5rem;", " ", " ::-webkit-scrollbar{width:21px;height:21px;}::-webkit-scrollbar-thumb{pointer-events:all;background:rgba(0,0,0,0.4);border-radius:100px;background-clip:padding-box;border:6px solid transparent;min-height:30px;min-width:30px;&:hover{background:rgba(0,0,0,0.5);background-clip:padding-box;border:6px solid transparent;}}::-webkit-scrollbar-corner{background:transparent;}", " ", ""], media.desktop(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    padding-bottom: 1.5rem;\n  "]))), media.mobile(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    padding-bottom: 0.75rem;\n  "]))), media.desktop(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    &.JS-dialog-open {\n      right: 2.75rem;\n    }\n  "]))), media.mobile(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    left: 0.75rem;\n    right: 0.75rem;\n  "]))));
+})(["position:fixed;bottom:0;max-height:100%;z-index:999999;display:flex;flex-direction:column-reverse;align-items:flex-end;overflow-y:auto;right:1.5rem;", " ", " &::-webkit-scrollbar{width:21px;height:21px;}&::-webkit-scrollbar-thumb{pointer-events:all;background:rgba(0,0,0,0.4);border-radius:100px;background-clip:padding-box;border:6px solid transparent;min-height:30px;min-width:30px;&:hover{background:rgba(0,0,0,0.5);background-clip:padding-box;border:6px solid transparent;}}&::-webkit-scrollbar-corner{background:transparent;}", " ", ""], media.desktop(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    padding-bottom: 1.5rem;\n  "]))), media.mobile(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    padding-bottom: 0.75rem;\n  "]))), media.desktop(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    &.JS-dialog-open {\n      right: 2.75rem;\n    }\n  "]))), media.mobile(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    left: 0.75rem;\n    right: 0.75rem;\n  "]))));
 const ToastBox = /*#__PURE__*/styled.div.withConfig({
   displayName: "ToastNotifications__ToastBox",
   componentId: "sc-inycsj-1"
-})(["color:white;font-size:14px;font-weight:500;border-radius:12px;flex-shrink:0;margin-top:0.5rem;overflow:hidden;transition:0.3s background ease,0.4s opacity 1.5s;", " ", " ", ""], media.desktop(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    background: ", ";\n    max-width: 300px;\n  "])), props => rgba(getColor(props.type)(props), ifUndefined(props.opacity, 0.7))), media.mobile(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    background: ", ";\n  "])), props => rgba(getColor(props.type)(props), ifUndefined(props.opacity, 0.8))), props => css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["background: ", ";"])), getColor(props.type)));
+})(["color:white;font-size:14px;font-weight:500;border-radius:12px;flex-shrink:0;margin-top:0.5rem;overflow:hidden;transition:0.3s background ease,0.4s opacity 1.5s;", " ", " ", ""], props => css(["background:", ";"], getColor(props.type)), media.desktop(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n    background: ", ";\n    max-width: 300px;\n  "])), props => rgba(getColor(props.type)(props), ifUndefined(props.opacity, 0.7))), media.mobile(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n    background: ", ";\n  "])), props => rgba(getColor(props.type)(props), ifUndefined(props.opacity, 0.8))));
 const NotificationTitleContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "ToastNotifications__NotificationTitleContainer",
   componentId: "sc-inycsj-2"
@@ -36,20 +36,26 @@ const NotificationTitle = /*#__PURE__*/styled.div.withConfig({
 const NotificationContent = /*#__PURE__*/styled.div.withConfig({
   displayName: "ToastNotifications__NotificationContent",
   componentId: "sc-inycsj-4"
-})(["display:flex;align-items:center;text-align:left;padding:1rem 1.5rem;", ""], media.mobile(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    justify-content: center;\n  "]))));
+})(["display:flex;align-items:center;text-align:left;padding:1rem 1.5rem;", ""], media.mobile(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    justify-content: center;\n  "]))));
+// Task 13c: substitui a prop JSX `css="min-width: 0;"` (R13 proíbe essa forma no yak) por um
+// styled component equivalente.
+const NotificationContentBody = /*#__PURE__*/styled.div.withConfig({
+  displayName: "ToastNotifications__NotificationContentBody",
+  componentId: "sc-inycsj-5"
+})(["min-width:0;"]);
 const NotificationIconWrapper = /*#__PURE__*/styled.div.withConfig({
   displayName: "ToastNotifications__NotificationIconWrapper",
-  componentId: "sc-inycsj-5"
+  componentId: "sc-inycsj-6"
 })(["margin-right:1rem;position:relative;width:36px;text-align:center;flex-shrink:0;", "{font-size:", "px;}"], Icon, props => props.isLoading ? 22 : props.iconFontSize || 40);
 const CloseIcon = /*#__PURE__*/styled(Icon).attrs({
   icon: 'x'
 }).withConfig({
   displayName: "ToastNotifications__CloseIcon",
-  componentId: "sc-inycsj-6"
-})(["font-size:20px;cursor:pointer;width:2rem;height:2rem;line-height:2rem;text-align:center;position:absolute;top:50%;right:0.25rem;transform:translateY(-50%);border-radius:100px;opacity:0.8;:hover,:active{background:rgba(0,0,0,0.1);opacity:1;}"]);
+  componentId: "sc-inycsj-7"
+})(["font-size:20px;cursor:pointer;width:2rem;height:2rem;line-height:2rem;text-align:center;position:absolute;top:50%;right:0.25rem;transform:translateY(-50%);border-radius:100px;opacity:0.8;&:hover,&:active{background:rgba(0,0,0,0.1);opacity:1;}"]);
 const NotificationDetails = /*#__PURE__*/styled.div.withConfig({
   displayName: "ToastNotifications__NotificationDetails",
-  componentId: "sc-inycsj-7"
+  componentId: "sc-inycsj-8"
 })(["background:rgba(0,0,0,0.1);border-radius:8px;padding:1rem;margin:0 1rem 1rem;font-weight:400;font-size:13px;"]);
 const [useToastNotifications, _useToastNotificationsRef, setToastNotifications] = willUseSharedState([]);
 const formatNotification = (notification, extra) => _isObject(notification) ? _objectSpread(_objectSpread(_objectSpread({}, notification), extra), {}, {
@@ -173,7 +179,7 @@ const ToastNotifications = () => {
       size: 36,
       white: true,
       absolute: true
-    })), /*#__PURE__*/React.createElement(_StyledDiv, null, callIfFunction(notification.content, closeWithLock))), notification.details && /*#__PURE__*/React.createElement(NotificationDetails, {
+    })), /*#__PURE__*/React.createElement(NotificationContentBody, null, callIfFunction(notification.content, closeWithLock))), notification.details && /*#__PURE__*/React.createElement(NotificationDetails, {
       onClick: constrainEvent()
     }, notification.details)));
   }))));
@@ -206,10 +212,6 @@ const useNotificationContainerWidthLock = containerRef => {
     unlockWidth
   };
 };
-var _StyledDiv = /*#__PURE__*/styled("div").withConfig({
-  displayName: "ToastNotifications___StyledDiv",
-  componentId: "sc-inycsj-8"
-})(["min-width:0;"]);
 
 export { ToastNotifications, createToastNotification, useToastNotificationToggle, useToastNotifications, willShowToastNotification };
 //# sourceMappingURL=ToastNotifications.mjs.map

package/lib/ToastNotifications.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ToastNotifications.mjs","sources":["../src/ToastNotifications.jsx"],"sourcesContent":["import React, {useEffect, useMemo, useRef} from 'react'\nimport {oneWayAnimation, constrainEvent} from '@startlibs/utils'\nimport _ from 'lodash/fp'\nimport styled from 'styled-components'\nimport {rgba} from 'polished'\nimport {Fill, useToggle, willUseSharedState} from '@startlibs/core'\nimport {getUID, ifUndefined, media, callIfFunction, getColor} from '@startlibs/utils'\nimport {css} from \"styled-components/macro\";\nimport {FlipList} from './FlipList'\nimport {Icon} from './Icon'\nimport {Loading} from './Loading'\nimport {SwitchDiv} from './SwitchDiv'\n\nconst NotificationContainer = styled.div `\n  position: fixed;\n  bottom: 0;\n  max-height: 100%;\n  z-index: 999999;  \n  display: flex;\n  flex-direction: column-reverse;\n  align-items: flex-end;\n  overflow-y: auto;\n  right: 1.5rem;\n  ${media.desktop`\n    padding-bottom: 1.5rem;\n  `}\n  ${media.mobile`\n    padding-bottom: 0.75rem;\n  `}\n  ::-webkit-scrollbar {\n    width: 21px;\n    height: 21px;\n  }\n  ::-webkit-scrollbar-thumb {\n    pointer-events: all;\n    background: rgba(0,0,0,0.4);\n    border-radius: 100px;\n    background-clip: padding-box;\n    border: 6px solid transparent;\n    min-height: 30px;\n    min-width: 30px;\n    &:hover {\n      background: rgba(0,0,0,0.5);\n      background-clip: padding-box;\n      border: 6px solid transparent;\n    }\n  }\n  ::-webkit-scrollbar-corner {\n    background: transparent;\n  }\n  ${media.desktop`\n    &.JS-dialog-open {\n      right: 2.75rem;\n    }\n  `}\n  ${media.mobile`\n    left: 0.75rem;\n    right: 0.75rem;\n  `}\n`\n\nconst ToastBox = styled.div`\n  color: white;\n  font-size: 14px;\n  font-weight: 500;\n  border-radius: 12px;\n  flex-shrink: 0;\n  margin-top: 0.5rem;\n  overflow: hidden;\n  transition: 0.3s background ease, 0.4s opacity 1.5s;\n  ${media.desktop`\n    background: ${props => rgba(getColor(props.type)(props),ifUndefined(props.opacity,0.7))};\n    max-width: 300px;\n  `}\n  ${media.mobile`\n    background: ${props => rgba(getColor(props.type)(props),ifUndefined(props.opacity,0.8))};\n  `}\n  ${props => css`background: ${getColor(props.type)};`}\n`\nconst NotificationTitleContainer = styled.div`\n  background: rgba(0,0,0,0.1);\n  padding: 0.5rem 2.25rem 0.5rem 0.75rem;\n  border-radius: 12px 12px 0 0;\n  position: relative;\n  min-height: 30px;\n  font-size: 13px;\n  display: flex;\n  align-items: center;\n  font-weight: 400;\n  ${props => props.onClick && \"cursor: pointer;\"}\n`\nconst NotificationTitle = styled.div`\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n`\nconst NotificationContent = styled.div`\n  display: flex;\n  align-items: center;\n  text-align: left;\n  padding: 1rem 1.5rem;\n  ${media.mobile`\n    justify-content: center;\n  `}\n`\nconst NotificationIconWrapper = styled.div`\n  margin-right: 1rem;\n  position: relative;\n  width: 36px;\n  text-align: center;\n  flex-shrink: 0;\n  ${Icon} {\n    font-size: ${props => (props.isLoading ? 22 : (props.iconFontSize || 40))}px;\n  }\n`\nconst CloseIcon = styled(Icon).attrs({icon: 'x'})`\n  font-size: 20px;\n  cursor: pointer;\n  width: 2rem;\n  height: 2rem;\n  line-height: 2rem;\n  text-align: center;\n  position: absolute;\n  top: 50%;\n  right: 0.25rem;\n  transform: translateY(-50%);\n  border-radius: 100px;\n  opacity: 0.8;\n  :hover, :active {\n    background: rgba(0,0,0,0.1);\n    opacity: 1;\n  }\n`\nconst NotificationDetails = styled.div`\n  background: rgba(0,0,0,0.1);\n  border-radius: 8px;\n  padding: 1rem;\n  margin: 0 1rem 1rem;\n  font-weight: 400;\n  font-size: 13px;\n`\n\nconst [useToastNotifications, _useToastNotificationsRef,setToastNotifications] = willUseSharedState([])\nexport {useToastNotifications}\nconst formatNotification = (notification,extra) =>\n  _.isObject(notification)\n    ? {...notification,...extra, _key: getUID()}\n    : {type:\"success\",content:notification,...extra, _key: getUID()}\n\nexport const createToastNotification = (notification,timeout, closeCallback) => {\n  const uid = getUID()\n  let currentTimer = -1;\n  let hasClosed = false;\n  const close = () => {\n    clearTimeout(currentTimer);\n    if (hasClosed) return\n    setToastNotifications(_.differenceBy('uid',_, [{uid}]))\n    hasClosed = true\n    callIfFunction(closeCallback)\n  }\n  const notificationObj = formatNotification(notification,{uid,close})\n  setToastNotifications(_.concat(notificationObj))\n  if (timeout>0) {\n    currentTimer = setTimeout(close,timeout)\n  }\n  return {\n    close,\n    openWith:(obj,timeout) => {\n      clearTimeout(currentTimer);\n      if (timeout > 0) {\n        currentTimer = setTimeout(close,timeout)\n      }\n      const notificationObj = formatNotification(obj,{uid,close})\n      if (hasClosed) {\n        hasClosed = false\n        setToastNotifications(_.concat(notificationObj))\n      } else {\n        setToastNotifications(_.map(n => n.uid === uid ? {...notificationObj, _key: n._key} : n))\n      }\n    }\n  }\n}\nexport const useToastNotificationToggle = (notification,timeout) => {\n  const toggle = useToggle()\n  const extraProps = useMemo(() => notification.content || notification.element ? {} : notification,[])\n  const make = (notification,timeout) => notification && createToastNotification(formatNotification(notification,extraProps),timeout,() => toggle.close())\n  useEffect(() => {\n    if (notification.content || notification.element) {\n      toggle.openWith(make(notification))\n    }\n  },[])\n\n  return useMemo(() => ({\n    close: () => toggle.get()?.close(),\n    openWith: (notification,timeout) => toggle.get() ? toggle.get().openWith(formatNotification(notification,extraProps),timeout) : toggle.openWith(make(notification,timeout)),\n    open: () => toggle.get() ? toggle.get().openWith(formatNotification(notification,extraProps),timeout) : toggle.openWith(make(notification,timeout))\n  }),[toggle.isOpen])\n}\nexport const willShowToastNotification = (str,timeout) => () => createToastNotification(str,timeout)\n\nconst EXIT_ANIMATION_MS = 300\nconst TOAST_EASING = 'cubic-bezier(0.22, 0.61, 0.36, 1)'\nconst TOAST_TIMING = `${EXIT_ANIMATION_MS}ms ${TOAST_EASING}`\n\nconst animation = oneWayAnimation(\n  'transform: translateY(0); opacity: 1;',\n  'transform: translateY(0.25rem); opacity: 1;',\n  'transform: translateY(1rem); opacity: 0;'\n)\nconst removeAnimationReinsertPosition = e => e.style.position=''\nexport const ToastNotifications = () => {\n  const [notifications,setNotifications] = useToastNotifications()\n  const containerRef = useRef(null)\n  const {lockWidth, unlockWidth} = useNotificationContainerWidthLock(containerRef)\n\n  return (<Fill name=\"Notifications\">\n    <NotificationContainer ref={containerRef} className=\"JS-on-open-dialog\">\n      <FlipList animation={animation} timing={TOAST_TIMING} onReinsert={removeAnimationReinsertPosition} skipParentMorph anchoredDownList>\n        {\n          notifications.map(notification => {\n          const closeWithLock = () => {\n            lockWidth()\n            notification.close()\n              setTimeout(unlockWidth, EXIT_ANIMATION_MS)\n          }\n\n          return (\n            callIfFunction(notification.element,closeWithLock) ||\n            <ToastBox\n              key={`toast-${notification.uid}`}\n              type={notification.type}\n              onClick={notification.onClick}\n              opacity={notification.opacity}\n            >\n              {notification.title ? \n                <NotificationTitleContainer onClick={notification.onClickTitle ? (e) => notification.onClickTitle(e,closeWithLock) : undefined}>\n                  <NotificationTitle>{notification.title}</NotificationTitle>\n                  {notification.closeOnX && <CloseIcon onClick={constrainEvent(closeWithLock)}/>}\n                </NotificationTitleContainer>\n                :\n                notification.closeOnX && <CloseIcon onClick={closeWithLock}/>\n              }\n              <SwitchDiv on={notification._key}>\n                <NotificationContent>\n                  {notification.icon &&\n                    <NotificationIconWrapper\n                      isLoading={notification.isLoading}\n                      iconFontSize={notification.iconFontSize}\n                    >\n                      <Icon icon={notification.icon}/>\n                      {notification.isLoading && <Loading size={36} white absolute/>}\n                    </NotificationIconWrapper>\n                  }\n                  <div css=\"min-width: 0;\">{callIfFunction(notification.content,closeWithLock)}</div>\n                </NotificationContent>\n                {notification.details &&\n                  <NotificationDetails onClick={constrainEvent()}>\n                    {notification.details}\n                  </NotificationDetails>\n                }\n              </SwitchDiv>\n            </ToastBox>\n          )\n        })\n        }\n      </FlipList>\n    </NotificationContainer>\n  </Fill>)\n}\n\nconst useNotificationContainerWidthLock = (containerRef) => {\n  const lockCountRef = useRef(0)\n  const prevWidthRef = useRef(null)\n\n  const lockWidth = () => {\n    const el = containerRef.current\n    if (!el) return\n    if (lockCountRef.current === 0) {\n      prevWidthRef.current = el.style.width\n      const measured = el.getBoundingClientRect().width\n      el.style.width = measured + 'px'\n    }\n    lockCountRef.current = lockCountRef.current + 1\n  }\n\n  const unlockWidth = () => {\n    const el = containerRef.current\n    if (!el) return\n    const next = Math.max(0, lockCountRef.current - 1)\n    lockCountRef.current = next\n    if (next === 0) {\n      el.style.width = prevWidthRef.current || ''\n      prevWidthRef.current = null\n    }\n  }\n\n  return {lockWidth, unlockWidth}\n}"],"names":["NotificationContainer","styled","div","withConfig","displayName","componentId","media","desktop","_templateObject","_taggedTemplateLiteral","mobile","_templateObject2","_templateObject3","_templateObject4","ToastBox","_templateObject5","props","rgba","getColor","type","ifUndefined","opacity","_templateObject6","css","_templateObject7","NotificationTitleContainer","onClick","NotificationTitle","NotificationContent","_templateObject8","NotificationIconWrapper","Icon","isLoading","iconFontSize","CloseIcon","attrs","icon","NotificationDetails","useToastNotifications","_useToastNotificationsRef","setToastNotifications","willUseSharedState","formatNotification","notification","extra","_isObject","_objectSpread","_key","getUID","content","createToastNotification","timeout","closeCallback","uid","currentTimer","hasClosed","close","clearTimeout","_differenceBy","placeholder","callIfFunction","notificationObj","_concat","setTimeout","openWith","obj","_map","n","useToastNotificationToggle","toggle","useToggle","extraProps","useMemo","element","make","useEffect","_toggle$get","get","open","isOpen","willShowToastNotification","str","EXIT_ANIMATION_MS","TOAST_EASING","TOAST_TIMING","concat","animation","oneWayAnimation","removeAnimationReinsertPosition","e","style","position","ToastNotifications","notifications","setNotifications","containerRef","useRef","lockWidth","unlockWidth","useNotificationContainerWidthLock","React","createElement","Fill","name","ref","className","FlipList","timing","onReinsert","skipParentMorph","anchoredDownList","map","closeWithLock","key","title","onClickTitle","undefined","closeOnX","constrainEvent","SwitchDiv","on","Loading","size","white","absolute","_StyledDiv","details","lockCountRef","prevWidthRef","el","current","width","measured","getBoundingClientRect","next","Math","max"],"mappings":"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"}
+{"version":3,"file":"ToastNotifications.mjs","sources":["../src/ToastNotifications.jsx"],"sourcesContent":["import React, {useEffect, useMemo, useRef} from 'react'\nimport {oneWayAnimation, constrainEvent} from '@startlibs/utils'\nimport _ from 'lodash/fp'\nimport styled, {css} from 'styled-components'\nimport {rgba} from 'polished'\nimport {Fill, useToggle, willUseSharedState} from '@startlibs/core'\nimport {getUID, ifUndefined, media, callIfFunction, getColor} from '@startlibs/utils'\nimport {FlipList} from './FlipList'\nimport {Icon} from './Icon'\nimport {Loading} from './Loading'\nimport {SwitchDiv} from './SwitchDiv'\n\nconst NotificationContainer = styled.div `\n  position: fixed;\n  bottom: 0;\n  max-height: 100%;\n  z-index: 999999;  \n  display: flex;\n  flex-direction: column-reverse;\n  align-items: flex-end;\n  overflow-y: auto;\n  right: 1.5rem;\n  ${media.desktop`\n    padding-bottom: 1.5rem;\n  `}\n  ${media.mobile`\n    padding-bottom: 0.75rem;\n  `}\n  &::-webkit-scrollbar {\n    width: 21px;\n    height: 21px;\n  }\n  &::-webkit-scrollbar-thumb {\n    pointer-events: all;\n    background: rgba(0,0,0,0.4);\n    border-radius: 100px;\n    background-clip: padding-box;\n    border: 6px solid transparent;\n    min-height: 30px;\n    min-width: 30px;\n    &:hover {\n      background: rgba(0,0,0,0.5);\n      background-clip: padding-box;\n      border: 6px solid transparent;\n    }\n  }\n  &::-webkit-scrollbar-corner {\n    background: transparent;\n  }\n  ${media.desktop`\n    &.JS-dialog-open {\n      right: 2.75rem;\n    }\n  `}\n  ${media.mobile`\n    left: 0.75rem;\n    right: 0.75rem;\n  `}\n`\n\nconst ToastBox = styled.div`\n  color: white;\n  font-size: 14px;\n  font-weight: 500;\n  border-radius: 12px;\n  flex-shrink: 0;\n  margin-top: 0.5rem;\n  overflow: hidden;\n  transition: 0.3s background ease, 0.4s opacity 1.5s;\n  /* styled-components (stylis) hoista bloco aninhado de @media para depois do flat; o\n     yak preserva a ordem do fonte. Esse fallback sólido precisa vir ANTES dos media\n     abaixo, ou o yak aplicaria ele por último (ganhando sempre) nos dois breakpoints. */\n  ${props => css`background: ${getColor(props.type)};`}\n  ${media.desktop`\n    background: ${props => rgba(getColor(props.type)(props),ifUndefined(props.opacity,0.7))};\n    max-width: 300px;\n  `}\n  ${media.mobile`\n    background: ${props => rgba(getColor(props.type)(props),ifUndefined(props.opacity,0.8))};\n  `}\n`\nconst NotificationTitleContainer = styled.div`\n  background: rgba(0,0,0,0.1);\n  padding: 0.5rem 2.25rem 0.5rem 0.75rem;\n  border-radius: 12px 12px 0 0;\n  position: relative;\n  min-height: 30px;\n  font-size: 13px;\n  display: flex;\n  align-items: center;\n  font-weight: 400;\n  ${props => props.onClick && \"cursor: pointer;\"}\n`\nconst NotificationTitle = styled.div`\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  overflow: hidden;\n`\nconst NotificationContent = styled.div`\n  display: flex;\n  align-items: center;\n  text-align: left;\n  padding: 1rem 1.5rem;\n  ${media.mobile`\n    justify-content: center;\n  `}\n`\n// Task 13c: substitui a prop JSX `css=\"min-width: 0;\"` (R13 proíbe essa forma no yak) por um\n// styled component equivalente.\nconst NotificationContentBody = styled.div`\n  min-width: 0;\n`\nconst NotificationIconWrapper = styled.div`\n  margin-right: 1rem;\n  position: relative;\n  width: 36px;\n  text-align: center;\n  flex-shrink: 0;\n  ${Icon} {\n    font-size: ${props => (props.isLoading ? 22 : (props.iconFontSize || 40))}px;\n  }\n`\nconst CloseIcon = styled(Icon).attrs({icon: 'x'})`\n  font-size: 20px;\n  cursor: pointer;\n  width: 2rem;\n  height: 2rem;\n  line-height: 2rem;\n  text-align: center;\n  position: absolute;\n  top: 50%;\n  right: 0.25rem;\n  transform: translateY(-50%);\n  border-radius: 100px;\n  opacity: 0.8;\n  &:hover, &:active {\n    background: rgba(0,0,0,0.1);\n    opacity: 1;\n  }\n`\nconst NotificationDetails = styled.div`\n  background: rgba(0,0,0,0.1);\n  border-radius: 8px;\n  padding: 1rem;\n  margin: 0 1rem 1rem;\n  font-weight: 400;\n  font-size: 13px;\n`\n\nconst [useToastNotifications, _useToastNotificationsRef,setToastNotifications] = willUseSharedState([])\nexport {useToastNotifications}\nconst formatNotification = (notification,extra) =>\n  _.isObject(notification)\n    ? {...notification,...extra, _key: getUID()}\n    : {type:\"success\",content:notification,...extra, _key: getUID()}\n\nexport const createToastNotification = (notification,timeout, closeCallback) => {\n  const uid = getUID()\n  let currentTimer = -1;\n  let hasClosed = false;\n  const close = () => {\n    clearTimeout(currentTimer);\n    if (hasClosed) return\n    setToastNotifications(_.differenceBy('uid',_, [{uid}]))\n    hasClosed = true\n    callIfFunction(closeCallback)\n  }\n  const notificationObj = formatNotification(notification,{uid,close})\n  setToastNotifications(_.concat(notificationObj))\n  if (timeout>0) {\n    currentTimer = setTimeout(close,timeout)\n  }\n  return {\n    close,\n    openWith:(obj,timeout) => {\n      clearTimeout(currentTimer);\n      if (timeout > 0) {\n        currentTimer = setTimeout(close,timeout)\n      }\n      const notificationObj = formatNotification(obj,{uid,close})\n      if (hasClosed) {\n        hasClosed = false\n        setToastNotifications(_.concat(notificationObj))\n      } else {\n        setToastNotifications(_.map(n => n.uid === uid ? {...notificationObj, _key: n._key} : n))\n      }\n    }\n  }\n}\nexport const useToastNotificationToggle = (notification,timeout) => {\n  const toggle = useToggle()\n  const extraProps = useMemo(() => notification.content || notification.element ? {} : notification,[])\n  const make = (notification,timeout) => notification && createToastNotification(formatNotification(notification,extraProps),timeout,() => toggle.close())\n  useEffect(() => {\n    if (notification.content || notification.element) {\n      toggle.openWith(make(notification))\n    }\n  },[])\n\n  return useMemo(() => ({\n    close: () => toggle.get()?.close(),\n    openWith: (notification,timeout) => toggle.get() ? toggle.get().openWith(formatNotification(notification,extraProps),timeout) : toggle.openWith(make(notification,timeout)),\n    open: () => toggle.get() ? toggle.get().openWith(formatNotification(notification,extraProps),timeout) : toggle.openWith(make(notification,timeout))\n  }),[toggle.isOpen])\n}\nexport const willShowToastNotification = (str,timeout) => () => createToastNotification(str,timeout)\n\nconst EXIT_ANIMATION_MS = 300\nconst TOAST_EASING = 'cubic-bezier(0.22, 0.61, 0.36, 1)'\nconst TOAST_TIMING = `${EXIT_ANIMATION_MS}ms ${TOAST_EASING}`\n\nconst animation = oneWayAnimation(\n  'transform: translateY(0); opacity: 1;',\n  'transform: translateY(0.25rem); opacity: 1;',\n  'transform: translateY(1rem); opacity: 0;'\n)\nconst removeAnimationReinsertPosition = e => e.style.position=''\nexport const ToastNotifications = () => {\n  const [notifications,setNotifications] = useToastNotifications()\n  const containerRef = useRef(null)\n  const {lockWidth, unlockWidth} = useNotificationContainerWidthLock(containerRef)\n\n  return (<Fill name=\"Notifications\">\n    <NotificationContainer ref={containerRef} className=\"JS-on-open-dialog\">\n      <FlipList animation={animation} timing={TOAST_TIMING} onReinsert={removeAnimationReinsertPosition} skipParentMorph anchoredDownList>\n        {\n          notifications.map(notification => {\n          const closeWithLock = () => {\n            lockWidth()\n            notification.close()\n              setTimeout(unlockWidth, EXIT_ANIMATION_MS)\n          }\n\n          return (\n            callIfFunction(notification.element,closeWithLock) ||\n            <ToastBox\n              key={`toast-${notification.uid}`}\n              type={notification.type}\n              onClick={notification.onClick}\n              opacity={notification.opacity}\n            >\n              {notification.title ? \n                <NotificationTitleContainer onClick={notification.onClickTitle ? (e) => notification.onClickTitle(e,closeWithLock) : undefined}>\n                  <NotificationTitle>{notification.title}</NotificationTitle>\n                  {notification.closeOnX && <CloseIcon onClick={constrainEvent(closeWithLock)}/>}\n                </NotificationTitleContainer>\n                :\n                notification.closeOnX && <CloseIcon onClick={closeWithLock}/>\n              }\n              <SwitchDiv on={notification._key}>\n                <NotificationContent>\n                  {notification.icon &&\n                    <NotificationIconWrapper\n                      isLoading={notification.isLoading}\n                      iconFontSize={notification.iconFontSize}\n                    >\n                      <Icon icon={notification.icon}/>\n                      {notification.isLoading && <Loading size={36} white absolute/>}\n                    </NotificationIconWrapper>\n                  }\n                  <NotificationContentBody>{callIfFunction(notification.content,closeWithLock)}</NotificationContentBody>\n                </NotificationContent>\n                {notification.details &&\n                  <NotificationDetails onClick={constrainEvent()}>\n                    {notification.details}\n                  </NotificationDetails>\n                }\n              </SwitchDiv>\n            </ToastBox>\n          )\n        })\n        }\n      </FlipList>\n    </NotificationContainer>\n  </Fill>)\n}\n\nconst useNotificationContainerWidthLock = (containerRef) => {\n  const lockCountRef = useRef(0)\n  const prevWidthRef = useRef(null)\n\n  const lockWidth = () => {\n    const el = containerRef.current\n    if (!el) return\n    if (lockCountRef.current === 0) {\n      prevWidthRef.current = el.style.width\n      const measured = el.getBoundingClientRect().width\n      el.style.width = measured + 'px'\n    }\n    lockCountRef.current = lockCountRef.current + 1\n  }\n\n  const unlockWidth = () => {\n    const el = containerRef.current\n    if (!el) return\n    const next = Math.max(0, lockCountRef.current - 1)\n    lockCountRef.current = next\n    if (next === 0) {\n      el.style.width = prevWidthRef.current || ''\n      prevWidthRef.current = null\n    }\n  }\n\n  return {lockWidth, unlockWidth}\n}"],"names":["NotificationContainer","styled","div","withConfig","displayName","componentId","media","desktop","_templateObject","_taggedTemplateLiteral","mobile","_templateObject2","_templateObject3","_templateObject4","ToastBox","props","css","getColor","type","_templateObject5","rgba","ifUndefined","opacity","_templateObject6","NotificationTitleContainer","onClick","NotificationTitle","NotificationContent","_templateObject7","NotificationContentBody","NotificationIconWrapper","Icon","isLoading","iconFontSize","CloseIcon","attrs","icon","NotificationDetails","useToastNotifications","_useToastNotificationsRef","setToastNotifications","willUseSharedState","formatNotification","notification","extra","_isObject","_objectSpread","_key","getUID","content","createToastNotification","timeout","closeCallback","uid","currentTimer","hasClosed","close","clearTimeout","_differenceBy","placeholder","callIfFunction","notificationObj","_concat","setTimeout","openWith","obj","_map","n","useToastNotificationToggle","toggle","useToggle","extraProps","useMemo","element","make","useEffect","_toggle$get","get","open","isOpen","willShowToastNotification","str","EXIT_ANIMATION_MS","TOAST_EASING","TOAST_TIMING","concat","animation","oneWayAnimation","removeAnimationReinsertPosition","e","style","position","ToastNotifications","notifications","setNotifications","containerRef","useRef","lockWidth","unlockWidth","useNotificationContainerWidthLock","React","createElement","Fill","name","ref","className","FlipList","timing","onReinsert","skipParentMorph","anchoredDownList","map","closeWithLock","key","title","onClickTitle","undefined","closeOnX","constrainEvent","SwitchDiv","on","Loading","size","white","absolute","details","lockCountRef","prevWidthRef","el","current","width","measured","getBoundingClientRect","next","Math","max"],"mappings":"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"}

package/lib/alt/dialogs/DialogWithImageHeader.mjs

@@ -8,7 +8,7 @@ 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    "]))));
+})(["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

@@ -1 +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;;;;"}
+{"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,ibAAA,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

@@ -10,7 +10,7 @@ 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"];
+const _excluded = ["className", "style", "tabIsOpen", "menuIsOpen", "sidebar", "Content", "openTab", "children", "title"];
 var _templateObject, _templateObject2, _templateObject3;
 const SideMenu = /*#__PURE__*/styled.div.withConfig({
   displayName: "DialogWithSidebar__SideMenu",
@@ -19,7 +19,7 @@ const SideMenu = /*#__PURE__*/styled.div.withConfig({
 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  ");
+})(["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];
@@ -29,6 +29,7 @@ const MENU_TAB = '$menu$';
 const DialogWithSidebarPresentation = _ref => {
   let {
       className,
+      style,
       tabIsOpen,
       menuIsOpen,
       sidebar,
@@ -51,6 +52,7 @@ const DialogWithSidebarPresentation = _ref => {
     } = _ref2;
     return /*#__PURE__*/React.createElement("div", {
       className: className + " JS-has-wc",
+      style: style,
       ref: ref
     }, props.closeDialog && /*#__PURE__*/React.createElement(CloseIcon, {
       onClick: confirmCloseDialog
@@ -94,9 +96,11 @@ const TabContent = _ref3 => {
     className: "dialog-content"
   }, callIfFunction(Content, tab), callIfFunction(children, tab));
 };
+
+// R6: "as" não existe no yak. Dialog expõe "tagAs" no lugar (ver Dialog.jsx).
 const DialogWithSidebar = /*#__PURE__*/styled(props => /*#__PURE__*/React.createElement(Dialog, _extends({
   fullscreenOnMobile: true,
-  as: DialogWithSidebarPresentation
+  tagAs: DialogWithSidebarPresentation
 }, props))).withConfig({
   displayName: "DialogWithSidebar",
   componentId: "sc-suvg9r-2"

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

@@ -1 +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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"}
+{"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, style, 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\"} style={style} 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\n// R6: \"as\" não existe no yak. Dialog expõe \"tagAs\" no lugar (ver Dialog.jsx).\nexport const DialogWithSidebar = styled((props) => <Dialog fullscreenOnMobile tagAs={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","style","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","tagAs","_templateObject3"],"mappings":"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"}

package/lib/alt/dialogs/MobileBubbleDialog.mjs

@@ -10,7 +10,7 @@ const _excluded = ["className", "footer", "Content", "children", "title", "illus
 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'));
+})(["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,

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

@@ -1 +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;;;;"}
+{"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,oQAAAA,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;;;;"}