@consumidor-positivo/aurora 0.0.188 → 0.0.190

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14,9 +14,10 @@ export type AlertProps = {
14
14
  onClick?: () => void;
15
15
  };
16
16
  closeButton?: boolean;
17
+ customIcon?: JSX.Element;
17
18
  children?: React.ReactNode;
18
19
  countdown?: number;
19
20
  onCountdownEnd?: () => void;
20
21
  onCloseButton?: () => void;
21
22
  };
22
- export declare const Alert: ({ showIcon, status, type, orientation, title, text, actionButton, closeButton, children, countdown, onCountdownEnd, onCloseButton, }: AlertProps) => import("react/jsx-runtime").JSX.Element | null;
23
+ export declare const Alert: ({ showIcon, status, type, orientation, title, text, actionButton, closeButton, children, countdown, onCountdownEnd, onCloseButton, customIcon }: AlertProps) => import("react/jsx-runtime").JSX.Element | null;
@@ -23,7 +23,8 @@ import './styles.css';const Alert = ({
23
23
  children,
24
24
  countdown = 59,
25
25
  onCountdownEnd,
26
- onCloseButton
26
+ onCloseButton,
27
+ customIcon
27
28
  }) => {
28
29
  const [isClosed, setIsClosed] = useState(false);
29
30
  const [timeLeft, setTimeLeft] = useState(countdown);
@@ -96,7 +97,7 @@ import './styles.css';const Alert = ({
96
97
  if (isClosed) return null;
97
98
  return /* @__PURE__ */ jsxs("div", { className: alertClasses, children: [
98
99
  /* @__PURE__ */ jsxs("div", { className: "au-alert__content", children: [
99
- /* @__PURE__ */ jsx(Conditional, { condition: showIcon, renderIf: statusMap[status].icon }),
100
+ /* @__PURE__ */ jsx(Conditional, { condition: showIcon, renderIf: customIcon ? customIcon : statusMap[status].icon }),
100
101
  /* @__PURE__ */ jsxs("div", { className: `au-alert__container--${orientation}`, children: [
101
102
  /* @__PURE__ */ jsx(
102
103
  Conditional,
@@ -1 +1 @@
1
- {"version":3,"file":"index.es.js","sources":["../../../lib/components/Alert/index.tsx"],"sourcesContent":["import { useState, useEffect } from 'react'\nimport classNames from 'classnames'\nimport {\n IconAlertOctagon,\n IconAlertTriangle,\n IconCheck,\n IconInfo,\n IconX,\n IconClock,\n} from '@components/icons'\nimport {\n COLOR_ERROR_50,\n COLOR_INFO_50,\n COLOR_NEUTRAL_70,\n COLOR_SUCCESS_50,\n COLOR_WARNING_50,\n} from '@core/tokens'\nimport { Conditional } from '@components/misc'\nimport { Text } from '@components/Text'\nimport './styles.scss'\n\nexport type AlertProps = {\n showIcon?: boolean\n status?: 'success' | 'error' | 'warning' | 'info' | 'timer'\n type?: 1 | 2\n orientation?: 'horizontal' | 'vertical'\n title?: { content?: React.ReactNode; weight?: 'bold' | 'normal' }\n text?: React.ReactNode\n actionButton?: { content?: string; onClick?: () => void }\n closeButton?: boolean\n children?: React.ReactNode\n countdown?: number\n onCountdownEnd?: () => void\n onCloseButton?: () => void\n}\n\nexport const Alert = ({\n showIcon = true,\n status = 'info',\n type = 1,\n orientation = 'horizontal',\n title,\n text,\n actionButton,\n closeButton = false,\n children,\n countdown = 59,\n onCountdownEnd,\n onCloseButton,\n}: AlertProps) => {\n const [isClosed, setIsClosed] = useState(false)\n const [timeLeft, setTimeLeft] = useState(countdown)\n const [isCountdownFinished, setIsCountdownFinished] = useState(false)\n\n useEffect(() => {\n if (status !== 'timer' || timeLeft <= 0) return\n\n const timer = setInterval(() => {\n setTimeLeft((prev) => {\n if (prev <= 1) {\n clearInterval(timer)\n setIsCountdownFinished(true)\n if (onCountdownEnd) onCountdownEnd()\n }\n return prev - 1\n })\n }, 1000)\n\n return () => clearInterval(timer)\n }, [status, timeLeft, onCountdownEnd])\n\n useEffect(() => {\n if (timeLeft > 0) {\n setIsCountdownFinished(false)\n }\n }, [timeLeft])\n\n const handleActionClick = () => {\n setTimeLeft(countdown)\n setIsCountdownFinished(false)\n actionButton?.onClick?.()\n }\n\n const handleCloseButtonClick = () => {\n setIsClosed(true)\n onCloseButton?.()\n }\n\n const statusMap = {\n success: {\n option: 'success',\n icon: <IconCheck rawColor={COLOR_SUCCESS_50} />,\n },\n error: {\n option: 'error',\n icon: <IconAlertOctagon rawColor={COLOR_ERROR_50} />,\n },\n warning: {\n option: 'warning',\n icon: <IconAlertTriangle rawColor={COLOR_WARNING_50} />,\n },\n info: { option: 'info', icon: <IconInfo rawColor={COLOR_INFO_50} /> },\n timer: {\n option: 'timer',\n icon: (\n <div className=\"au-alert__timer\">\n <IconClock rawColor={COLOR_WARNING_50} />\n {!isCountdownFinished && (\n <Text\n className=\"au-alert__countdown\"\n variant=\"body-small\"\n weight=\"bold\">\n {timeLeft}s\n </Text>\n )}\n </div>\n ),\n },\n }\n\n const alertClasses = classNames('au-alert', {\n [`au-alert--${statusMap[status].option}--type-${type}`]:\n statusMap[status].option,\n })\n\n if (isClosed) return null\n\n return (\n <div className={alertClasses}>\n <div className=\"au-alert__content\">\n <Conditional condition={showIcon} renderIf={statusMap[status].icon} />\n <div className={`au-alert__container--${orientation}`}>\n <Conditional\n condition={!!title || !!text}\n renderIf={\n <div>\n <h4\n className={`au-alert__title au-alert__title--${title?.weight}`}>\n {title?.content}\n </h4>\n <p className=\"au-alert__support-text\">{text}</p>\n </div>\n }\n />\n\n {children}\n <Conditional\n condition={\n !!actionButton && (status !== 'timer' || isCountdownFinished)\n }\n renderIf={\n <button\n className=\"au-alert__action-btn\"\n onClick={handleActionClick}>\n {actionButton?.content}\n </button>\n }\n />\n </div>\n </div>\n\n <Conditional\n condition={closeButton}\n renderIf={\n <button className=\"au-alert__close-btn\">\n <IconX\n rawColor={COLOR_NEUTRAL_70}\n onClick={handleCloseButtonClick}\n />\n </button>\n }\n />\n </div>\n )\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.es.js","sources":["../../../lib/components/Alert/index.tsx"],"sourcesContent":["import { useState, useEffect } from 'react'\nimport classNames from 'classnames'\nimport {\n IconAlertOctagon,\n IconAlertTriangle,\n IconCheck,\n IconInfo,\n IconX,\n IconClock,\n} from '@components/icons'\nimport {\n COLOR_ERROR_50,\n COLOR_INFO_50,\n COLOR_NEUTRAL_70,\n COLOR_SUCCESS_50,\n COLOR_WARNING_50,\n} from '@core/tokens'\nimport { Conditional } from '@components/misc'\nimport { Text } from '@components/Text'\nimport './styles.scss'\n\nexport type AlertProps = {\n showIcon?: boolean\n status?: 'success' | 'error' | 'warning' | 'info' | 'timer'\n type?: 1 | 2\n orientation?: 'horizontal' | 'vertical'\n title?: { content?: React.ReactNode; weight?: 'bold' | 'normal' }\n text?: React.ReactNode\n actionButton?: { content?: string; onClick?: () => void }\n closeButton?: boolean\n customIcon?: JSX.Element\n children?: React.ReactNode\n countdown?: number\n onCountdownEnd?: () => void\n onCloseButton?: () => void\n}\n\nexport const Alert = ({\n showIcon = true,\n status = 'info',\n type = 1,\n orientation = 'horizontal',\n title,\n text,\n actionButton,\n closeButton = false,\n children,\n countdown = 59,\n onCountdownEnd,\n onCloseButton,\n customIcon\n}: AlertProps) => {\n const [isClosed, setIsClosed] = useState(false)\n const [timeLeft, setTimeLeft] = useState(countdown)\n const [isCountdownFinished, setIsCountdownFinished] = useState(false)\n\n useEffect(() => {\n if (status !== 'timer' || timeLeft <= 0) return\n\n const timer = setInterval(() => {\n setTimeLeft((prev) => {\n if (prev <= 1) {\n clearInterval(timer)\n setIsCountdownFinished(true)\n if (onCountdownEnd) onCountdownEnd()\n }\n return prev - 1\n })\n }, 1000)\n\n return () => clearInterval(timer)\n }, [status, timeLeft, onCountdownEnd])\n\n useEffect(() => {\n if (timeLeft > 0) {\n setIsCountdownFinished(false)\n }\n }, [timeLeft])\n\n const handleActionClick = () => {\n setTimeLeft(countdown)\n setIsCountdownFinished(false)\n actionButton?.onClick?.()\n }\n\n const handleCloseButtonClick = () => {\n setIsClosed(true)\n onCloseButton?.()\n }\n\n const statusMap = {\n success: {\n option: 'success',\n icon: <IconCheck rawColor={COLOR_SUCCESS_50} />,\n },\n error: {\n option: 'error',\n icon: <IconAlertOctagon rawColor={COLOR_ERROR_50} />,\n },\n warning: {\n option: 'warning',\n icon: <IconAlertTriangle rawColor={COLOR_WARNING_50} />,\n },\n info: { option: 'info', icon: <IconInfo rawColor={COLOR_INFO_50} /> },\n timer: {\n option: 'timer',\n icon: (\n <div className=\"au-alert__timer\">\n <IconClock rawColor={COLOR_WARNING_50} />\n {!isCountdownFinished && (\n <Text\n className=\"au-alert__countdown\"\n variant=\"body-small\"\n weight=\"bold\">\n {timeLeft}s\n </Text>\n )}\n </div>\n ),\n },\n }\n\n const alertClasses = classNames('au-alert', {\n [`au-alert--${statusMap[status].option}--type-${type}`]:\n statusMap[status].option,\n })\n\n if (isClosed) return null\n\n return (\n <div className={alertClasses}>\n <div className=\"au-alert__content\">\n <Conditional condition={showIcon} renderIf={ customIcon ? customIcon : statusMap[status].icon} />\n <div className={`au-alert__container--${orientation}`}>\n <Conditional\n condition={!!title || !!text}\n renderIf={\n <div>\n <h4\n className={`au-alert__title au-alert__title--${title?.weight}`}>\n {title?.content}\n </h4>\n <p className=\"au-alert__support-text\">{text}</p>\n </div>\n }\n />\n\n {children}\n <Conditional\n condition={\n !!actionButton && (status !== 'timer' || isCountdownFinished)\n }\n renderIf={\n <button\n className=\"au-alert__action-btn\"\n onClick={handleActionClick}>\n {actionButton?.content}\n </button>\n }\n />\n </div>\n </div>\n\n <Conditional\n condition={closeButton}\n renderIf={\n <button className=\"au-alert__close-btn\">\n <IconX\n rawColor={COLOR_NEUTRAL_70}\n onClick={handleCloseButtonClick}\n />\n </button>\n }\n />\n </div>\n )\n}\n"],"names":[],"mappings":"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"}
@@ -9,6 +9,7 @@ export type CardRootProps = {
9
9
  maxHeight?: number;
10
10
  paddingLess?: boolean;
11
11
  hoverShadow?: boolean;
12
+ className?: string;
12
13
  children: ReactNode;
13
14
  };
14
- export declare const CardRoot: ({ border, color, width, height, maxWidth, maxHeight, hoverShadow, paddingLess, children, }: CardRootProps) => import("react/jsx-runtime").JSX.Element;
15
+ export declare const CardRoot: ({ border, color, width, height, maxWidth, maxHeight, hoverShadow, paddingLess, children, className }: CardRootProps) => import("react/jsx-runtime").JSX.Element;
package/dist/main.es.js CHANGED
@@ -370,13 +370,15 @@ const CardRoot = ({
370
370
  maxHeight,
371
371
  hoverShadow,
372
372
  paddingLess,
373
- children
373
+ children,
374
+ className
374
375
  }) => {
375
376
  const rootClasses = classNames("au-card__root", {
376
377
  "au-card__root--border-none": !border,
377
378
  "au-card__root--color-secondary": color === "secondary",
378
379
  "au-card__root--with-hover-shadow": !!hoverShadow,
379
- "au-card__root--paddingless": !!paddingLess
380
+ "au-card__root--paddingless": !!paddingLess,
381
+ [String(className)]: !!className
380
382
  });
381
383
  const rootSize = {
382
384
  width: `${width}px`,
@@ -1 +1 @@
1
- {"version":3,"file":"main.es.js","sources":["../lib/components/Card/Image/index.tsx","../lib/components/Card/Root/index.tsx","../lib/components/Card/Tag/index.tsx","../lib/components/Card/index.tsx","../lib/components/Drawer/hooks.ts"],"sourcesContent":["import { CSSProperties } from 'react'\n\nexport type CardImageProps = {\n src: string\n alt?: string\n width?: number\n height?: number\n}\nexport const CardImage = ({ src, alt, width, height }: CardImageProps) => {\n const imageSize: CSSProperties = {\n width: `${width}px`,\n height: `${height}px`,\n }\n\n return (\n <div>\n <img style={imageSize} src={src} alt={alt} />\n </div>\n )\n}\n","import classNames from 'classnames'\nimport { CSSProperties, ReactNode } from 'react'\n\nexport type CardRootProps = {\n border?: boolean\n color?: 'primary' | 'secondary'\n width?: number\n height?: number\n maxWidth?: number\n maxHeight?: number\n paddingLess?: boolean;\n hoverShadow?: boolean\n children: ReactNode\n}\nexport const CardRoot = ({\n border = true,\n color = 'primary',\n width,\n height,\n maxWidth,\n maxHeight,\n hoverShadow,\n paddingLess,\n children,\n}: CardRootProps) => {\n const rootClasses = classNames('au-card__root', {\n 'au-card__root--border-none': !border,\n 'au-card__root--color-secondary': color === 'secondary',\n 'au-card__root--with-hover-shadow': !!hoverShadow,\n 'au-card__root--paddingless': !!paddingLess\n })\n const rootSize: CSSProperties = {\n width: `${width}px`,\n height: `${height}px`,\n maxWidth: `${maxWidth}px`,\n maxHeight: `${maxHeight}px`\n }\n\n return (\n <div\n style={rootSize}\n className={rootClasses}>\n {children}\n </div>\n )\n}\n","import classNames from 'classnames'\nimport { ReactNode } from 'react'\n\nexport type CardTagProps = {\n color?: 'primary' | 'secondary'\n icon?: ReactNode\n children: ReactNode\n}\nexport const CardTag = ({\n color = 'primary',\n icon,\n children,\n}: CardTagProps) => {\n const tagClasses = classNames('au-card__tag', {\n 'au-card__tag--primary': color === 'primary',\n 'au-card__tag--secondary': color === 'secondary',\n })\n return (\n <div className={tagClasses}>\n <span>{icon}</span>\n <span>{children}</span>\n </div>\n )\n}\n","import { CardContainer, CardContainerProps } from './Container'\nimport { CardEmphasis, CardEmphasisProps } from './Emphasis'\nimport { CardImage, CardImageProps } from './Image'\nimport { CardRoot, CardRootProps } from './Root'\nimport { CardTag, CardTagProps } from './Tag'\nimport './styles.scss'\n\ntype Components = {\n Root: React.FC<CardRootProps>\n Container: React.FC<CardContainerProps>\n Emphasis: React.FC<CardEmphasisProps>\n Image: React.FC<CardImageProps>\n Tag: React.FC<CardTagProps>\n}\n\nconst components: Components = {\n Root: CardRoot,\n Container: CardContainer,\n Emphasis: CardEmphasis,\n Image: CardImage,\n Tag: CardTag,\n}\n\nObject.keys(components).forEach((key) => {\n const component = components[key as keyof Components]\n component.displayName = `Card.${key}`\n})\n\nexport { components as Card }\n","import { useState } from 'react'\n\ntype UseDrawerProps = Record<string, boolean>\n\nexport function useDrawer(props: UseDrawerProps) {\n const [drawerOpen, setDrawerOpen] = useState<UseDrawerProps>(props)\n\n function handleOpenDrawer(name: string) {\n setDrawerOpen((prev) => {\n return {\n ...prev,\n [name]: !prev[name],\n }\n })\n }\n\n return {\n handleOpenDrawer,\n drawerOpen,\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQO,MAAM,YAAY,CAAC,EAAE,KAAK,KAAK,OAAO,aAA6B;AACxE,QAAM,YAA2B;AAAA,IAC/B,OAAO,GAAG,KAAK;AAAA,IACf,QAAQ,GAAG,MAAM;AAAA,EAAA;AAIjB,SAAA,oBAAC,SACC,UAAC,oBAAA,OAAA,EAAI,OAAO,WAAW,KAAU,IAAU,CAAA,EAC7C,CAAA;AAEJ;ACLO,MAAM,WAAW,CAAC;AAAA,EACvB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAqB;AACb,QAAA,cAAc,WAAW,iBAAiB;AAAA,IAC9C,8BAA8B,CAAC;AAAA,IAC/B,kCAAkC,UAAU;AAAA,IAC5C,oCAAoC,CAAC,CAAC;AAAA,IACtC,8BAA8B,CAAC,CAAC;AAAA,EAAA,CACjC;AACD,QAAM,WAA0B;AAAA,IAC9B,OAAO,GAAG,KAAK;AAAA,IACf,QAAQ,GAAG,MAAM;AAAA,IACjB,UAAU,GAAG,QAAQ;AAAA,IACrB,WAAW,GAAG,SAAS;AAAA,EAAA;AAIvB,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,MACP,WAAW;AAAA,MACV;AAAA,IAAA;AAAA,EAAA;AAGP;ACrCO,MAAM,UAAU,CAAC;AAAA,EACtB,QAAQ;AAAA,EACR;AAAA,EACA;AACF,MAAoB;AACZ,QAAA,aAAa,WAAW,gBAAgB;AAAA,IAC5C,yBAAyB,UAAU;AAAA,IACnC,2BAA2B,UAAU;AAAA,EAAA,CACtC;AAEC,SAAA,qBAAC,OAAI,EAAA,WAAW,YACd,UAAA;AAAA,IAAA,oBAAC,UAAM,UAAK,KAAA,CAAA;AAAA,IACZ,oBAAC,UAAM,UAAS;AAAA,EAClB,EAAA,CAAA;AAEJ;ACRA,MAAM,aAAyB;AAAA,EAC7B,MAAM;AAAA,EACN,WAAW;AAAA,EACX,UAAU;AAAA,EACV,OAAO;AAAA,EACP,KAAK;AACP;AAEA,OAAO,KAAK,UAAU,EAAE,QAAQ,CAAC,QAAQ;AACjC,QAAA,YAAY,WAAW,GAAuB;AAC1C,YAAA,cAAc,QAAQ,GAAG;AACrC,CAAC;ACtBM,SAAS,UAAU,OAAuB;AAC/C,QAAM,CAAC,YAAY,aAAa,IAAI,SAAyB,KAAK;AAElE,WAAS,iBAAiB,MAAc;AACtC,kBAAc,CAAC,SAAS;AACf,aAAA;AAAA,QACL,GAAG;AAAA,QACH,CAAC,IAAI,GAAG,CAAC,KAAK,IAAI;AAAA,MAAA;AAAA,IACpB,CACD;AAAA,EACH;AAEO,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;"}
1
+ {"version":3,"file":"main.es.js","sources":["../lib/components/Card/Image/index.tsx","../lib/components/Card/Root/index.tsx","../lib/components/Card/Tag/index.tsx","../lib/components/Card/index.tsx","../lib/components/Drawer/hooks.ts"],"sourcesContent":["import { CSSProperties } from 'react'\n\nexport type CardImageProps = {\n src: string\n alt?: string\n width?: number\n height?: number\n}\nexport const CardImage = ({ src, alt, width, height }: CardImageProps) => {\n const imageSize: CSSProperties = {\n width: `${width}px`,\n height: `${height}px`,\n }\n\n return (\n <div>\n <img style={imageSize} src={src} alt={alt} />\n </div>\n )\n}\n","import classNames from 'classnames'\nimport { CSSProperties, ReactNode } from 'react'\n\nexport type CardRootProps = {\n border?: boolean\n color?: 'primary' | 'secondary'\n width?: number\n height?: number\n maxWidth?: number\n maxHeight?: number\n paddingLess?: boolean;\n hoverShadow?: boolean\n className?: string;\n children: ReactNode\n}\nexport const CardRoot = ({\n border = true,\n color = 'primary',\n width,\n height,\n maxWidth,\n maxHeight,\n hoverShadow,\n paddingLess,\n children,\n className\n}: CardRootProps) => {\n const rootClasses = classNames('au-card__root', {\n 'au-card__root--border-none': !border,\n 'au-card__root--color-secondary': color === 'secondary',\n 'au-card__root--with-hover-shadow': !!hoverShadow,\n 'au-card__root--paddingless': !!paddingLess,\n [String(className)]: !!className\n })\n const rootSize: CSSProperties = {\n width: `${width}px`,\n height: `${height}px`,\n maxWidth: `${maxWidth}px`,\n maxHeight: `${maxHeight}px`\n }\n\n return (\n <div\n style={rootSize}\n className={rootClasses}>\n {children}\n </div>\n )\n}\n","import classNames from 'classnames'\nimport { ReactNode } from 'react'\n\nexport type CardTagProps = {\n color?: 'primary' | 'secondary'\n icon?: ReactNode\n children: ReactNode\n}\nexport const CardTag = ({\n color = 'primary',\n icon,\n children,\n}: CardTagProps) => {\n const tagClasses = classNames('au-card__tag', {\n 'au-card__tag--primary': color === 'primary',\n 'au-card__tag--secondary': color === 'secondary',\n })\n return (\n <div className={tagClasses}>\n <span>{icon}</span>\n <span>{children}</span>\n </div>\n )\n}\n","import { CardContainer, CardContainerProps } from './Container'\nimport { CardEmphasis, CardEmphasisProps } from './Emphasis'\nimport { CardImage, CardImageProps } from './Image'\nimport { CardRoot, CardRootProps } from './Root'\nimport { CardTag, CardTagProps } from './Tag'\nimport './styles.scss'\n\ntype Components = {\n Root: React.FC<CardRootProps>\n Container: React.FC<CardContainerProps>\n Emphasis: React.FC<CardEmphasisProps>\n Image: React.FC<CardImageProps>\n Tag: React.FC<CardTagProps>\n}\n\nconst components: Components = {\n Root: CardRoot,\n Container: CardContainer,\n Emphasis: CardEmphasis,\n Image: CardImage,\n Tag: CardTag,\n}\n\nObject.keys(components).forEach((key) => {\n const component = components[key as keyof Components]\n component.displayName = `Card.${key}`\n})\n\nexport { components as Card }\n","import { useState } from 'react'\n\ntype UseDrawerProps = Record<string, boolean>\n\nexport function useDrawer(props: UseDrawerProps) {\n const [drawerOpen, setDrawerOpen] = useState<UseDrawerProps>(props)\n\n function handleOpenDrawer(name: string) {\n setDrawerOpen((prev) => {\n return {\n ...prev,\n [name]: !prev[name],\n }\n })\n }\n\n return {\n handleOpenDrawer,\n drawerOpen,\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQO,MAAM,YAAY,CAAC,EAAE,KAAK,KAAK,OAAO,aAA6B;AACxE,QAAM,YAA2B;AAAA,IAC/B,OAAO,GAAG,KAAK;AAAA,IACf,QAAQ,GAAG,MAAM;AAAA,EAAA;AAIjB,SAAA,oBAAC,SACC,UAAC,oBAAA,OAAA,EAAI,OAAO,WAAW,KAAU,IAAU,CAAA,EAC7C,CAAA;AAEJ;ACJO,MAAM,WAAW,CAAC;AAAA,EACvB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAqB;AACb,QAAA,cAAc,WAAW,iBAAiB;AAAA,IAC9C,8BAA8B,CAAC;AAAA,IAC/B,kCAAkC,UAAU;AAAA,IAC5C,oCAAoC,CAAC,CAAC;AAAA,IACtC,8BAA8B,CAAC,CAAC;AAAA,IAChC,CAAC,OAAO,SAAS,CAAC,GAAG,CAAC,CAAC;AAAA,EAAA,CACxB;AACD,QAAM,WAA0B;AAAA,IAC9B,OAAO,GAAG,KAAK;AAAA,IACf,QAAQ,GAAG,MAAM;AAAA,IACjB,UAAU,GAAG,QAAQ;AAAA,IACrB,WAAW,GAAG,SAAS;AAAA,EAAA;AAIvB,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,MACP,WAAW;AAAA,MACV;AAAA,IAAA;AAAA,EAAA;AAGP;ACxCO,MAAM,UAAU,CAAC;AAAA,EACtB,QAAQ;AAAA,EACR;AAAA,EACA;AACF,MAAoB;AACZ,QAAA,aAAa,WAAW,gBAAgB;AAAA,IAC5C,yBAAyB,UAAU;AAAA,IACnC,2BAA2B,UAAU;AAAA,EAAA,CACtC;AAEC,SAAA,qBAAC,OAAI,EAAA,WAAW,YACd,UAAA;AAAA,IAAA,oBAAC,UAAM,UAAK,KAAA,CAAA;AAAA,IACZ,oBAAC,UAAM,UAAS;AAAA,EAClB,EAAA,CAAA;AAEJ;ACRA,MAAM,aAAyB;AAAA,EAC7B,MAAM;AAAA,EACN,WAAW;AAAA,EACX,UAAU;AAAA,EACV,OAAO;AAAA,EACP,KAAK;AACP;AAEA,OAAO,KAAK,UAAU,EAAE,QAAQ,CAAC,QAAQ;AACjC,QAAA,YAAY,WAAW,GAAuB;AAC1C,YAAA,cAAc,QAAQ,GAAG;AACrC,CAAC;ACtBM,SAAS,UAAU,OAAuB;AAC/C,QAAM,CAAC,YAAY,aAAa,IAAI,SAAyB,KAAK;AAElE,WAAS,iBAAiB,MAAc;AACtC,kBAAc,CAAC,SAAS;AACf,aAAA;AAAA,QACL,GAAG;AAAA,QACH,CAAC,IAAI,GAAG,CAAC,KAAK,IAAI;AAAA,MAAA;AAAA,IACpB,CACD;AAAA,EACH;AAEO,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@consumidor-positivo/aurora",
3
3
  "private": false,
4
- "version": "0.0.188",
4
+ "version": "0.0.190",
5
5
  "type": "module",
6
6
  "main": "./dist/main.es.js",
7
7
  "modules": "./dist/main.es.js",