@consumidor-positivo/aurora 0.11.1 → 1.0.0

package/dist/components/NotificationsBar/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/NotificationsBar/index.tsx"],"sourcesContent":["import { ReactNode, useId } from 'react'\nimport { Text } from '../Text'\nimport { Conditional } from '../misc'\nimport './styles.scss'\n\ntype NotificationsBarWrapProps = {\n  renderRecents?: () => ReactNode | string | JSX.Element | JSX.Element[]\n  renderOlds?: () => ReactNode | string | JSX.Element | JSX.Element[]\n}\n\ntype NotificationsBarListProps = {\n  title: string\n  dataSource: NotificationBarListDataProps[]\n  renderItem: (\n    item: NotificationBarListDataProps,\n    idx?: number\n  ) => ReactNode | string | JSX.Element | JSX.Element[]\n}\n\ntype NotificationBarListDataProps = {\n  title: string\n  Icon?: ReactNode | string | JSX.Element | JSX.Element[]\n  onClick: () => void\n  onDelete?: () => void\n  createdAt?: string\n}\n\ntype NotificationsBarLinkProps = {\n  title: string\n  onClick: () => void\n  onDelete?: () => void\n  Icon?: ReactNode | string | JSX.Element | JSX.Element[]\n  createdAt?: string\n  isUnread?: boolean\n}\n\nexport const NotificationsBarWrap = ({\n  renderRecents,\n  renderOlds,\n}: NotificationsBarWrapProps) => {\n  return (\n    <div className=\"au-notifications-bar\" role=\"region\" aria-label=\"Notificações\">\n      {renderRecents && renderRecents()}\n      {renderOlds && renderOlds()}\n    </div>\n  )\n}\n\nexport const NotificationsBarList = ({\n  title,\n  dataSource,\n  renderItem,\n}: NotificationsBarListProps) => {\n  return (\n    <div className=\"au-notifications-bar__section\">\n      <Text as=\"h3\" variant=\"body-medium\" weight=\"bold\">\n        {title}\n      </Text>\n      <div className=\"au-notifications-bar__list\">\n        {dataSource?.map((item, idx) => renderItem(item, idx))}\n      </div>\n    </div>\n  )\n}\n\nexport const NotificationsBarLink = ({\n  Icon,\n  onClick,\n  title,\n  createdAt,\n  onDelete,\n  isUnread,\n}: NotificationsBarLinkProps) => {\n  const timestampId = useId()\n\n  return (\n    <div className=\"au-notifications-bar__item\">\n      <button\n        type=\"button\"\n        className=\"au-notifications-bar__link\"\n        onClick={onClick}\n        aria-describedby={createdAt ? timestampId : undefined}>\n        {Icon && <span aria-hidden=\"true\">{Icon}</span>}\n        <Text as=\"span\" variant=\"body-medium\" weight=\"regular\">\n          {isUnread && <span className=\"au-sr-only\">não lida — </span>}\n          {title}\n        </Text>\n      </button>\n      <div className=\"au-notifications-bar__actions\">\n        <Text as=\"span\" id={timestampId} variant=\"body-small\">\n          {createdAt}\n        </Text>\n        <Conditional\n          condition={!!onDelete}\n          renderIf={\n            <button\n              type=\"button\"\n              className=\"au-notifications-bar__delete-btn\"\n              aria-label={`Excluir: ${title}`}\n              onClick={onDelete}>\n              <Text as=\"span\" variant=\"body-small\" weight=\"semibold\">\n                Excluir\n              </Text>\n            </button>\n          }\n        />\n      </div>\n    </div>\n  )\n}\n\nconst components = {\n  Root: NotificationsBarWrap,\n  List: NotificationsBarList,\n  Link: NotificationsBarLink,\n}\n\nexport { components as NotificationsBar }\n"],"names":[],"mappings":";;;;AAoCO,MAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AACF,MAAiC;AAC/B,8BACG,OAAA,EAAI,WAAU,wBAAuB,MAAK,UAAS,cAAW,gBAC5D,UAAA;AAAA,IAAA,iBAAiB,cAAA;AAAA,IACjB,cAAc,WAAA;AAAA,EAAW,GAC5B;AAEJ;AAEO,MAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AACF,MAAiC;AAC/B,SACE,qBAAC,OAAA,EAAI,WAAU,iCACb,UAAA;AAAA,IAAA,oBAAC,QAAK,IAAG,MAAK,SAAQ,eAAc,QAAO,QACxC,UAAA,MAAA,CACH;AAAA,IACA,oBAAC,OAAA,EAAI,WAAU,8BACZ,UAAA,yCAAY,IAAI,CAAC,MAAM,QAAQ,WAAW,MAAM,GAAG,GAAC,CACvD;AAAA,EAAA,GACF;AAEJ;AAEO,MAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAiC;AAC/B,QAAM,cAAc,MAAA;AAEpB,SACE,qBAAC,OAAA,EAAI,WAAU,8BACb,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV;AAAA,QACA,oBAAkB,YAAY,cAAc;AAAA,QAC3C,UAAA;AAAA,UAAA,QAAQ,oBAAC,QAAA,EAAK,eAAY,QAAQ,UAAA,MAAK;AAAA,+BACvC,MAAA,EAAK,IAAG,QAAO,SAAQ,eAAc,QAAO,WAC1C,UAAA;AAAA,YAAA,YAAY,oBAAC,QAAA,EAAK,WAAU,cAAa,UAAA,eAAW;AAAA,YACpD;AAAA,UAAA,EAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,qBAAC,OAAA,EAAI,WAAU,iCACb,UAAA;AAAA,MAAA,oBAAC,QAAK,IAAG,QAAO,IAAI,aAAa,SAAQ,cACtC,UAAA,UAAA,CACH;AAAA,MACA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,CAAC,CAAC;AAAA,UACb,UACE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,WAAU;AAAA,cACV,cAAY,YAAY,KAAK;AAAA,cAC7B,SAAS;AAAA,cACT,UAAA,oBAAC,QAAK,IAAG,QAAO,SAAQ,cAAa,QAAO,YAAW,UAAA,UAAA,CAEvD;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;AAEA,MAAM,aAAa;AAAA,EACjB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AACR;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/NotificationsBar/index.tsx"],"sourcesContent":["import { ReactNode, useId } from 'react'\nimport { Text } from '../Text'\nimport { Conditional } from '../misc'\nimport './styles.scss'\n\ntype NotificationsBarWrapProps = {\n  renderRecents?: () => ReactNode | string | JSX.Element | JSX.Element[]\n  renderOlds?: () => ReactNode | string | JSX.Element | JSX.Element[]\n  'data-testid'?: string\n}\n\ntype NotificationsBarListProps = {\n  title: string\n  dataSource: NotificationBarListDataProps[]\n  renderItem: (\n    item: NotificationBarListDataProps,\n    idx?: number\n  ) => ReactNode | string | JSX.Element | JSX.Element[]\n  'data-testid'?: string\n}\n\ntype NotificationBarListDataProps = {\n  title: string\n  Icon?: ReactNode | string | JSX.Element | JSX.Element[]\n  onClick: () => void\n  onDelete?: () => void\n  createdAt?: string\n}\n\ntype NotificationsBarLinkProps = {\n  title: string\n  onClick: () => void\n  onDelete?: () => void\n  Icon?: ReactNode | string | JSX.Element | JSX.Element[]\n  createdAt?: string\n  isUnread?: boolean\n  'data-testid'?: string\n}\n\nexport const NotificationsBarWrap = ({\n  renderRecents,\n  renderOlds,\n  'data-testid': dataTestId,\n}: NotificationsBarWrapProps) => {\n  return (\n    <div\n      className=\"au-notifications-bar\"\n      role=\"region\"\n      aria-label=\"Notificações\"\n      data-testid={dataTestId}>\n      {renderRecents && renderRecents()}\n      {renderOlds && renderOlds()}\n    </div>\n  )\n}\n\nexport const NotificationsBarList = ({\n  title,\n  dataSource,\n  renderItem,\n  'data-testid': dataTestId,\n}: NotificationsBarListProps) => {\n  return (\n    <div className=\"au-notifications-bar__section\" data-testid={dataTestId}>\n      <Text as=\"h3\" variant=\"body-medium\" weight=\"bold\">\n        {title}\n      </Text>\n      <div className=\"au-notifications-bar__list\">\n        {dataSource?.map((item, idx) => renderItem(item, idx))}\n      </div>\n    </div>\n  )\n}\n\nexport const NotificationsBarLink = ({\n  Icon,\n  onClick,\n  title,\n  createdAt,\n  onDelete,\n  isUnread,\n  'data-testid': dataTestId,\n}: NotificationsBarLinkProps) => {\n  const timestampId = useId()\n\n  return (\n    <div className=\"au-notifications-bar__item\" data-testid={dataTestId}>\n      <button\n        type=\"button\"\n        className=\"au-notifications-bar__link\"\n        onClick={onClick}\n        aria-describedby={createdAt ? timestampId : undefined}>\n        {Icon && <span aria-hidden=\"true\">{Icon}</span>}\n        <Text as=\"span\" variant=\"body-medium\" weight=\"regular\">\n          {isUnread && <span className=\"au-sr-only\">não lida — </span>}\n          {title}\n        </Text>\n      </button>\n      <div className=\"au-notifications-bar__actions\">\n        <Text as=\"span\" id={timestampId} variant=\"body-small\">\n          {createdAt}\n        </Text>\n        <Conditional\n          condition={!!onDelete}\n          renderIf={\n            <button\n              type=\"button\"\n              className=\"au-notifications-bar__delete-btn\"\n              aria-label={`Excluir: ${title}`}\n              onClick={onDelete}>\n              <Text as=\"span\" variant=\"body-small\" weight=\"semibold\">\n                Excluir\n              </Text>\n            </button>\n          }\n        />\n      </div>\n    </div>\n  )\n}\n\nconst components = {\n  Root: NotificationsBarWrap,\n  List: NotificationsBarList,\n  Link: NotificationsBarLink,\n}\n\nexport { components as NotificationsBar }\n"],"names":[],"mappings":";;;;AAuCO,MAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA,eAAe;AACjB,MAAiC;AAC/B,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,MAAK;AAAA,MACL,cAAW;AAAA,MACX,eAAa;AAAA,MACZ,UAAA;AAAA,QAAA,iBAAiB,cAAA;AAAA,QACjB,cAAc,WAAA;AAAA,MAAW;AAAA,IAAA;AAAA,EAAA;AAGhC;AAEO,MAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,MAAiC;AAC/B,SACE,qBAAC,OAAA,EAAI,WAAU,iCAAgC,eAAa,YAC1D,UAAA;AAAA,IAAA,oBAAC,QAAK,IAAG,MAAK,SAAQ,eAAc,QAAO,QACxC,UAAA,MAAA,CACH;AAAA,IACA,oBAAC,OAAA,EAAI,WAAU,8BACZ,UAAA,yCAAY,IAAI,CAAC,MAAM,QAAQ,WAAW,MAAM,GAAG,GAAC,CACvD;AAAA,EAAA,GACF;AAEJ;AAEO,MAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,MAAiC;AAC/B,QAAM,cAAc,MAAA;AAEpB,SACE,qBAAC,OAAA,EAAI,WAAU,8BAA6B,eAAa,YACvD,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV;AAAA,QACA,oBAAkB,YAAY,cAAc;AAAA,QAC3C,UAAA;AAAA,UAAA,QAAQ,oBAAC,QAAA,EAAK,eAAY,QAAQ,UAAA,MAAK;AAAA,+BACvC,MAAA,EAAK,IAAG,QAAO,SAAQ,eAAc,QAAO,WAC1C,UAAA;AAAA,YAAA,YAAY,oBAAC,QAAA,EAAK,WAAU,cAAa,UAAA,eAAW;AAAA,YACpD;AAAA,UAAA,EAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,qBAAC,OAAA,EAAI,WAAU,iCACb,UAAA;AAAA,MAAA,oBAAC,QAAK,IAAG,QAAO,IAAI,aAAa,SAAQ,cACtC,UAAA,UAAA,CACH;AAAA,MACA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAW,CAAC,CAAC;AAAA,UACb,UACE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,WAAU;AAAA,cACV,cAAY,YAAY,KAAK;AAAA,cAC7B,SAAS;AAAA,cACT,UAAA,oBAAC,QAAK,IAAG,QAAO,SAAQ,cAAa,QAAO,YAAW,UAAA,UAAA,CAEvD;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAEJ,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;AAEA,MAAM,aAAa;AAAA,EACjB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AACR;"}

package/dist/components/PartnerBanner/PartnerBanner.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/PartnerBanner/index.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+export type PartnerBannerProps = {
+    text: string;
+    btnText: string;
+    icon?: ReactNode;
+    onButtonClick?: () => void;
+    ariaLabel?: string;
+    className?: string;
+    'data-testid'?: string;
+};
+export declare const PartnerBanner: ({ text, btnText, icon, onButtonClick, ariaLabel, className, "data-testid": dataTestId, }: PartnerBannerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/PartnerBanner/index.es.js

@@ -0,0 +1,45 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { c as classNames } from "../../index-C6Q03EyZ.js";
+import { Text } from "../Text/index.es.js";
+import './styles.css';const PartnerBanner = ({
+  text,
+  btnText,
+  icon,
+  onButtonClick,
+  ariaLabel,
+  className = "",
+  "data-testid": dataTestId
+}) => {
+  const classes = classNames("au-partner-banner", {
+    [`au-partner-banner--with-icon`]: !!icon,
+    [className]: !!className
+  });
+  return /* @__PURE__ */ jsxs("aside", { className: classes, "aria-label": ariaLabel, "data-testid": dataTestId, children: [
+    icon && /* @__PURE__ */ jsx("div", { className: "au-partner-banner__icon", "aria-hidden": "true", children: icon }),
+    /* @__PURE__ */ jsxs("div", { className: "au-partner-banner__content", children: [
+      /* @__PURE__ */ jsx(
+        Text,
+        {
+          as: "p",
+          variant: "body-small",
+          color: "secondary",
+          className: "au-partner-banner__text",
+          children: text
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "au-partner-banner__button",
+          onClick: onButtonClick,
+          children: /* @__PURE__ */ jsx(Text, { as: "span", variant: "body-small", weight: "semibold", children: btnText })
+        }
+      )
+    ] })
+  ] });
+};
+export {
+  PartnerBanner
+};
+//# sourceMappingURL=index.es.js.map

package/dist/components/PartnerBanner/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/PartnerBanner/index.tsx"],"sourcesContent":["import { ReactNode } from 'react'\nimport classNames from 'classnames'\nimport { Text } from '@components/Text'\nimport './styles.scss'\n\nexport type PartnerBannerProps = {\n  text: string\n  btnText: string\n  icon?: ReactNode\n  onButtonClick?: () => void\n  ariaLabel?: string\n  className?: string\n  'data-testid'?: string\n}\n\nexport const PartnerBanner = ({\n  text,\n  btnText,\n  icon,\n  onButtonClick,\n  ariaLabel,\n  className = '',\n  'data-testid': dataTestId,\n}: PartnerBannerProps) => {\n  const classes = classNames('au-partner-banner', {\n    [`au-partner-banner--with-icon`]: !!icon,\n    [className]: !!className,\n  })\n\n  return (\n    <aside className={classes} aria-label={ariaLabel} data-testid={dataTestId}>\n      {icon && (\n        <div className=\"au-partner-banner__icon\" aria-hidden=\"true\">\n          {icon}\n        </div>\n      )}\n      <div className=\"au-partner-banner__content\">\n        <Text\n          as=\"p\"\n          variant=\"body-small\"\n          color=\"secondary\"\n          className=\"au-partner-banner__text\">\n          {text}\n        </Text>\n        <button\n          type=\"button\"\n          className=\"au-partner-banner__button\"\n          onClick={onButtonClick}>\n          <Text as=\"span\" variant=\"body-small\" weight=\"semibold\">\n            {btnText}\n          </Text>\n        </button>\n      </div>\n    </aside>\n  )\n}\n"],"names":[],"mappings":";;;AAeO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,eAAe;AACjB,MAA0B;AACxB,QAAM,UAAU,WAAW,qBAAqB;AAAA,IAC9C,CAAC,8BAA8B,GAAG,CAAC,CAAC;AAAA,IACpC,CAAC,SAAS,GAAG,CAAC,CAAC;AAAA,EAAA,CAChB;AAED,8BACG,SAAA,EAAM,WAAW,SAAS,cAAY,WAAW,eAAa,YAC5D,UAAA;AAAA,IAAA,4BACE,OAAA,EAAI,WAAU,2BAA0B,eAAY,QAClD,UAAA,MACH;AAAA,IAEF,qBAAC,OAAA,EAAI,WAAU,8BACb,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAG;AAAA,UACH,SAAQ;AAAA,UACR,OAAM;AAAA,UACN,WAAU;AAAA,UACT,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAEH;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS;AAAA,UACT,UAAA,oBAAC,QAAK,IAAG,QAAO,SAAQ,cAAa,QAAO,YACzC,UAAA,QAAA,CACH;AAAA,QAAA;AAAA,MAAA;AAAA,IACF,EAAA,CACF;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/PartnerBanner/styles.css

@@ -0,0 +1 @@
+.au-partner-banner{display:flex;gap:16px;border-radius:16px;background-color:#f6f7fa;padding:16px;width:272px}.au-partner-banner__content{display:flex;flex-direction:column;align-items:start;gap:8px}.au-partner-banner__icon{display:inline-flex;align-items:center;justify-content:center;min-width:32px;width:32px;height:32px}.au-partner-banner__text{margin:0}.au-partner-banner__button{display:inline-flex;align-items:center;min-height:24px;border:none;background:none;border-radius:4px;cursor:pointer}.au-partner-banner__button>span{color:#0048db}.au-partner-banner__button:focus-visible{outline:none;box-shadow:0 0 0 2px #fff,0 0 0 4px #0048db}

package/dist/components/PortalHolder/index.es.js

@@ -1,6 +1,6 @@
 import { jsx, Fragment } from "react/jsx-runtime";
 import { a as above } from "../../screen-DfYo7XQ_.js";
-import { B as BREAKPOINT_MD } from "../../tokens-eEtvWiuX.js";
+import { B as BREAKPOINT_MD } from "../../tokens-C4yCunfz.js";
 import { Portal } from "../Portal/index.es.js";
 const PortalHolder = ({ withPortal, children }) => {
   const shouldUsePortal = !above(BREAKPOINT_MD) && withPortal;

package/dist/components/ProfileNav/index.d.ts

@@ -1,6 +1,7 @@
 type ProfileNavProps = {
     name: string;
     fullName: string;
+    'data-testid'?: string;
 };
-export declare const ProfileNav: ({ name, fullName }: ProfileNavProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ProfileNav: ({ name, fullName, "data-testid": dataTestId, }: ProfileNavProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ProfileNav/index.es.js

@@ -1,9 +1,13 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { g as getInitialLetters } from "../../getInitialLetters-CV7onXcH.js";
 import { Text } from "../Text/index.es.js";
-import './styles.css';const ProfileNav = ({ name, fullName }) => {
+import './styles.css';const ProfileNav = ({
+  name,
+  fullName,
+  "data-testid": dataTestId
+}) => {
   const initialLetters = getInitialLetters(fullName);
-  return /* @__PURE__ */ jsxs("div", { className: "au-profile-nav", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "au-profile-nav", "data-testid": dataTestId, children: [
     /* @__PURE__ */ jsx("div", { className: "au-profile-nav__badget", children: /* @__PURE__ */ jsx(Text, { variant: "heading-small", weight: "medium", children: initialLetters }) }),
     /* @__PURE__ */ jsxs("div", { className: "div", children: [
       /* @__PURE__ */ jsxs(Text, { as: "h3", variant: "heading-micro", weight: "bold", children: [

package/dist/components/ProfileNav/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/ProfileNav/index.tsx"],"sourcesContent":["import { getInitialLetters } from '@core/utils/getInitialLetters'\nimport { Text } from '../Text'\nimport './styles.scss'\n\ntype ProfileNavProps = {\n  name: string\n  fullName: string\n}\n\nexport const ProfileNav = ({ name, fullName }: ProfileNavProps) => {\n  const initialLetters = getInitialLetters(fullName)\n\n  return (\n    <div className=\"au-profile-nav\">\n      <div className=\"au-profile-nav__badget\">\n        <Text variant=\"heading-small\" weight=\"medium\">\n          {initialLetters}\n        </Text>\n      </div>\n      <div className=\"div\">\n        <Text as=\"h3\" variant=\"heading-micro\" weight=\"bold\">\n          Olá, {name}\n        </Text>\n        <Text color=\"secondary\">Tudo bem?</Text>\n      </div>\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;AASO,MAAM,aAAa,CAAC,EAAE,MAAM,eAAgC;AACjE,QAAM,iBAAiB,kBAAkB,QAAQ;AAEjD,SACE,qBAAC,OAAA,EAAI,WAAU,kBACb,UAAA;AAAA,IAAA,oBAAC,OAAA,EAAI,WAAU,0BACb,UAAA,oBAAC,MAAA,EAAK,SAAQ,iBAAgB,QAAO,UAClC,UAAA,eAAA,CACH,GACF;AAAA,IACA,qBAAC,OAAA,EAAI,WAAU,OACb,UAAA;AAAA,MAAA,qBAAC,QAAK,IAAG,MAAK,SAAQ,iBAAgB,QAAO,QAAO,UAAA;AAAA,QAAA;AAAA,QAC5C;AAAA,MAAA,GACR;AAAA,MACA,oBAAC,MAAA,EAAK,OAAM,aAAY,UAAA,YAAA,CAAS;AAAA,IAAA,EAAA,CACnC;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/ProfileNav/index.tsx"],"sourcesContent":["import { getInitialLetters } from '@core/utils/getInitialLetters'\nimport { Text } from '../Text'\nimport './styles.scss'\n\ntype ProfileNavProps = {\n  name: string\n  fullName: string\n  'data-testid'?: string\n}\n\nexport const ProfileNav = ({\n  name,\n  fullName,\n  'data-testid': dataTestId,\n}: ProfileNavProps) => {\n  const initialLetters = getInitialLetters(fullName)\n\n  return (\n    <div className=\"au-profile-nav\" data-testid={dataTestId}>\n      <div className=\"au-profile-nav__badget\">\n        <Text variant=\"heading-small\" weight=\"medium\">\n          {initialLetters}\n        </Text>\n      </div>\n      <div className=\"div\">\n        <Text as=\"h3\" variant=\"heading-micro\" weight=\"bold\">\n          Olá, {name}\n        </Text>\n        <Text color=\"secondary\">Tudo bem?</Text>\n      </div>\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;AAUO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA,eAAe;AACjB,MAAuB;AACrB,QAAM,iBAAiB,kBAAkB,QAAQ;AAEjD,SACE,qBAAC,OAAA,EAAI,WAAU,kBAAiB,eAAa,YAC3C,UAAA;AAAA,IAAA,oBAAC,OAAA,EAAI,WAAU,0BACb,UAAA,oBAAC,MAAA,EAAK,SAAQ,iBAAgB,QAAO,UAClC,UAAA,eAAA,CACH,GACF;AAAA,IACA,qBAAC,OAAA,EAAI,WAAU,OACb,UAAA;AAAA,MAAA,qBAAC,QAAK,IAAG,MAAK,SAAQ,iBAAgB,QAAO,QAAO,UAAA;AAAA,QAAA;AAAA,QAC5C;AAAA,MAAA,GACR;AAAA,MACA,oBAAC,MAAA,EAAK,OAAM,aAAY,UAAA,YAAA,CAAS;AAAA,IAAA,EAAA,CACnC;AAAA,EAAA,GACF;AAEJ;"}

package/dist/components/ProgressBar/index.d.ts

@@ -3,6 +3,7 @@ interface ProgressBarProps {
     stepName: string;
     currentStep: number;
     totalSteps: number;
+    'data-testid'?: string;
 }
 export declare const ProgressBar: React.FC<ProgressBarProps>;
 export {};

package/dist/components/ProgressBar/index.es.js

@@ -6,7 +6,8 @@ import './styles.css';const ProgressBar = ({
   percentageMode = false,
   stepName,
   currentStep,
-  totalSteps
+  totalSteps,
+  "data-testid": dataTestId
 }) => {
   const safeCurrentStep = Math.max(1, Math.min(currentStep, totalSteps));
   const percentageWidth = safeCurrentStep / totalSteps * 100;
@@ -21,6 +22,7 @@ import './styles.css';const ProgressBar = ({
       "aria-valuemin": percentageMode ? 0 : 1,
       "aria-valuemax": percentageMode ? 100 : totalSteps,
       "aria-label": stepName,
+      "data-testid": dataTestId,
       children: [
         /* @__PURE__ */ jsx(
           Conditional,

package/dist/components/ProgressBar/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/ProgressBar/index.tsx"],"sourcesContent":["import { Conditional } from '@components/misc'\nimport classNames from 'classnames'\nimport { Text } from '../Text'\n\nimport './styles.scss'\n\ninterface ProgressBarProps {\n  percentageMode?: boolean\n  stepName: string\n  currentStep: number\n  totalSteps: number\n}\n\nexport const ProgressBar: React.FC<ProgressBarProps> = ({\n  percentageMode = false,\n  stepName,\n  currentStep,\n  totalSteps,\n}) => {\n  const safeCurrentStep = Math.max(1, Math.min(currentStep, totalSteps))\n  const percentageWidth = (safeCurrentStep / totalSteps) * 100\n  const roundedPercentage = Math.round(percentageWidth)\n\n  const progressText = percentageMode\n    ? `${roundedPercentage}%`\n    : `${safeCurrentStep} de ${totalSteps}`\n\n  return (\n    <div\n      className=\"au-progress-bar\"\n      role=\"progressbar\"\n      aria-valuenow={percentageMode ? roundedPercentage : safeCurrentStep}\n      aria-valuemin={percentageMode ? 0 : 1}\n      aria-valuemax={percentageMode ? 100 : totalSteps}\n      aria-label={stepName}>\n      <Conditional\n        condition={!!percentageMode}\n        renderIf={\n          <div className=\"au-progress-bar__bar\">\n            <div\n              style={{ width: `${percentageWidth}%` }}\n              className=\"au-progress-bar__bar-filled\"\n            />\n          </div>\n        }\n        renderElse={\n          <div className=\"au-progress-bar__steps\">\n            {Array.from({ length: totalSteps }).map((_, index) => (\n              <div key={index} className=\"au-progress-bar__step-container\">\n                <div\n                  className={classNames('au-progress-bar__step-filled', {\n                    'au-progress-bar__step-filled--is-active':\n                      index < safeCurrentStep,\n                  })}\n                />\n              </div>\n            ))}\n          </div>\n        }\n      />\n\n      <div className=\"au-progress-bar__text\">\n        <Text as=\"span\" variant=\"body-medium\">\n          {stepName}\n        </Text>\n\n        <Text as=\"span\" variant=\"body-medium\">\n          {progressText}\n        </Text>\n      </div>\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;;AAaO,MAAM,cAA0C,CAAC;AAAA,EACtD,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,kBAAkB,KAAK,IAAI,GAAG,KAAK,IAAI,aAAa,UAAU,CAAC;AACrE,QAAM,kBAAmB,kBAAkB,aAAc;AACzD,QAAM,oBAAoB,KAAK,MAAM,eAAe;AAEpD,QAAM,eAAe,iBACjB,GAAG,iBAAiB,MACpB,GAAG,eAAe,OAAO,UAAU;AAEvC,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,MAAK;AAAA,MACL,iBAAe,iBAAiB,oBAAoB;AAAA,MACpD,iBAAe,iBAAiB,IAAI;AAAA,MACpC,iBAAe,iBAAiB,MAAM;AAAA,MACtC,cAAY;AAAA,MACZ,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,CAAC,CAAC;AAAA,YACb,UACE,oBAAC,OAAA,EAAI,WAAU,wBACb,UAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,OAAO,EAAE,OAAO,GAAG,eAAe,IAAA;AAAA,gBAClC,WAAU;AAAA,cAAA;AAAA,YAAA,GAEd;AAAA,YAEF,YACE,oBAAC,OAAA,EAAI,WAAU,0BACZ,UAAA,MAAM,KAAK,EAAE,QAAQ,YAAY,EAAE,IAAI,CAAC,GAAG,UAC1C,oBAAC,OAAA,EAAgB,WAAU,mCACzB,UAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAW,WAAW,gCAAgC;AAAA,kBACpD,2CACE,QAAQ;AAAA,gBAAA,CACX;AAAA,cAAA;AAAA,YAAA,EACH,GANQ,KAOV,CACD,EAAA,CACH;AAAA,UAAA;AAAA,QAAA;AAAA,QAIJ,qBAAC,OAAA,EAAI,WAAU,yBACb,UAAA;AAAA,UAAA,oBAAC,MAAA,EAAK,IAAG,QAAO,SAAQ,eACrB,UAAA,UACH;AAAA,8BAEC,MAAA,EAAK,IAAG,QAAO,SAAQ,eACrB,UAAA,aAAA,CACH;AAAA,QAAA,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/ProgressBar/index.tsx"],"sourcesContent":["import { Conditional } from '@components/misc'\nimport classNames from 'classnames'\nimport { Text } from '../Text'\n\nimport './styles.scss'\n\ninterface ProgressBarProps {\n  percentageMode?: boolean\n  stepName: string\n  currentStep: number\n  totalSteps: number\n  'data-testid'?: string\n}\n\nexport const ProgressBar: React.FC<ProgressBarProps> = ({\n  percentageMode = false,\n  stepName,\n  currentStep,\n  totalSteps,\n  'data-testid': dataTestId,\n}) => {\n  const safeCurrentStep = Math.max(1, Math.min(currentStep, totalSteps))\n  const percentageWidth = (safeCurrentStep / totalSteps) * 100\n  const roundedPercentage = Math.round(percentageWidth)\n\n  const progressText = percentageMode\n    ? `${roundedPercentage}%`\n    : `${safeCurrentStep} de ${totalSteps}`\n\n  return (\n    <div\n      className=\"au-progress-bar\"\n      role=\"progressbar\"\n      aria-valuenow={percentageMode ? roundedPercentage : safeCurrentStep}\n      aria-valuemin={percentageMode ? 0 : 1}\n      aria-valuemax={percentageMode ? 100 : totalSteps}\n      aria-label={stepName}\n      data-testid={dataTestId}>\n      <Conditional\n        condition={!!percentageMode}\n        renderIf={\n          <div className=\"au-progress-bar__bar\">\n            <div\n              style={{ width: `${percentageWidth}%` }}\n              className=\"au-progress-bar__bar-filled\"\n            />\n          </div>\n        }\n        renderElse={\n          <div className=\"au-progress-bar__steps\">\n            {Array.from({ length: totalSteps }).map((_, index) => (\n              <div key={index} className=\"au-progress-bar__step-container\">\n                <div\n                  className={classNames('au-progress-bar__step-filled', {\n                    'au-progress-bar__step-filled--is-active':\n                      index < safeCurrentStep,\n                  })}\n                />\n              </div>\n            ))}\n          </div>\n        }\n      />\n\n      <div className=\"au-progress-bar__text\">\n        <Text as=\"span\" variant=\"body-medium\">\n          {stepName}\n        </Text>\n\n        <Text as=\"span\" variant=\"body-medium\">\n          {progressText}\n        </Text>\n      </div>\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;;AAcO,MAAM,cAA0C,CAAC;AAAA,EACtD,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AACjB,MAAM;AACJ,QAAM,kBAAkB,KAAK,IAAI,GAAG,KAAK,IAAI,aAAa,UAAU,CAAC;AACrE,QAAM,kBAAmB,kBAAkB,aAAc;AACzD,QAAM,oBAAoB,KAAK,MAAM,eAAe;AAEpD,QAAM,eAAe,iBACjB,GAAG,iBAAiB,MACpB,GAAG,eAAe,OAAO,UAAU;AAEvC,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,MAAK;AAAA,MACL,iBAAe,iBAAiB,oBAAoB;AAAA,MACpD,iBAAe,iBAAiB,IAAI;AAAA,MACpC,iBAAe,iBAAiB,MAAM;AAAA,MACtC,cAAY;AAAA,MACZ,eAAa;AAAA,MACb,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,CAAC,CAAC;AAAA,YACb,UACE,oBAAC,OAAA,EAAI,WAAU,wBACb,UAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,OAAO,EAAE,OAAO,GAAG,eAAe,IAAA;AAAA,gBAClC,WAAU;AAAA,cAAA;AAAA,YAAA,GAEd;AAAA,YAEF,YACE,oBAAC,OAAA,EAAI,WAAU,0BACZ,UAAA,MAAM,KAAK,EAAE,QAAQ,YAAY,EAAE,IAAI,CAAC,GAAG,UAC1C,oBAAC,OAAA,EAAgB,WAAU,mCACzB,UAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAW,WAAW,gCAAgC;AAAA,kBACpD,2CACE,QAAQ;AAAA,gBAAA,CACX;AAAA,cAAA;AAAA,YAAA,EACH,GANQ,KAOV,CACD,EAAA,CACH;AAAA,UAAA;AAAA,QAAA;AAAA,QAIJ,qBAAC,OAAA,EAAI,WAAU,yBACb,UAAA;AAAA,UAAA,oBAAC,MAAA,EAAK,IAAG,QAAO,SAAQ,eACrB,UAAA,UACH;AAAA,8BAEC,MAAA,EAAK,IAAG,QAAO,SAAQ,eACrB,UAAA,aAAA,CACH;AAAA,QAAA,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Prototype/Carousel/index.d.ts

@@ -1,2 +1,2 @@
 import { CarouselProps } from './types';
-export declare const Carousel: ({ items, type, mobileText, draggable, }: CarouselProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Carousel: ({ items, type, mobileText, draggable, "data-testid": dataTestId, }: CarouselProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Prototype/Carousel/types.d.ts

@@ -3,4 +3,5 @@ export interface CarouselProps {
     type: 'pages' | 'scrollbar';
     mobileText?: string;
     draggable?: boolean;
+    'data-testid'?: string;
 }

package/dist/components/Pure/index.es.js

@@ -5,14 +5,15 @@ import './styles.css';const PureSwitch = ({
   id,
   disabled,
   activateCallBack,
-  deactivateCallBack
+  deactivateCallBack,
+  "data-testid": dataTestId
 }) => {
   const handleToggle = (event) => {
     const isActivated = event.target.checked;
     if (isActivated) return activateCallBack();
     return deactivateCallBack == null ? void 0 : deactivateCallBack();
   };
-  return /* @__PURE__ */ jsx("div", { className: "au-switch", children: /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "au-switch-label", children: [
+  return /* @__PURE__ */ jsx("div", { className: "au-switch", "data-testid": dataTestId, children: /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "au-switch-label", children: [
     /* @__PURE__ */ jsx("span", { children: label }),
     /* @__PURE__ */ jsxs("div", { className: "au-switch-container", children: [
       /* @__PURE__ */ jsx(

package/dist/components/Pure/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/Switch/Pure/index.tsx"],"sourcesContent":["import './styles.scss';\n\nimport { SwitchProps } from './types';\n\n\nexport const PureSwitch: React.FC<SwitchProps> = ({ \n\tisActive, \n\tlabel, \n\tid, \n\tdisabled,\n\tactivateCallBack, \n\tdeactivateCallBack \n}) => {\n\tconst handleToggle = (event: React.ChangeEvent<HTMLInputElement>) => {\n\t\tconst isActivated = event.target.checked;\n\n    if(isActivated) return activateCallBack();\n\n\t\treturn deactivateCallBack?.()\n  };\n\t\n\treturn (\n    <div className=\"au-switch\">\n      <label htmlFor={id} className=\"au-switch-label\">\n\t\t\t\t<span>{label}</span>\n\t\t\t\t<div className=\"au-switch-container\">\n\t\t\t\t\t<input\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\tclassName=\"au-switch-checkbox\"\n\t\t\t\t\t\tchecked={isActive}\n\t\t\t\t\t\tonChange={handleToggle}\n\t\t\t\t\t\trole=\"switch\"\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<div className=\"au-switch-track\">\n\t\t\t\t\t\t<div className=\"au-switch-thumb\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n    </label>\n    </div>\n  )\n}\n"],"names":[],"mappings":";AAKO,MAAM,aAAoC,CAAC;AAAA,EACjD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,MAAM;AACL,QAAM,eAAe,CAAC,UAA+C;AACpE,UAAM,cAAc,MAAM,OAAO;AAE/B,QAAG,oBAAoB,iBAAA;AAEzB,WAAO;AAAA,EACP;AAED,SACG,oBAAC,SAAI,WAAU,aACb,+BAAC,SAAA,EAAM,SAAS,IAAI,WAAU,mBAChC,UAAA;AAAA,IAAA,oBAAC,UAAM,UAAA,MAAA,CAAM;AAAA,IACb,qBAAC,OAAA,EAAI,WAAU,uBACd,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACA;AAAA,UACA,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS;AAAA,UACT,UAAU;AAAA,UACV,MAAK;AAAA,UACL;AAAA,QAAA;AAAA,MAAA;AAAA,MAGD,oBAAC,SAAI,WAAU,mBACd,8BAAC,OAAA,EAAI,WAAU,mBAAkB,EAAA,CAClC;AAAA,IAAA,EAAA,CACD;AAAA,EAAA,EAAA,CACA,EAAA,CACA;AAEJ;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/Switch/Pure/index.tsx"],"sourcesContent":["import './styles.scss';\n\nimport { SwitchProps } from './types';\n\n\nexport const PureSwitch: React.FC<SwitchProps> = ({\n\tisActive,\n\tlabel,\n\tid,\n\tdisabled,\n\tactivateCallBack,\n\tdeactivateCallBack,\n\t'data-testid': dataTestId,\n}) => {\n\tconst handleToggle = (event: React.ChangeEvent<HTMLInputElement>) => {\n\t\tconst isActivated = event.target.checked;\n\n    if(isActivated) return activateCallBack();\n\n\t\treturn deactivateCallBack?.()\n  };\n\t\n\treturn (\n    <div className=\"au-switch\" data-testid={dataTestId}>\n      <label htmlFor={id} className=\"au-switch-label\">\n\t\t\t\t<span>{label}</span>\n\t\t\t\t<div className=\"au-switch-container\">\n\t\t\t\t\t<input\n\t\t\t\t\t\tid={id}\n\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\tclassName=\"au-switch-checkbox\"\n\t\t\t\t\t\tchecked={isActive}\n\t\t\t\t\t\tonChange={handleToggle}\n\t\t\t\t\t\trole=\"switch\"\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<div className=\"au-switch-track\">\n\t\t\t\t\t\t<div className=\"au-switch-thumb\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n    </label>\n    </div>\n  )\n}\n"],"names":[],"mappings":";AAKO,MAAM,aAAoC,CAAC;AAAA,EACjD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAChB,MAAM;AACL,QAAM,eAAe,CAAC,UAA+C;AACpE,UAAM,cAAc,MAAM,OAAO;AAE/B,QAAG,oBAAoB,iBAAA;AAEzB,WAAO;AAAA,EACP;AAED,SACG,oBAAC,OAAA,EAAI,WAAU,aAAY,eAAa,YACtC,UAAA,qBAAC,SAAA,EAAM,SAAS,IAAI,WAAU,mBAChC,UAAA;AAAA,IAAA,oBAAC,UAAM,UAAA,MAAA,CAAM;AAAA,IACb,qBAAC,OAAA,EAAI,WAAU,uBACd,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACA;AAAA,UACA,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS;AAAA,UACT,UAAU;AAAA,UACV,MAAK;AAAA,UACL;AAAA,QAAA;AAAA,MAAA;AAAA,MAGD,oBAAC,SAAI,WAAU,mBACd,8BAAC,OAAA,EAAI,WAAU,mBAAkB,EAAA,CAClC;AAAA,IAAA,EAAA,CACD;AAAA,EAAA,EAAA,CACA,EAAA,CACA;AAEJ;"}

package/dist/components/Segment/index.es.js

@@ -1,10 +1,11 @@
 import "react/jsx-runtime";
 import "../../index-C6Q03EyZ.js";
+import "react";
 import "../Icon/index.es.js";
 import "../icons/IconChevronDown/index.es.js";
 import "../icons/IconChevronLeft/index.es.js";
 import "../icons/IconX/index.es.js";
-import { S } from "../../index-BvQw_Wgb.js";
+import { S } from "../../index-DnQGzfVW.js";
 export {
   S as Segment
 };

package/dist/components/Segment/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
+{"version":3,"file":"index.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/components/SelectField/index.es.js

@@ -10,7 +10,7 @@ import { IconSlash } from "../icons/IconSlash/index.es.js";
 import { Modal } from "../Modal/index.es.js";
 import { Text } from "../Text/index.es.js";
 import { Conditional } from "../Conditional/index.es.js";
-import { c as COLOR_NEUTRAL_40 } from "../../tokens-eEtvWiuX.js";
+import { c as COLOR_NEUTRAL_40 } from "../../tokens-C4yCunfz.js";
 import { i as isMobile } from "../../isMobile-RyKhTreE.js";
 import { F as Field } from "../../index-ZE6zszxw.js";
 import './styles.css';const useSelectField = (options, initialValue, onChange, onBlur, disabled, register, autocomplete = false, fullScreenOptions = false) => {
@@ -232,7 +232,8 @@ const SelectField = ({
   autocomplete = false,
   EmptyText = "Nada encontrado",
   fullScreenOptions = false,
-  htmlType = "text"
+  htmlType = "text",
+  "data-testid": dataTestId
 }) => {
   const labelId = useId();
   const generatedErrorId = useId();
@@ -310,6 +311,7 @@ const SelectField = ({
               "div",
               {
                 className: "au-field__select-wrapper",
+                "data-testid": dataTestId,
                 onClick: toggleDropdown,
                 onKeyDown: onKeyDownDropdown,
                 tabIndex: disabled ? -1 : 0,

package/dist/components/SelectField/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/SelectField/hook.ts","../../../lib/components/form/SelectField/index.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from 'react'\nimport { OptionProps } from './types'\nimport { isMobile } from '@core/utils/isMobile'\n\nexport const useSelectField = (\n  options: OptionProps[],\n  initialValue?: string,\n  onChange?: (value: string) => void,\n  onBlur?: React.FocusEventHandler,\n  disabled?: boolean,\n  register?: (instance: HTMLSelectElement | null) => void,\n  autocomplete: boolean = false,\n  fullScreenOptions: boolean = false,\n) => {\n  const [isDropdownOpen, setIsDropdownOpen] = useState(false)\n  const [selectedOption, setSelectedOption] = useState<OptionProps>({\n    value: initialValue || '',\n    label: initialValue\n      ? options.find((option) => option.value === initialValue)?.label || ''\n      : '',\n  })\n  const [activeOptionIndex, setActiveOptionIndex] = useState<number | null>(\n    null,\n  )\n  const [dropdownMaxHeight, setDropdownMaxHeight] = useState<number>(0)\n  const selectRef = useRef<HTMLDivElement>(null)\n  const selectElementRef = useRef<HTMLSelectElement>(null)\n  const [searchValue, setSearchValue] = useState<string>('')\n  const activeOptionRef = useRef<HTMLLIElement | null>(null)\n\n  const fullScreenOptionsEnabled = fullScreenOptions && Boolean(isMobile())\n\n  const filteredOptions =\n    autocomplete || fullScreenOptions\n      ? options.filter((option) =>\n          option.label.toLowerCase().includes(searchValue.toLowerCase()),\n        )\n      : options\n\n  useEffect(() => {\n    if (initialValue) {\n      const option = options.find((option) => option.value === initialValue)\n      if (option) {\n        setSelectedOption({ value: option.value, label: option.label })\n      }\n    }\n  }, [initialValue, options])\n\n  useEffect(() => {\n    if (register && selectElementRef.current) {\n      register(selectElementRef.current)\n    }\n  }, [register])\n\n  useEffect(() => {\n    if (activeOptionRef.current) {\n      activeOptionRef.current.scrollIntoView({\n        behavior: 'smooth',\n        block: 'nearest',\n      })\n    }\n  }, [activeOptionIndex])\n\n  useEffect(() => {\n    const handleClickOutside = (event: PointerEvent) => {\n      const isClickedOutside =\n        selectRef.current &&\n        !selectRef.current.contains(event.target as Node) &&\n        activeOptionRef.current\n\n      if (isClickedOutside) {\n        setIsDropdownOpen(false)\n      }\n    }\n\n    if (isDropdownOpen) {\n      document.addEventListener('pointerup', handleClickOutside)\n    } else {\n      document.removeEventListener('pointerup', handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener('pointerup', handleClickOutside)\n    }\n  }, [isDropdownOpen])\n\n  const toggleDropdown = () => {\n    if (!isDropdownOpen && selectRef.current) {\n      const { bottom } = selectRef.current.getBoundingClientRect()\n      let totalPadding = 0\n      let parentElement: HTMLElement | null = selectRef.current.parentElement\n\n      while (parentElement) {\n        const parentPaddingBottom = parseFloat(\n          window.getComputedStyle(parentElement).paddingBottom || '0',\n        )\n        totalPadding += parentPaddingBottom\n        parentElement = parentElement.parentElement\n      }\n\n      const availableSpaceBelow = window.innerHeight - bottom - totalPadding\n      const minDropdownHeight = 212\n      const calculatedHeight = Math.max(availableSpaceBelow, minDropdownHeight)\n\n      setDropdownMaxHeight(calculatedHeight)\n    }\n\n    setIsDropdownOpen((prev) => {\n      if (!prev) {\n        const selectedIndex = options.findIndex(\n          (option) => option.value === selectedOption.value,\n        )\n        setActiveOptionIndex(selectedIndex !== -1 ? selectedIndex : null)\n      }\n      return !prev\n    })\n  }\n\n  const _findNextAvailableIndex = (\n    currentIndex: number,\n    direction: 'down' | 'up',\n  ) => {\n    const step = direction === 'down' ? 1 : -1\n    let nextIndex =\n      (currentIndex + step + filteredOptions.length) % filteredOptions.length\n\n    while (filteredOptions[nextIndex]?.disabled) {\n      nextIndex =\n        (nextIndex + step + filteredOptions.length) % filteredOptions.length\n    }\n\n    return nextIndex\n  }\n\n  const onKeyDownDropdown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (disabled) return\n\n    const _actions: Record<string, () => void> = {\n      Enter: () => {\n        if (!isDropdownOpen) {\n          toggleDropdown()\n          return\n        }\n        if (\n          activeOptionIndex !== null &&\n          !filteredOptions[activeOptionIndex].disabled\n        ) {\n          e.preventDefault()\n          selectOption(\n            filteredOptions[activeOptionIndex].value,\n            filteredOptions[activeOptionIndex].disabled,\n          )\n        }\n      },\n      ArrowDown: () => {\n        e.preventDefault()\n        setActiveOptionIndex((prev) =>\n          _findNextAvailableIndex(prev !== null ? prev : -1, 'down'),\n        )\n        if (!isDropdownOpen) toggleDropdown()\n      },\n      ArrowUp: () => {\n        e.preventDefault()\n        setActiveOptionIndex((prev) =>\n          _findNextAvailableIndex(\n            prev !== null ? prev : filteredOptions.length,\n            'up',\n          ),\n        )\n        if (!isDropdownOpen) toggleDropdown()\n      },\n      Escape: () => {\n        setIsDropdownOpen(false)\n      },\n    }\n\n    if (_actions[e.key]) {\n      _actions[e.key]()\n    }\n  }\n\n  const selectOption = (optionValue: string, optionDisabled?: boolean) => {\n    if (optionDisabled) return\n\n    const option = options.find((option) => option.value === optionValue)\n    if (option) {\n      setSelectedOption({ value: option.value, label: option.label })\n    }\n\n    setActiveOptionIndex(null)\n    setSearchValue('')\n    setTimeout(() => setIsDropdownOpen(false), 500)\n\n    if (onChange) {\n      onChange(optionValue)\n    }\n  }\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value\n    setSearchValue(value)\n\n    if (onChange) {\n      onChange(value)\n    }\n\n    if (value === '') {\n      setSelectedOption({ value: '', label: '' })\n    }\n\n    if (!isDropdownOpen) {\n      setIsDropdownOpen(true)\n    }\n  }\n\n  const handleOnBlur = (event?: React.FocusEvent<Element>) => {\n    if (onBlur) {\n      setTimeout(() => {\n        const getOptionByLabel = (label: string) =>\n          options.find((option) => option.label === label)\n\n        const elementValue = (event?.target as HTMLInputElement).value\n        const selectedOptionFromElement = getOptionByLabel(elementValue)\n        const customValue = fullScreenOptionsEnabled\n          ? { value: '', label: '' }\n          : { value: elementValue, label: '' }\n\n        const targetValue = selectedOption?.value\n          ? selectedOption\n          : selectedOptionFromElement || customValue\n\n        onBlur({\n          ...event,\n          target: targetValue,\n        } as React.FocusEvent<Element> & {\n          target: OptionProps\n        })\n      }, 200)\n    }\n  }\n\n  const onCloseOptions = () => {\n    setIsDropdownOpen(false)\n  }\n\n  return {\n    isDropdownOpen,\n    selectRef,\n    activeOptionRef,\n    selectElementRef,\n    toggleDropdown,\n    selectOption,\n    onKeyDownDropdown,\n    setActiveOptionIndex,\n    activeOptionIndex,\n    filteredOptions,\n    searchValue,\n    setSearchValue,\n    handleInputChange,\n    dropdownMaxHeight,\n    selectedOption,\n    setSelectedOption,\n    handleOnBlur,\n    onCloseOptions,\n    fullScreenOptionsEnabled\n  }\n}\n","import { useId } from 'react'\nimport { createPortal } from 'react-dom'\nimport classNames from 'classnames'\nimport {\n  IconChevronDown,\n  IconSlash,\n  IconCheck,\n  IconSearch,\n} from '@components/icons'\nimport { Modal } from '@components/Modal'\nimport { Text } from '@components/Text'\nimport { Conditional } from '@components/misc'\nimport { COLOR_NEUTRAL_40 } from '@core/tokens'\nimport { isMobile } from '@core/utils/isMobile'\n\nimport Field from '../Field'\nimport { OptionProps, SelectFieldProps } from './types'\nimport { useSelectField } from './hook'\nimport './styles.scss'\n\nexport const SelectField = ({\n  label,\n  options,\n  showOptionalLabel,\n  error,\n  errorMessage,\n  helpMessage,\n  disabled,\n  required,\n  value,\n  onChange,\n  style,\n  className,\n  placeholder,\n  name,\n  register,\n  onBlur,\n  autocomplete = false,\n  EmptyText = 'Nada encontrado',\n  fullScreenOptions = false,\n  htmlType = 'text'\n}: SelectFieldProps) => {\n  const labelId = useId()\n  const generatedErrorId = useId()\n  const errorId = error && errorMessage ? generatedErrorId : undefined\n\n  const {\n    isDropdownOpen,\n    selectRef,\n    selectElementRef,\n    activeOptionRef,\n    toggleDropdown,\n    selectOption,\n    onKeyDownDropdown,\n    setActiveOptionIndex,\n    activeOptionIndex,\n    filteredOptions,\n    searchValue,\n    selectedOption,\n    handleInputChange,\n    dropdownMaxHeight,\n    handleOnBlur,\n    onCloseOptions,\n    fullScreenOptionsEnabled\n  } = useSelectField(\n    options,\n    value,\n    onChange,\n    onBlur,\n    disabled,\n    register,\n    autocomplete,\n    fullScreenOptions,\n  )\n\n  const selectClasses = classNames('au-field__select', {\n    'au-field__select--disabled': disabled,\n    'au-field__select--open': isDropdownOpen,\n    'au-field__select--required': required,\n    'au-field__select--error': error,\n    [className!]: className,\n  })\n\n  const optionsClasses = classNames('au-field__select-options', {\n    'au-field__select-options--open': isDropdownOpen,\n  })\n\n  const optionClasses = (option: OptionProps, index: number) =>\n    classNames('au-field__select-option', {\n      'au-field__select-option--highlighted': activeOptionIndex === index,\n      'au-field__select-option--selected':\n        option.value === selectedOption.value,\n      'au-field__select-option--disabled': option.disabled,\n    })\n\n  const fullScreenOptionClasses = (option: OptionProps, index: number) =>\n    classNames('au-field__fullscreen-options-select-option', {\n      'au-field__fullscreen-options-select-option--highlighted':\n        activeOptionIndex === index,\n      'au-field__fullscreen-options-select-option--selected':\n        option.value === selectedOption.value,\n      'au-field__fullscreen-options-select-option--disabled': option.disabled,\n    })\n\n  return (\n    <>\n      <Field.Root\n        style={style}\n        customclass={className}\n        error={error}\n        disabled={disabled}>\n        <Field.Label\n          text={label}\n          labelId={labelId}\n          showOptionalLabel={showOptionalLabel}\n          required={required}\n          error={error}\n          disabled={disabled}\n        />\n        <div className={selectClasses}>\n          <div\n            className=\"au-field__select-wrapper\"\n            onClick={toggleDropdown}\n            onKeyDown={onKeyDownDropdown}\n            tabIndex={disabled ? -1 : 0}\n            ref={selectRef}\n            role=\"combobox\"\n            aria-haspopup=\"listbox\"\n            aria-expanded={isDropdownOpen}\n            aria-labelledby={labelId}\n            aria-describedby={errorId}\n            aria-activedescendant={\n              activeOptionIndex !== null && filteredOptions[activeOptionIndex]\n                ? filteredOptions[activeOptionIndex].value\n                : undefined\n            }\n            onBlur={handleOnBlur}>\n            <input\n              className=\"au-field__select-input\"\n              value={(!fullScreenOptionsEnabled ? searchValue : null) || selectedOption.label}\n              placeholder={placeholder || 'Selecionar...'}\n              onChange={handleInputChange}\n              readOnly={!autocomplete || fullScreenOptionsEnabled}\n              disabled={disabled}\n              type={htmlType}\n              aria-labelledby={labelId}\n            />\n            <div className=\"au-field__select-icon\" aria-hidden=\"true\">\n              <IconChevronDown />\n            </div>\n          </div>\n          <Conditional\n            condition={!fullScreenOptionsEnabled || !isMobile()}\n            renderIf={\n              <ul\n                className={optionsClasses}\n                role=\"listbox\"\n                aria-live=\"polite\"\n                tabIndex={-1}\n                style={{\n                  maxHeight: `${dropdownMaxHeight}px`,\n                  overflowY: 'auto',\n                }}>\n                {filteredOptions.length === 0 ? (\n                  <li className=\"au-field__select-option au-field__select-option--empty\">\n                    {EmptyText}\n                  </li>\n                ) : (\n                  filteredOptions.map((option, index) => (\n                    <li\n                      key={index}\n                      className={optionClasses(option, index)}\n                      ref={activeOptionIndex === index ? activeOptionRef : null}\n                      role=\"option\"\n                      aria-selected={option.value === selectedOption.value}\n                      aria-disabled={option.disabled}\n                      onPointerUp={() =>\n                        selectOption(option.value, option.disabled)\n                      }\n                      onMouseEnter={() => setActiveOptionIndex(index)}>\n                      {option.label}\n                      {option.disabled ? (\n                        <IconSlash aria-hidden=\"true\" />\n                      ) : option.value === selectedOption.value ? (\n                        <IconCheck aria-hidden=\"true\" />\n                      ) : null}\n                    </li>\n                  ))\n                )}\n              </ul>\n            }\n          />\n\n          <select\n            hidden\n            disabled={disabled}\n            value={selectedOption.value}\n            onChange={(e) => selectOption(e.target.value)}\n            ref={selectElementRef}\n            name={name}>\n            {options.map((option, index) => (\n              <option key={index} value={option.value}>\n                {option.label}\n              </option>\n            ))}\n          </select>\n        </div>\n        <Field.Message\n          hasError={!!error}\n          errorMessage={errorMessage}\n          helpMessage={helpMessage}\n          errorId={errorId}\n        />\n      </Field.Root>\n\n      <Conditional\n        condition={fullScreenOptionsEnabled}\n        renderIf={\n          <>\n            {createPortal(\n              <Modal\n                isOpen={isDropdownOpen}\n                onClose={onCloseOptions}\n                headerContent={\n                  <div>\n                    <Text as=\"label\" variant=\"heading-small\" weight=\"bold\">\n                      {label}\n                    </Text>\n                    <div\n                      className=\"au-field__fullscreen-options-select-search-bar\"\n                      onKeyDown={onKeyDownDropdown}\n                      tabIndex={disabled ? -1 : 0}\n                      ref={selectRef}\n                      role=\"combobox\"\n                      aria-haspopup=\"listbox\"\n                      aria-expanded={isDropdownOpen}\n                      aria-labelledby={labelId}\n                      aria-activedescendant={\n                        activeOptionIndex !== null &&\n                        filteredOptions[activeOptionIndex]\n                          ? filteredOptions[activeOptionIndex].value\n                          : undefined\n                      }\n                      onBlur={handleOnBlur}>\n                      <input\n                        className=\"au-field__select-input\"\n                        value={searchValue || selectedOption.label}\n                        placeholder={'Buscar'}\n                        onChange={handleInputChange}\n                        disabled={disabled}\n                        type={htmlType}\n                        aria-label=\"Buscar\"\n                      />\n                      <div className=\"au-field__select-icon\" aria-hidden=\"true\">\n                        <IconSearch rawColor={COLOR_NEUTRAL_40} />\n                      </div>\n                    </div>\n                  </div>\n                }\n                content={\n                  <div className=\"au-field__fullscreen-options-select-options\" role=\"listbox\">\n                    {filteredOptions.map((option, index) => (\n                      <li\n                        key={index}\n                        className={fullScreenOptionClasses(option, index)}\n                        ref={\n                          activeOptionIndex === index ? activeOptionRef : null\n                        }\n                        role=\"option\"\n                        aria-selected={option.value === selectedOption.value}\n                        aria-disabled={option.disabled}\n                        onPointerUp={() =>\n                          selectOption(option.value, option.disabled)\n                        }\n                        onMouseEnter={() => setActiveOptionIndex(index)}>\n                        {option.label}\n                        {option.disabled ? (\n                          <IconSlash aria-hidden=\"true\" />\n                        ) : option.value === selectedOption.value ? (\n                          <IconCheck aria-hidden=\"true\" />\n                        ) : null}\n                      </li>\n                    ))}\n                  </div>\n                }\n              />,\n              document.body,\n            )}\n          </>\n        }\n      />\n    </>\n  )\n}\n"],"names":["option","_a"],"mappings":"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"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/SelectField/hook.ts","../../../lib/components/form/SelectField/index.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from 'react'\nimport { OptionProps } from './types'\nimport { isMobile } from '@core/utils/isMobile'\n\nexport const useSelectField = (\n  options: OptionProps[],\n  initialValue?: string,\n  onChange?: (value: string) => void,\n  onBlur?: React.FocusEventHandler,\n  disabled?: boolean,\n  register?: (instance: HTMLSelectElement | null) => void,\n  autocomplete: boolean = false,\n  fullScreenOptions: boolean = false,\n) => {\n  const [isDropdownOpen, setIsDropdownOpen] = useState(false)\n  const [selectedOption, setSelectedOption] = useState<OptionProps>({\n    value: initialValue || '',\n    label: initialValue\n      ? options.find((option) => option.value === initialValue)?.label || ''\n      : '',\n  })\n  const [activeOptionIndex, setActiveOptionIndex] = useState<number | null>(\n    null,\n  )\n  const [dropdownMaxHeight, setDropdownMaxHeight] = useState<number>(0)\n  const selectRef = useRef<HTMLDivElement>(null)\n  const selectElementRef = useRef<HTMLSelectElement>(null)\n  const [searchValue, setSearchValue] = useState<string>('')\n  const activeOptionRef = useRef<HTMLLIElement | null>(null)\n\n  const fullScreenOptionsEnabled = fullScreenOptions && Boolean(isMobile())\n\n  const filteredOptions =\n    autocomplete || fullScreenOptions\n      ? options.filter((option) =>\n          option.label.toLowerCase().includes(searchValue.toLowerCase()),\n        )\n      : options\n\n  useEffect(() => {\n    if (initialValue) {\n      const option = options.find((option) => option.value === initialValue)\n      if (option) {\n        setSelectedOption({ value: option.value, label: option.label })\n      }\n    }\n  }, [initialValue, options])\n\n  useEffect(() => {\n    if (register && selectElementRef.current) {\n      register(selectElementRef.current)\n    }\n  }, [register])\n\n  useEffect(() => {\n    if (activeOptionRef.current) {\n      activeOptionRef.current.scrollIntoView({\n        behavior: 'smooth',\n        block: 'nearest',\n      })\n    }\n  }, [activeOptionIndex])\n\n  useEffect(() => {\n    const handleClickOutside = (event: PointerEvent) => {\n      const isClickedOutside =\n        selectRef.current &&\n        !selectRef.current.contains(event.target as Node) &&\n        activeOptionRef.current\n\n      if (isClickedOutside) {\n        setIsDropdownOpen(false)\n      }\n    }\n\n    if (isDropdownOpen) {\n      document.addEventListener('pointerup', handleClickOutside)\n    } else {\n      document.removeEventListener('pointerup', handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener('pointerup', handleClickOutside)\n    }\n  }, [isDropdownOpen])\n\n  const toggleDropdown = () => {\n    if (!isDropdownOpen && selectRef.current) {\n      const { bottom } = selectRef.current.getBoundingClientRect()\n      let totalPadding = 0\n      let parentElement: HTMLElement | null = selectRef.current.parentElement\n\n      while (parentElement) {\n        const parentPaddingBottom = parseFloat(\n          window.getComputedStyle(parentElement).paddingBottom || '0',\n        )\n        totalPadding += parentPaddingBottom\n        parentElement = parentElement.parentElement\n      }\n\n      const availableSpaceBelow = window.innerHeight - bottom - totalPadding\n      const minDropdownHeight = 212\n      const calculatedHeight = Math.max(availableSpaceBelow, minDropdownHeight)\n\n      setDropdownMaxHeight(calculatedHeight)\n    }\n\n    setIsDropdownOpen((prev) => {\n      if (!prev) {\n        const selectedIndex = options.findIndex(\n          (option) => option.value === selectedOption.value,\n        )\n        setActiveOptionIndex(selectedIndex !== -1 ? selectedIndex : null)\n      }\n      return !prev\n    })\n  }\n\n  const _findNextAvailableIndex = (\n    currentIndex: number,\n    direction: 'down' | 'up',\n  ) => {\n    const step = direction === 'down' ? 1 : -1\n    let nextIndex =\n      (currentIndex + step + filteredOptions.length) % filteredOptions.length\n\n    while (filteredOptions[nextIndex]?.disabled) {\n      nextIndex =\n        (nextIndex + step + filteredOptions.length) % filteredOptions.length\n    }\n\n    return nextIndex\n  }\n\n  const onKeyDownDropdown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (disabled) return\n\n    const _actions: Record<string, () => void> = {\n      Enter: () => {\n        if (!isDropdownOpen) {\n          toggleDropdown()\n          return\n        }\n        if (\n          activeOptionIndex !== null &&\n          !filteredOptions[activeOptionIndex].disabled\n        ) {\n          e.preventDefault()\n          selectOption(\n            filteredOptions[activeOptionIndex].value,\n            filteredOptions[activeOptionIndex].disabled,\n          )\n        }\n      },\n      ArrowDown: () => {\n        e.preventDefault()\n        setActiveOptionIndex((prev) =>\n          _findNextAvailableIndex(prev !== null ? prev : -1, 'down'),\n        )\n        if (!isDropdownOpen) toggleDropdown()\n      },\n      ArrowUp: () => {\n        e.preventDefault()\n        setActiveOptionIndex((prev) =>\n          _findNextAvailableIndex(\n            prev !== null ? prev : filteredOptions.length,\n            'up',\n          ),\n        )\n        if (!isDropdownOpen) toggleDropdown()\n      },\n      Escape: () => {\n        setIsDropdownOpen(false)\n      },\n    }\n\n    if (_actions[e.key]) {\n      _actions[e.key]()\n    }\n  }\n\n  const selectOption = (optionValue: string, optionDisabled?: boolean) => {\n    if (optionDisabled) return\n\n    const option = options.find((option) => option.value === optionValue)\n    if (option) {\n      setSelectedOption({ value: option.value, label: option.label })\n    }\n\n    setActiveOptionIndex(null)\n    setSearchValue('')\n    setTimeout(() => setIsDropdownOpen(false), 500)\n\n    if (onChange) {\n      onChange(optionValue)\n    }\n  }\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value\n    setSearchValue(value)\n\n    if (onChange) {\n      onChange(value)\n    }\n\n    if (value === '') {\n      setSelectedOption({ value: '', label: '' })\n    }\n\n    if (!isDropdownOpen) {\n      setIsDropdownOpen(true)\n    }\n  }\n\n  const handleOnBlur = (event?: React.FocusEvent<Element>) => {\n    if (onBlur) {\n      setTimeout(() => {\n        const getOptionByLabel = (label: string) =>\n          options.find((option) => option.label === label)\n\n        const elementValue = (event?.target as HTMLInputElement).value\n        const selectedOptionFromElement = getOptionByLabel(elementValue)\n        const customValue = fullScreenOptionsEnabled\n          ? { value: '', label: '' }\n          : { value: elementValue, label: '' }\n\n        const targetValue = selectedOption?.value\n          ? selectedOption\n          : selectedOptionFromElement || customValue\n\n        onBlur({\n          ...event,\n          target: targetValue,\n        } as React.FocusEvent<Element> & {\n          target: OptionProps\n        })\n      }, 200)\n    }\n  }\n\n  const onCloseOptions = () => {\n    setIsDropdownOpen(false)\n  }\n\n  return {\n    isDropdownOpen,\n    selectRef,\n    activeOptionRef,\n    selectElementRef,\n    toggleDropdown,\n    selectOption,\n    onKeyDownDropdown,\n    setActiveOptionIndex,\n    activeOptionIndex,\n    filteredOptions,\n    searchValue,\n    setSearchValue,\n    handleInputChange,\n    dropdownMaxHeight,\n    selectedOption,\n    setSelectedOption,\n    handleOnBlur,\n    onCloseOptions,\n    fullScreenOptionsEnabled\n  }\n}\n","import { useId } from 'react'\nimport { createPortal } from 'react-dom'\nimport classNames from 'classnames'\nimport {\n  IconChevronDown,\n  IconSlash,\n  IconCheck,\n  IconSearch,\n} from '@components/icons'\nimport { Modal } from '@components/Modal'\nimport { Text } from '@components/Text'\nimport { Conditional } from '@components/misc'\nimport { COLOR_NEUTRAL_40 } from '@core/tokens'\nimport { isMobile } from '@core/utils/isMobile'\n\nimport Field from '../Field'\nimport { OptionProps, SelectFieldProps } from './types'\nimport { useSelectField } from './hook'\nimport './styles.scss'\n\nexport const SelectField = ({\n  label,\n  options,\n  showOptionalLabel,\n  error,\n  errorMessage,\n  helpMessage,\n  disabled,\n  required,\n  value,\n  onChange,\n  style,\n  className,\n  placeholder,\n  name,\n  register,\n  onBlur,\n  autocomplete = false,\n  EmptyText = 'Nada encontrado',\n  fullScreenOptions = false,\n  htmlType = 'text',\n  'data-testid': dataTestId,\n}: SelectFieldProps) => {\n  const labelId = useId()\n  const generatedErrorId = useId()\n  const errorId = error && errorMessage ? generatedErrorId : undefined\n\n  const {\n    isDropdownOpen,\n    selectRef,\n    selectElementRef,\n    activeOptionRef,\n    toggleDropdown,\n    selectOption,\n    onKeyDownDropdown,\n    setActiveOptionIndex,\n    activeOptionIndex,\n    filteredOptions,\n    searchValue,\n    selectedOption,\n    handleInputChange,\n    dropdownMaxHeight,\n    handleOnBlur,\n    onCloseOptions,\n    fullScreenOptionsEnabled\n  } = useSelectField(\n    options,\n    value,\n    onChange,\n    onBlur,\n    disabled,\n    register,\n    autocomplete,\n    fullScreenOptions,\n  )\n\n  const selectClasses = classNames('au-field__select', {\n    'au-field__select--disabled': disabled,\n    'au-field__select--open': isDropdownOpen,\n    'au-field__select--required': required,\n    'au-field__select--error': error,\n    [className!]: className,\n  })\n\n  const optionsClasses = classNames('au-field__select-options', {\n    'au-field__select-options--open': isDropdownOpen,\n  })\n\n  const optionClasses = (option: OptionProps, index: number) =>\n    classNames('au-field__select-option', {\n      'au-field__select-option--highlighted': activeOptionIndex === index,\n      'au-field__select-option--selected':\n        option.value === selectedOption.value,\n      'au-field__select-option--disabled': option.disabled,\n    })\n\n  const fullScreenOptionClasses = (option: OptionProps, index: number) =>\n    classNames('au-field__fullscreen-options-select-option', {\n      'au-field__fullscreen-options-select-option--highlighted':\n        activeOptionIndex === index,\n      'au-field__fullscreen-options-select-option--selected':\n        option.value === selectedOption.value,\n      'au-field__fullscreen-options-select-option--disabled': option.disabled,\n    })\n\n  return (\n    <>\n      <Field.Root\n        style={style}\n        customclass={className}\n        error={error}\n        disabled={disabled}>\n        <Field.Label\n          text={label}\n          labelId={labelId}\n          showOptionalLabel={showOptionalLabel}\n          required={required}\n          error={error}\n          disabled={disabled}\n        />\n        <div className={selectClasses}>\n          <div\n            className=\"au-field__select-wrapper\"\n            data-testid={dataTestId}\n            onClick={toggleDropdown}\n            onKeyDown={onKeyDownDropdown}\n            tabIndex={disabled ? -1 : 0}\n            ref={selectRef}\n            role=\"combobox\"\n            aria-haspopup=\"listbox\"\n            aria-expanded={isDropdownOpen}\n            aria-labelledby={labelId}\n            aria-describedby={errorId}\n            aria-activedescendant={\n              activeOptionIndex !== null && filteredOptions[activeOptionIndex]\n                ? filteredOptions[activeOptionIndex].value\n                : undefined\n            }\n            onBlur={handleOnBlur}>\n            <input\n              className=\"au-field__select-input\"\n              value={(!fullScreenOptionsEnabled ? searchValue : null) || selectedOption.label}\n              placeholder={placeholder || 'Selecionar...'}\n              onChange={handleInputChange}\n              readOnly={!autocomplete || fullScreenOptionsEnabled}\n              disabled={disabled}\n              type={htmlType}\n              aria-labelledby={labelId}\n            />\n            <div className=\"au-field__select-icon\" aria-hidden=\"true\">\n              <IconChevronDown />\n            </div>\n          </div>\n          <Conditional\n            condition={!fullScreenOptionsEnabled || !isMobile()}\n            renderIf={\n              <ul\n                className={optionsClasses}\n                role=\"listbox\"\n                aria-live=\"polite\"\n                tabIndex={-1}\n                style={{\n                  maxHeight: `${dropdownMaxHeight}px`,\n                  overflowY: 'auto',\n                }}>\n                {filteredOptions.length === 0 ? (\n                  <li className=\"au-field__select-option au-field__select-option--empty\">\n                    {EmptyText}\n                  </li>\n                ) : (\n                  filteredOptions.map((option, index) => (\n                    <li\n                      key={index}\n                      className={optionClasses(option, index)}\n                      ref={activeOptionIndex === index ? activeOptionRef : null}\n                      role=\"option\"\n                      aria-selected={option.value === selectedOption.value}\n                      aria-disabled={option.disabled}\n                      onPointerUp={() =>\n                        selectOption(option.value, option.disabled)\n                      }\n                      onMouseEnter={() => setActiveOptionIndex(index)}>\n                      {option.label}\n                      {option.disabled ? (\n                        <IconSlash aria-hidden=\"true\" />\n                      ) : option.value === selectedOption.value ? (\n                        <IconCheck aria-hidden=\"true\" />\n                      ) : null}\n                    </li>\n                  ))\n                )}\n              </ul>\n            }\n          />\n\n          <select\n            hidden\n            disabled={disabled}\n            value={selectedOption.value}\n            onChange={(e) => selectOption(e.target.value)}\n            ref={selectElementRef}\n            name={name}>\n            {options.map((option, index) => (\n              <option key={index} value={option.value}>\n                {option.label}\n              </option>\n            ))}\n          </select>\n        </div>\n        <Field.Message\n          hasError={!!error}\n          errorMessage={errorMessage}\n          helpMessage={helpMessage}\n          errorId={errorId}\n        />\n      </Field.Root>\n\n      <Conditional\n        condition={fullScreenOptionsEnabled}\n        renderIf={\n          <>\n            {createPortal(\n              <Modal\n                isOpen={isDropdownOpen}\n                onClose={onCloseOptions}\n                headerContent={\n                  <div>\n                    <Text as=\"label\" variant=\"heading-small\" weight=\"bold\">\n                      {label}\n                    </Text>\n                    <div\n                      className=\"au-field__fullscreen-options-select-search-bar\"\n                      onKeyDown={onKeyDownDropdown}\n                      tabIndex={disabled ? -1 : 0}\n                      ref={selectRef}\n                      role=\"combobox\"\n                      aria-haspopup=\"listbox\"\n                      aria-expanded={isDropdownOpen}\n                      aria-labelledby={labelId}\n                      aria-activedescendant={\n                        activeOptionIndex !== null &&\n                        filteredOptions[activeOptionIndex]\n                          ? filteredOptions[activeOptionIndex].value\n                          : undefined\n                      }\n                      onBlur={handleOnBlur}>\n                      <input\n                        className=\"au-field__select-input\"\n                        value={searchValue || selectedOption.label}\n                        placeholder={'Buscar'}\n                        onChange={handleInputChange}\n                        disabled={disabled}\n                        type={htmlType}\n                        aria-label=\"Buscar\"\n                      />\n                      <div className=\"au-field__select-icon\" aria-hidden=\"true\">\n                        <IconSearch rawColor={COLOR_NEUTRAL_40} />\n                      </div>\n                    </div>\n                  </div>\n                }\n                content={\n                  <div className=\"au-field__fullscreen-options-select-options\" role=\"listbox\">\n                    {filteredOptions.map((option, index) => (\n                      <li\n                        key={index}\n                        className={fullScreenOptionClasses(option, index)}\n                        ref={\n                          activeOptionIndex === index ? activeOptionRef : null\n                        }\n                        role=\"option\"\n                        aria-selected={option.value === selectedOption.value}\n                        aria-disabled={option.disabled}\n                        onPointerUp={() =>\n                          selectOption(option.value, option.disabled)\n                        }\n                        onMouseEnter={() => setActiveOptionIndex(index)}>\n                        {option.label}\n                        {option.disabled ? (\n                          <IconSlash aria-hidden=\"true\" />\n                        ) : option.value === selectedOption.value ? (\n                          <IconCheck aria-hidden=\"true\" />\n                        ) : null}\n                      </li>\n                    ))}\n                  </div>\n                }\n              />,\n              document.body,\n            )}\n          </>\n        }\n      />\n    </>\n  )\n}\n"],"names":["option","_a"],"mappings":"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"}

package/dist/components/SelectField/styles.css

@@ -1 +1 @@
-.au-field__select{position:relative}.au-field__select-wrapper{display:flex;align-items:center;justify-content:space-between;width:100%;height:56px;background-color:#fff;border:1px solid #454a54;border-radius:8px;box-sizing:border-box;font-size:16px;line-height:22px;overflow:hidden}.au-field__select-wrapper:focus-within{border:2px solid #0048db}.au-field__select-input{width:100%;height:100%;border:none;padding:16px 56px 16px 16px;font-family:inherit;font-size:16px;line-height:22px}.au-field__select-input:read-only{cursor:pointer}.au-field__select-icon{position:absolute;right:16px;transition:transform .2s ease}.au-field__select-options{display:flex;flex-direction:column;width:100%;max-height:212px;margin-top:16px;padding-inline-start:0;box-sizing:border-box;border:1px solid #0048db;background:#fff;border-radius:8px;overflow:hidden;cursor:auto;position:absolute;transform-origin:top left;transform:scaleY(0);opacity:0;visibility:hidden;transition:transform .2s,opacity .2s,visibility 0s .2s;z-index:1}.au-field__select-options--open{transform:scaleY(1);opacity:1;visibility:visible;transition:transform .2s,opacity .2s}.au-field__select-options::-webkit-scrollbar{width:16px}.au-field__select-options::-webkit-scrollbar-thumb{background-color:#135df5;border:4px solid #ffffff;border-radius:8px}.au-field__select-options::-webkit-scrollbar-track{background-color:#fff;border-radius:8px}.au-field__select-option{display:flex;justify-content:space-between;padding:16px 24px;cursor:pointer}.au-field__select-option:not(.au-field__select-option--selected):hover,.au-field__select-option--highlighted:not(.au-field__select-option--selected){background-color:#f6f7fa;color:#16181d}.au-field__select-option--selected{background-color:#0048db;color:#fff;font-weight:700}.au-field__select-option--selected .au-icon>svg{color:#fff}.au-field__select-option--disabled{pointer-events:none;cursor:not-allowed;background-color:#e2e4e9;color:#5e6573}.au-field__select-option--disabled .au-icon>svg{color:#5e6573}.au-field__select-option--empty{cursor:default;background-color:#e2e4e9;color:#5e6573}.au-field__select-option--empty:hover{background-color:#e2e4e9}.au-field__select--open .au-field__select-wrapper{border:2px solid #0048db}.au-field__select--open .au-field__select-wrapper .au-field__select-icon{transform:rotate(180deg)}.au-field__select--disabled{pointer-events:none;cursor:not-allowed}.au-field__select--disabled .au-field__select-wrapper{background-color:#e2e4e9}.au-field__select--disabled .au-field__select-wrapper .au-icon>svg{color:#5e6573}.au-field__select--error .au-field__select-wrapper{background-color:#f5eff0;border-color:#991717}.au-field__select--error .au-field__select-wrapper:focus{border-color:#0048db}.au-field__fullscreen-options-select-search-bar{display:flex;align-items:center;justify-content:space-between;width:100%;height:56px;margin:16px 0 24px;background-color:#fff;border:1px solid #e2e4e9;border-radius:8px;box-sizing:border-box;color:#5e6573;font-size:16px;line-height:22px;overflow:hidden}.au-field__fullscreen-options-select-search-bar:focus-within{border:2px solid #0048db}.au-field__fullscreen-options-select-options{display:flex;flex-direction:column;gap:16px;margin-right:8px}.au-field__fullscreen-options-select-option{display:flex;justify-content:space-between;padding:16px;cursor:pointer;border-radius:8px;border:1px solid #e2e4e9;color:#16181d;transition:all .2s ease-in-out}.au-field__fullscreen-options-select-option:not(.au-field__fullscreen-options-select-option--selected):hover,.au-field__fullscreen-options-select-option--highlighted:not(.au-field__fullscreen-options-select-option--selected){background-color:#f6f7fa;color:#16181d}.au-field__fullscreen-options-select-option--selected{background-color:#0048db;border-color:#0048db;color:#fff;font-weight:700}.au-field__fullscreen-options-select-option--selected .au-icon>svg{color:#fff}.au-field__fullscreen-options-select-option--disabled{pointer-events:none;cursor:not-allowed;background-color:#e2e4e9;color:#5e6573}.au-field__fullscreen-options-select-option--disabled .au-icon>svg{color:#5e6573}.au-field__fullscreen-options-select-option--empty{cursor:default;background-color:#e2e4e9;color:#5e6573}.au-field__fullscreen-options-select-option--empty:hover{background-color:#e2e4e9}.au-field:not(.au-field--error):has(.au-field__select--open) .au-field__header-label{color:#0048db}.au-field:not(.au-field--error):has(.au-field__select--open) .au-field__select-wrapper,.au-field:not(.au-field--error):has(.au-field__select--open) .au-field__select-wrapper:focus-within{border-width:1px}
+.au-field__select{position:relative}.au-field__select-wrapper{display:flex;align-items:center;justify-content:space-between;width:100%;height:56px;background-color:#fff;border:1px solid #454a54;border-radius:8px;box-sizing:border-box;font-size:16px;line-height:22px;overflow:hidden}.au-field__select-wrapper:focus-within{border:2px solid #0048db}.au-field__select-input{width:100%;height:100%;border:none;padding:16px 56px 16px 16px;font-family:inherit;font-size:16px;line-height:22px}.au-field__select-input:read-only{cursor:pointer}.au-field__select-icon{position:absolute;right:16px;transition:transform .2s ease}.au-field__select-options{display:flex;flex-direction:column;width:100%;max-height:212px;margin-top:16px;padding-inline-start:0;box-sizing:border-box;border:1px solid #0048db;background:#fff;border-radius:8px;overflow:hidden;cursor:auto;position:absolute;transform-origin:top left;transform:scaleY(0);opacity:0;visibility:hidden;transition:transform .2s,opacity .2s,visibility 0s .2s;z-index:1}.au-field__select-options--open{transform:scaleY(1);opacity:1;visibility:visible;transition:transform .2s,opacity .2s}.au-field__select-options::-webkit-scrollbar{width:16px}.au-field__select-options::-webkit-scrollbar-thumb{background-color:#135df5;border:4px solid #ffffff;border-radius:8px}.au-field__select-options::-webkit-scrollbar-track{background-color:#fff;border-radius:8px}.au-field__select-option{display:flex;justify-content:space-between;padding:16px 24px;cursor:pointer}.au-field__select-option:not(.au-field__select-option--selected):hover,.au-field__select-option--highlighted:not(.au-field__select-option--selected){background-color:#f6f7fa;color:#16181d}.au-field__select-option--selected{background-color:#0048db;color:#fff;font-weight:700}.au-field__select-option--selected .au-icon>svg{color:#fff}.au-field__select-option--disabled{pointer-events:none;cursor:not-allowed;background-color:#e2e4e9;color:#5e6573}.au-field__select-option--disabled .au-icon>svg{color:#5e6573}.au-field__select-option--empty{cursor:default;background-color:#e2e4e9;color:#5e6573}.au-field__select-option--empty:hover{background-color:#e2e4e9}.au-field__select--open .au-field__select-wrapper{border:2px solid #0048db}.au-field__select--open .au-field__select-wrapper .au-field__select-icon{transform:rotate(180deg)}.au-field__select--disabled{pointer-events:none;cursor:not-allowed}.au-field__select--disabled .au-field__select-wrapper{background-color:#e2e4e9;border-color:#5e6573}.au-field__select--disabled .au-field__select-wrapper .au-icon>svg{color:#5e6573}.au-field__select--error .au-field__select-wrapper{background-color:#f5eff0;border-color:#991717}.au-field__select--error .au-field__select-wrapper:focus{border-color:#0048db}.au-field__fullscreen-options-select-search-bar{display:flex;align-items:center;justify-content:space-between;width:100%;height:56px;margin:16px 0 24px;background-color:#fff;border:1px solid #e2e4e9;border-radius:8px;box-sizing:border-box;color:#5e6573;font-size:16px;line-height:22px;overflow:hidden}.au-field__fullscreen-options-select-search-bar:focus-within{border:2px solid #0048db}.au-field__fullscreen-options-select-options{display:flex;flex-direction:column;gap:16px;margin-right:8px}.au-field__fullscreen-options-select-option{display:flex;justify-content:space-between;padding:16px;cursor:pointer;border-radius:8px;border:1px solid #e2e4e9;color:#16181d;transition:all .2s ease-in-out}.au-field__fullscreen-options-select-option:not(.au-field__fullscreen-options-select-option--selected):hover,.au-field__fullscreen-options-select-option--highlighted:not(.au-field__fullscreen-options-select-option--selected){background-color:#f6f7fa;color:#16181d}.au-field__fullscreen-options-select-option--selected{background-color:#0048db;border-color:#0048db;color:#fff;font-weight:700}.au-field__fullscreen-options-select-option--selected .au-icon>svg{color:#fff}.au-field__fullscreen-options-select-option--disabled{pointer-events:none;cursor:not-allowed;background-color:#e2e4e9;color:#5e6573}.au-field__fullscreen-options-select-option--disabled .au-icon>svg{color:#5e6573}.au-field__fullscreen-options-select-option--empty{cursor:default;background-color:#e2e4e9;color:#5e6573}.au-field__fullscreen-options-select-option--empty:hover{background-color:#e2e4e9}.au-field:not(.au-field--error):has(.au-field__select--open) .au-field__header-label{color:#0048db}.au-field:not(.au-field--error):has(.au-field__select--open) .au-field__select-wrapper,.au-field:not(.au-field--error):has(.au-field__select--open) .au-field__select-wrapper:focus-within{border-width:1px}

package/dist/components/Skeleton/Skeleton.stories.d.ts

@@ -6,5 +6,7 @@ type Story = StoryObj<typeof Skeleton>;
 export declare const Example: Story;
 export declare const Square: Story;
 export declare const Circle: Story;
+export declare const Icon: Story;
+export declare const Text: Story;
 export declare const Block: Story;
 export declare const NotActive: Story;

package/dist/components/Skeleton/index.d.ts

@@ -5,6 +5,7 @@ type SkeletonProps = {
     block?: boolean;
     width?: number;
     height?: number;
+    'data-testid'?: string;
 };
-export declare const Skeleton: ({ active, shape, color, block, height, width, }: SkeletonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Skeleton: ({ active, shape, color, block, height, width, "data-testid": dataTestId, }: SkeletonProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Skeleton/index.es.js

@@ -6,7 +6,8 @@ import './styles.css';const Skeleton = ({
   color = "primary",
   block = false,
   height,
-  width
+  width,
+  "data-testid": dataTestId
 }) => {
   const skeletonClasses = classNames("au-skeleton", {
     "au-skeleton--active": active,
@@ -18,7 +19,7 @@ import './styles.css';const Skeleton = ({
     height: height ? `${height}px` : "28px",
     width: width ? `${width}px` : block ? "100%" : "80px"
   };
-  return /* @__PURE__ */ jsx("div", { className: skeletonClasses, style: skeletonSize, "aria-hidden": "true" });
+  return /* @__PURE__ */ jsx("div", { className: skeletonClasses, style: skeletonSize, "aria-hidden": "true", "data-testid": dataTestId });
 };
 export {
   Skeleton

package/dist/components/Skeleton/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/Skeleton/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { CSSProperties } from 'react'\nimport './styles.scss'\n\ntype SkeletonProps = {\n  active?: boolean\n  shape?: 'default' | 'square' | 'circle'\n  color?: 'primary' | 'secondary'\n  block?: boolean\n  width?: number\n  height?: number\n}\n\nexport const Skeleton = ({\n  active = true,\n  shape = 'default',\n  color = 'primary',\n  block = false,\n  height,\n  width,\n}: SkeletonProps) => {\n  const skeletonClasses = classNames('au-skeleton', {\n    'au-skeleton--active': active,\n    'au-skeleton--shape-square': shape === 'square',\n    'au-skeleton--shape-circle': shape === 'circle',\n    'au-skeleton--color-secondary': color === 'secondary',\n  })\n\n  const skeletonSize: CSSProperties = {\n    height: height ? `${height}px` : '28px',\n    width: width ? `${width}px` : block ? '100%' : '80px',\n  }\n\n  return <div className={skeletonClasses} style={skeletonSize} aria-hidden=\"true\"></div>\n}\n"],"names":[],"mappings":";;AAaO,MAAM,WAAW,CAAC;AAAA,EACvB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR;AAAA,EACA;AACF,MAAqB;AACnB,QAAM,kBAAkB,WAAW,eAAe;AAAA,IAChD,uBAAuB;AAAA,IACvB,6BAA6B,UAAU;AAAA,IACvC,6BAA6B,UAAU;AAAA,IACvC,gCAAgC,UAAU;AAAA,EAAA,CAC3C;AAED,QAAM,eAA8B;AAAA,IAClC,QAAQ,SAAS,GAAG,MAAM,OAAO;AAAA,IACjC,OAAO,QAAQ,GAAG,KAAK,OAAO,QAAQ,SAAS;AAAA,EAAA;AAGjD,6BAAQ,OAAA,EAAI,WAAW,iBAAiB,OAAO,cAAc,eAAY,QAAO;AAClF;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/Skeleton/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { CSSProperties } from 'react'\nimport './styles.scss'\n\ntype SkeletonProps = {\n  active?: boolean\n  shape?: 'default' | 'square' | 'circle'\n  color?: 'primary' | 'secondary'\n  block?: boolean\n  width?: number\n  height?: number\n  'data-testid'?: string\n}\n\nexport const Skeleton = ({\n  active = true,\n  shape = 'default',\n  color = 'primary',\n  block = false,\n  height,\n  width,\n  'data-testid': dataTestId,\n}: SkeletonProps) => {\n  const skeletonClasses = classNames('au-skeleton', {\n    'au-skeleton--active': active,\n    'au-skeleton--shape-square': shape === 'square',\n    'au-skeleton--shape-circle': shape === 'circle',\n    'au-skeleton--color-secondary': color === 'secondary',\n  })\n\n  const skeletonSize: CSSProperties = {\n    height: height ? `${height}px` : '28px',\n    width: width ? `${width}px` : block ? '100%' : '80px',\n  }\n\n  return <div className={skeletonClasses} style={skeletonSize} aria-hidden=\"true\" data-testid={dataTestId}></div>\n}\n"],"names":[],"mappings":";;AAcO,MAAM,WAAW,CAAC;AAAA,EACvB,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,eAAe;AACjB,MAAqB;AACnB,QAAM,kBAAkB,WAAW,eAAe;AAAA,IAChD,uBAAuB;AAAA,IACvB,6BAA6B,UAAU;AAAA,IACvC,6BAA6B,UAAU;AAAA,IACvC,gCAAgC,UAAU;AAAA,EAAA,CAC3C;AAED,QAAM,eAA8B;AAAA,IAClC,QAAQ,SAAS,GAAG,MAAM,OAAO;AAAA,IACjC,OAAO,QAAQ,GAAG,KAAK,OAAO,QAAQ,SAAS;AAAA,EAAA;AAGjD,SAAO,oBAAC,SAAI,WAAW,iBAAiB,OAAO,cAAc,eAAY,QAAO,eAAa,WAAA,CAAY;AAC3G;"}

package/dist/components/SpecialButton/SpecialButton.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/SpecialButton/index.d.ts

@@ -0,0 +1,38 @@
+import { ReactNode } from 'react';
+export type SpecialButtonProps = {
+    /**
+     * Interaction mode: 'press' is hold-to-confirm (Figma: Press Button),
+     * 'slider' is swipe-to-confirm (Figma: Swipe Button).
+     * @default 'press'
+     */
+    type?: 'press' | 'slider';
+    children?: ReactNode;
+    /** Called once when the interaction completes (hold finished / knob dragged to the end). */
+    onConfirm?: () => void;
+    disabled?: boolean;
+    loading?: boolean;
+    /**
+     * Controlled success state. The component also enters success on its own
+     * right after a completed interaction.
+     */
+    success?: boolean;
+    /**
+     * Press only — time in milliseconds the user must keep pressing to confirm.
+     * @default 1500
+     */
+    holdDuration?: number;
+    /** Press only — stretches the button to fill the container width. */
+    expand?: 'x';
+    /** Slider only — visual variant (Figma: Swipe Button, ◇ Type Primary | Secondary). */
+    variant?: 'primary' | 'secondary';
+    /** Slider only — renders an empty skeleton placeholder. */
+    skeleton?: boolean;
+    /**
+     * Slider only — accessible label for the draggable knob. Pressing Enter or
+     * Space on the focused knob confirms directly (keyboard alternative to the
+     * swipe gesture).
+     */
+    knobAriaLabel?: string;
+    'data-testid'?: string;
+};
+export declare const SpecialButton: ({ type, ...props }: SpecialButtonProps) => import("react/jsx-runtime").JSX.Element;