@fluidattacks/design 3.1.11 → 3.1.12

package/dist/index-DrfjITyT.mjs

@@ -0,0 +1,61 @@
+import { jsxs as p, jsx as c } from "react/jsx-runtime";
+import { useRef as d } from "react";
+import { useOption as g } from "react-aria";
+import { styled as o } from "styled-components";
+import { Icon as m } from "./components/icon/index.js";
+const w = o.ul`
+  ${({ theme: n }) => `
+    align-self: center;
+    background: ${n.palette.white};
+    border: 1px solid ${n.palette.gray[200]};
+    border-radius: ${n.spacing[0.25]};
+    box-shadow: ${n.shadows.md};
+    list-style: none;
+    max-height: 200px;
+    min-width: 240px;
+    overflow: hidden auto;
+    scrollbar-color: ${n.palette.gray[600]} ${n.palette.gray[100]};
+    scroll-padding: ${n.spacing[0.5]};
+    width: 95%;
+  `}
+`, y = o.li`
+  ${({ theme: n }) => `
+    align-items: center;
+    color: ${n.palette.gray[800]};
+    cursor: pointer;
+    display: flex;
+    font-family: ${n.typography.type.primary};
+    font-size: ${n.typography.text.sm};
+    gap: ${n.spacing[0.5]};
+    justify-content: space-between;
+    line-height: ${n.spacing[1.25]};
+    padding: ${n.spacing[0.25]} ${n.spacing[1]};
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+
+    span {
+      color: ${n.palette.gray[700]};
+    }
+
+    &:hover {
+      background: ${n.palette.gray[100]};
+    }
+
+    &.selected {
+      background: ${n.palette.gray[200]};
+    }
+
+    &.disabled {
+      color: ${n.palette.gray[400]};
+      cursor: not-allowed;
+    }
+  `}
+`, b = ({ item: n, state: a }) => {
+  const e = d(null), { optionProps: s, isSelected: t, isFocused: i, isDisabled: r } = g({ key: n.value }, a, e), l = [t ? "selected" : "", i ? "focused" : "", r ? "disabled" : ""].join(" ");
+  return p(y, { ...s, className: l, ref: e, children: [n.name, t ? c(m, { icon: "check", iconSize: "xxs", iconType: "fa-light" }) : void 0] });
+};
+export {
+  b as O,
+  w as S
+};

package/dist/index.js

@@ -1 +1,206 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./assets/index.css');const e=require("./utils-C2whpEd3.js"),o=require("./styles-C2CoGJl7.js"),r=require("./components/accordion/index.js"),t=require("./components/alert/index.js"),n=require("./components/button/index.js"),s=require("./components/card/card-header/index.js"),i=require("./components/card/card-with-image/index.js"),p=require("./components/card/card-with-input/index.js"),u=require("./components/card/card-with-selector/index.js"),a=require("./components/card/card-with-switch/index.js"),x=require("./components/carousel/index.js"),d=require("./components/checkbox/index.js"),c=require("./index-TKLFHcRp.js"),m=require("./components/code-snippet/index.js"),l=require("./components/colors/index.js"),q=require("./components/confirm-dialog/index.js"),j=require("./components/container/index.js"),g=require("./components/divider/index.js"),C=require("./components/empty-state/index.js"),b=require("./components/file-preview/index.js"),h=require("./components/form/index.js"),S=require("./components/grid-container/index.js"),I=require("./components/group-selector/index.js"),f=require("./components/icon/index.js"),T=require("./components/icon-button/index.js"),B=require("./components/indicator-card/index.js"),v=require("./components/info-sidebar/index.js"),y=require("./components/inputs/fields/combobox/index.js"),L=require("./components/inputs/fields/date/index.js"),P=require("./components/inputs/fields/date-range/index.js"),w=require("./components/inputs/fields/date-time/index.js"),F=require("./components/inputs/fields/editable/index.js"),M=require("./components/inputs/fields/input/index.js"),O=require("./components/inputs/fields/input-file/index.js"),D=require("./components/inputs/fields/input-tags/index.js"),W=require("./components/inputs/fields/number/index.js"),k=require("./components/inputs/fields/number-range/index.js"),N=require("./components/inputs/fields/phone/index.js"),A=require("./components/inputs/fields/text-area/index.js"),H=require("./components/inputs/outline-container/index.js"),R=require("./components/interactive-card/index.js"),E=require("./components/language-selector/index.js"),G=require("./components/link/index.js"),U=require("./components/list-item/index.js"),z=require("./components/little-flag/index.js"),J=require("./components/loading/index.js"),K=require("./components/logo/index.js"),Q=require("./components/logo-carousel/index.js"),V=require("./components/lottie/index.js"),X=require("./components/menu/index.js"),Y=require("./components/message-banner/index.js"),Z=require("./components/modal/index.js"),$=require("./components/notification/index.js"),_=require("./components/notification-sign/index.js"),ee=require("./components/number-input/index.js"),oe=require("./components/oauth-selector/index.js"),re=require("./components/premium-feature/index.js"),te=require("./components/priority-score/index.js"),ne=require("./components/progress/index.js"),se=require("./components/pop-up/index.js"),ie=require("./components/radio-button/index.js"),pe=require("./components/scroll-button/index.js"),ue=require("./components/search/index.js"),ae=require("./components/search-bar/index.js"),xe=require("./components/severity-badge/index.js"),de=require("./components/severity-overview/index.js"),ce=require("./components/show-on-hover/index.js"),me=require("./components/slide-out-menu/index.js"),le=require("./components/slider/index.js"),qe=require("./components/step-lapse/index.js"),je=require("./components/table-button/index.js"),ge=require("./components/tabs/index.js"),Ce=require("./components/tag/index.js"),be=require("./components/timeline/index.js"),he=require("./components/toggle/index.js"),Se=require("./components/toggle-buttons/index.js"),Ie=require("./index-CmylnDrF.js"),fe=require("./components/tour/index.js"),Te=require("./components/typography/heading/index.js"),Be=require("./components/typography/span/index.js"),ve=require("./components/typography/text/index.js"),ye=require("./components/web-form/index.js"),Le=require("./use-carousel-64dKFW4E.js"),Pe=require("./use-click-outside-BqkLISED.js"),we=require("./use-cloudinary-image-YMMafagv.js"),Fe=require("./use-search-DeL4UDMh.js"),Me=require("./use-modal-_bYY6M_n.js"),Oe=require("./styles-BWVdbvFu.js"),De=require("./components/modal/modal-confirm/index.js"),We=require("./components/oauth-selector/option-container/index.js"),ke=require("./components/tabs/fixed-tabs/index.js"),Ne=require("./components/tabs/tab/index.js"),Ae=require("./index-CA_9DXWd.js");exports.variantBuilder=e.variantBuilder,exports.BaseButtonComponent=o.BaseButtonComponent,exports.BaseComponent=o.BaseComponent,exports.BaseSpanComponent=o.BaseSpanComponent,exports.BaseTextComponent=o.BaseTextComponent,exports.getStyledConfig=o.getStyledConfig,exports.hiddenProps=o.hiddenProps,exports.setBorder=o.setBorder,exports.setDisplay=o.setDisplay,exports.setInteraction=o.setInteraction,exports.setMargin=o.setMargin,exports.setPadding=o.setPadding,exports.setPosition=o.setPosition,exports.setText=o.setText,exports.Accordion=r.Accordion,exports.Alert=t.Alert,exports.Button=n.Button,exports.CardHeader=s.CardHeader,exports.CardWithImage=i.CardWithImage,exports.CardWithInput=p.CardWithInput,exports.CardWithSelector=u.CardWithSelector,exports.CardWithSwitch=a.CardWithSwitch,exports.Carousel=x.Carousel,exports.Checkbox=d.Checkbox,exports.CloudImage=c.MemoizedImage,exports.CodeSnippet=m.CodeSnippet,exports.CustomThemeProvider=l.CustomThemeProvider,exports.icons=l.icons,exports.theme=l.theme,exports.uniqueIcons=l.uniqueIcons,exports.useConfirmDialog=q.useConfirmDialog,exports.Container=j.Container,exports.Divider=g.Divider,exports.EmptyState=C.EmptyState,exports.FilePreview=b.FilePreview,exports.Form=h.Form,exports.GridContainer=S.GridContainer,exports.GroupSelector=I.GroupSelector,exports.Icon=f.Icon,exports.IconButton=T.IconButton,exports.IndicatorCard=B.IndicatorCard,exports.InfoSidebar=v.InfoSidebar,exports.ComboBox=y.ComboBox,exports.InputDate=L.InputDate,exports.InputDateRange=P.InputDateRange,exports.InputDateTime=w.InputDateTime,exports.Editable=F.Editable,exports.Input=M.Input,exports.InputFile=O.InputFile,exports.InputTags=D.InputTags,exports.InputNumber=W.InputNumber,exports.InputNumberRange=k.InputNumberRange,exports.PhoneInput=N.PhoneInput,exports.TextArea=A.TextArea,exports.OutlineContainer=H.OutlineContainer,exports.InteractiveCard=R.InteractiveCard,exports.LanguageSelector=E.LanguageSelector,exports.Link=G.Link,exports.ListItem=U.ListItem,exports.LittleFlag=z.LittleFlag,exports.Loading=J.Loading,exports.Logo=K.Logo,exports.LogoCarousel=Q.LogoCarousel,exports.Lottie=V.Lottie,exports.Menu=X.Menu,exports.MessageBanner=Y.MessageBanner,exports.Modal=Z.Modal,exports.Notification=$.Notification,exports.NotificationSign=_.NotificationSign,exports.NumberInput=ee.NumberInput,exports.OAuthSelector=oe.OAuthSelector,exports.PremiumFeature=re.PremiumFeature,exports.PriorityScore=te.PriorityScore,exports.Progress=ne.Progress,exports.PopUp=se.PopUp,exports.RadioButton=ie.RadioButton,exports.ScrollUpButton=pe.ScrollUpButton,exports.Search=ue.Search,exports.SearchBar=ae.SearchBar,exports.SeverityBadge=xe.SeverityBadge,exports.SeverityOverview=de.SeverityOverview,exports.ShowOnHover=ce.ShowOnHover,exports.SlideOutMenu=me.SlideOutMenu,exports.Slider=le.Slider,exports.StepLapse=qe.StepLapse,exports.TableButton=je.TableButton,exports.Tabs=ge.Tabs,exports.Tag=Ce.Tag,exports.TimeLine=be.TimeLine,exports.Toggle=he.Toggle,exports.ToggleButton=Se.ToggleButton,exports.Tooltip=Ie.Tooltip,exports.Tour=fe.Tour,exports.baseStep=fe.baseStep,exports.Heading=Te.Heading,exports.Span=Be.Span,exports.Text=ve.Text,exports.FormItem=ye.FormItem,exports.WebForm=ye.WebForm,exports.useCarousel=Le.useCarousel,exports.useClickOutside=Pe.useClickOutside,exports.useCloudinaryImage=we.useCloudinaryImage,exports.useDebouncedCallback=Fe.useDebouncedCallback,exports.useSearch=Fe.useSearch,exports.useModal=Me.useModal,exports.ListItemsWrapper=Oe.ListItemsWrapper,exports.ModalConfirm=De.ModalConfirm,exports.OptionContainer=We.OptionContainer,exports.FixedTabs=ke.FixedTabs,exports.Tab=Ne.Tab,exports.TimeLineCard=Ae.TimeLineCard;
+import { v as e } from "./utils-CQvBF-wY.mjs";
+import { a as p, B as m, c as a, b as f, k as x, h as n, j as i, i as s, f as u, e as d, s as l, g as C, d as g } from "./styles-C3cZmKVJ.mjs";
+import { Accordion as I } from "./components/accordion/index.js";
+import { Alert as T } from "./components/alert/index.js";
+import { Button as b } from "./components/button/index.js";
+import { CardHeader as L } from "./components/card/card-header/index.js";
+import { CardWithImage as P } from "./components/card/card-with-image/index.js";
+import { CardWithInput as M } from "./components/card/card-with-input/index.js";
+import { CardWithSelector as D } from "./components/card/card-with-selector/index.js";
+import { CardWithSwitch as W } from "./components/card/card-with-switch/index.js";
+import { Carousel as N } from "./components/carousel/index.js";
+import { Checkbox as A } from "./components/checkbox/index.js";
+import { M as R } from "./index-BwFnfaRh.mjs";
+import { CodeSnippet as G } from "./components/code-snippet/index.js";
+import { CustomThemeProvider as j, icons as q, theme as z, uniqueIcons as J } from "./components/colors/index.js";
+import { useConfirmDialog as Q } from "./components/confirm-dialog/index.js";
+import { Container as X } from "./components/container/index.js";
+import { Divider as Z } from "./components/divider/index.js";
+import { EmptyState as $ } from "./components/empty-state/index.js";
+import { FilePreview as ro } from "./components/file-preview/index.js";
+import { Form as to } from "./components/form/index.js";
+import { GridContainer as mo } from "./components/grid-container/index.js";
+import { GroupSelector as fo } from "./components/group-selector/index.js";
+import { Icon as no } from "./components/icon/index.js";
+import { IconButton as so } from "./components/icon-button/index.js";
+import { IndicatorCard as lo } from "./components/indicator-card/index.js";
+import { InfoSidebar as go } from "./components/info-sidebar/index.js";
+import { ComboBox as Io } from "./components/inputs/fields/combobox/index.js";
+import { InputDate as To } from "./components/inputs/fields/date/index.js";
+import { InputDateRange as bo } from "./components/inputs/fields/date-range/index.js";
+import { InputDateTime as Lo } from "./components/inputs/fields/date-time/index.js";
+import { Editable as Po } from "./components/inputs/fields/editable/index.js";
+import { Input as Mo } from "./components/inputs/fields/input/index.js";
+import { InputFile as Do } from "./components/inputs/fields/input-file/index.js";
+import { InputTags as Wo } from "./components/inputs/fields/input-tags/index.js";
+import { InputNumber as No } from "./components/inputs/fields/number/index.js";
+import { InputNumberRange as Ao } from "./components/inputs/fields/number-range/index.js";
+import { PhoneInput as Ro } from "./components/inputs/fields/phone/index.js";
+import { TextArea as Go } from "./components/inputs/fields/text-area/index.js";
+import { OutlineContainer as jo } from "./components/inputs/outline-container/index.js";
+import { InteractiveCard as zo } from "./components/interactive-card/index.js";
+import { LanguageSelector as Ko } from "./components/language-selector/index.js";
+import { Link as Vo } from "./components/link/index.js";
+import { ListItem as Yo } from "./components/list-item/index.js";
+import { LittleFlag as _o } from "./components/little-flag/index.js";
+import { Loading as or } from "./components/loading/index.js";
+import { Logo as er } from "./components/logo/index.js";
+import { LogoCarousel as pr } from "./components/logo-carousel/index.js";
+import { Lottie as ar } from "./components/lottie/index.js";
+import { Menu as xr } from "./components/menu/index.js";
+import { MessageBanner as ir } from "./components/message-banner/index.js";
+import { Modal as ur } from "./components/modal/index.js";
+import { Notification as lr } from "./components/notification/index.js";
+import { NotificationSign as gr } from "./components/notification-sign/index.js";
+import { NumberInput as Ir } from "./components/number-input/index.js";
+import { OAuthSelector as Tr } from "./components/oauth-selector/index.js";
+import { PremiumFeature as br } from "./components/premium-feature/index.js";
+import { PriorityScore as Lr } from "./components/priority-score/index.js";
+import { Progress as Pr } from "./components/progress/index.js";
+import { PopUp as Mr } from "./components/pop-up/index.js";
+import { RadioButton as Dr } from "./components/radio-button/index.js";
+import { ScrollUpButton as Wr } from "./components/scroll-button/index.js";
+import { Search as Nr } from "./components/search/index.js";
+import { SearchBar as Ar } from "./components/search-bar/index.js";
+import { SeverityBadge as Rr } from "./components/severity-badge/index.js";
+import { SeverityOverview as Gr } from "./components/severity-overview/index.js";
+import { ShowOnHover as jr } from "./components/show-on-hover/index.js";
+import { SlideOutMenu as zr } from "./components/slide-out-menu/index.js";
+import { Slider as Kr } from "./components/slider/index.js";
+import { StepLapse as Vr } from "./components/step-lapse/index.js";
+import { TableButton as Yr } from "./components/table-button/index.js";
+import { Tabs as _r } from "./components/tabs/index.js";
+import { Tag as oe } from "./components/tag/index.js";
+import { TimeLine as ee } from "./components/timeline/index.js";
+import { Toggle as pe } from "./components/toggle/index.js";
+import { ToggleButton as ae } from "./components/toggle-buttons/index.js";
+import { T as xe } from "./index-D-lcuEHY.mjs";
+import { Tour as ie, baseStep as se } from "./components/tour/index.js";
+import { Heading as de } from "./components/typography/heading/index.js";
+import { Span as Ce } from "./components/typography/span/index.js";
+import { Text as ce } from "./components/typography/text/index.js";
+import { FormItem as Se, WebForm as Te } from "./components/web-form/index.js";
+import { u as be } from "./use-carousel-CvRxi2FI.mjs";
+import { u as Le } from "./use-click-outside-BtZLIoU1.mjs";
+import { u as Pe } from "./use-cloudinary-image-fG7ODNgr.mjs";
+import { u as Me, a as ye } from "./use-search-DpLNvt7Q.mjs";
+import { u as Oe } from "./use-modal-CkrZ-_-M.mjs";
+import { a as ke } from "./styles-Q1VXuWI7.mjs";
+import { ModalConfirm as we } from "./components/modal/modal-confirm/index.js";
+import { OptionContainer as He } from "./components/oauth-selector/option-container/index.js";
+import { FixedTabs as Ee } from "./components/tabs/fixed-tabs/index.js";
+import { Tab as Ue } from "./components/tabs/tab/index.js";
+import { a as qe } from "./index-Bu448Tz2.mjs";
+import './assets/index.css';export {
+  I as Accordion,
+  T as Alert,
+  p as BaseButtonComponent,
+  m as BaseComponent,
+  a as BaseSpanComponent,
+  f as BaseTextComponent,
+  b as Button,
+  L as CardHeader,
+  P as CardWithImage,
+  M as CardWithInput,
+  D as CardWithSelector,
+  W as CardWithSwitch,
+  N as Carousel,
+  A as Checkbox,
+  R as CloudImage,
+  G as CodeSnippet,
+  Io as ComboBox,
+  X as Container,
+  j as CustomThemeProvider,
+  Z as Divider,
+  Po as Editable,
+  $ as EmptyState,
+  ro as FilePreview,
+  Ee as FixedTabs,
+  to as Form,
+  Se as FormItem,
+  mo as GridContainer,
+  fo as GroupSelector,
+  de as Heading,
+  no as Icon,
+  so as IconButton,
+  lo as IndicatorCard,
+  go as InfoSidebar,
+  Mo as Input,
+  To as InputDate,
+  bo as InputDateRange,
+  Lo as InputDateTime,
+  Do as InputFile,
+  No as InputNumber,
+  Ao as InputNumberRange,
+  Wo as InputTags,
+  zo as InteractiveCard,
+  Ko as LanguageSelector,
+  Vo as Link,
+  Yo as ListItem,
+  ke as ListItemsWrapper,
+  _o as LittleFlag,
+  or as Loading,
+  er as Logo,
+  pr as LogoCarousel,
+  ar as Lottie,
+  xr as Menu,
+  ir as MessageBanner,
+  ur as Modal,
+  we as ModalConfirm,
+  lr as Notification,
+  gr as NotificationSign,
+  Ir as NumberInput,
+  Tr as OAuthSelector,
+  He as OptionContainer,
+  jo as OutlineContainer,
+  Ro as PhoneInput,
+  Mr as PopUp,
+  br as PremiumFeature,
+  Lr as PriorityScore,
+  Pr as Progress,
+  Dr as RadioButton,
+  Wr as ScrollUpButton,
+  Nr as Search,
+  Ar as SearchBar,
+  Rr as SeverityBadge,
+  Gr as SeverityOverview,
+  jr as ShowOnHover,
+  zr as SlideOutMenu,
+  Kr as Slider,
+  Ce as Span,
+  Vr as StepLapse,
+  Ue as Tab,
+  Yr as TableButton,
+  _r as Tabs,
+  oe as Tag,
+  ce as Text,
+  Go as TextArea,
+  ee as TimeLine,
+  qe as TimeLineCard,
+  pe as Toggle,
+  ae as ToggleButton,
+  xe as Tooltip,
+  ie as Tour,
+  Te as WebForm,
+  se as baseStep,
+  x as getStyledConfig,
+  n as hiddenProps,
+  q as icons,
+  i as setBorder,
+  s as setDisplay,
+  u as setInteraction,
+  d as setMargin,
+  l as setPadding,
+  C as setPosition,
+  g as setText,
+  z as theme,
+  J as uniqueIcons,
+  be as useCarousel,
+  Le as useClickOutside,
+  Pe as useCloudinaryImage,
+  Q as useConfirmDialog,
+  Me as useDebouncedCallback,
+  Oe as useModal,
+  ye as useSearch,
+  e as variantBuilder
+};

package/dist/styles-7_q7nHce.mjs

@@ -0,0 +1,110 @@
+import { styled as n, css as o } from "styled-components";
+import { a as s } from "./styles-C3cZmKVJ.mjs";
+import "react/jsx-runtime";
+const c = n(s)`
+  align-items: center;
+  background-color: inherit;
+  border-color: inherit;
+  display: flex;
+  height: 38px;
+  justify-content: center;
+  width: 40px;
+  margin: ${({ $margin: e = "0" }) => o`
+    ${e}
+  `};
+
+  &:hover:not(:disabled) {
+    background-color: ${({ theme: e }) => e.palette.gray[100]};
+    cursor: pointer;
+  }
+`, g = n.div`
+  ${({ theme: e }) => `
+    align-items: flex-start;
+    background: ${e.palette.white};
+    border: 1px solid ${e.palette.gray[200]};
+    border-radius: ${e.spacing[0.5]};
+    box-shadow: ${e.shadows.md};
+    display: inline-flex;
+    flex-direction: column;
+    gap: ${e.spacing[0.25]};
+    height: auto;
+    padding: ${e.spacing[0.25]};
+    width: 292px;
+  `}
+`, h = n.button`
+  ${({ theme: e, $disabled: a, $focus: i, $header: t }) => {
+  const r = i ? "34px" : "40px";
+  return `
+      align-items: center;
+      border-radius: ${t ? `0 ${e.spacing[0.5]} ${e.spacing[0.5]} 0` : "4px"};
+      border-left: inherit;
+      display: flex;
+      height: ${t ? "38px" : r};
+      justify-content: center;
+      outline: none;
+      width: ${t ? "38px" : "40px"};
+
+      &:hover {
+        background-color: ${e.palette.gray[a ? 500 : 100]};
+      }
+    `;
+}}
+`, $ = n.div`
+  ${({ theme: e }) => `
+    align-items: center;
+    background: transparent;
+    border-radius: ${e.spacing[0.5]} 0 0 ${e.spacing[0.5]};
+    border-color: inherit;
+    display: flex;
+    height: 100%;
+    justify-content: space-between;
+    width: calc(100% - 40px);
+  `}
+`, x = n.div`
+  align-items: center;
+  display: flex;
+  justify-content: flex-end;
+  gap: ${({ theme: e }) => e.spacing[0.5]};
+  flex: 1 0 0;
+`, u = n.div`
+  ${({ theme: e }) => `
+    align-items: center;
+    align-self: stretch;
+    background-color: ${e.palette.gray[200]};
+    border-radius: ${e.spacing[0.25]};
+    display: flex;
+    font-family: ${e.typography.type.primary};
+    gap: ${e.spacing[0.25]};
+    line-height: ${e.spacing[1.5]};
+    padding: 2px ${e.spacing[0.25]};
+  `}
+`, y = n.button`
+  ${({ theme: e }) => `
+    align-items: center;
+    background-color: inherit;
+    border: 0.5px solid ${e.palette.gray[200]};
+    border-radius: 7px;
+    color: ${e.palette.gray[800]};
+    cursor: pointer;
+    display: flex;
+    font-weight: ${e.typography.weight.regular};
+    justify-content: center;
+    gap: 10px;
+    padding: 2px 10px;
+
+    &#active {
+      background-color: ${e.palette.white};
+      box-shadow: ${e.shadows.md};
+      font-weight: ${e.typography.weight.bold};
+    }
+  `}
+`;
+export {
+  h as C,
+  g as D,
+  $ as I,
+  c as S,
+  x as T,
+  u as a,
+  y as b
+};

package/dist/styles-BA0WIQL-.mjs

@@ -0,0 +1,74 @@
+import { NavLink as e } from "react-router-dom";
+import { styled as n } from "styled-components";
+const r = n.button`
+  ${({ theme: t }) => `
+    align-items: center;
+    color: ${t.palette.gray[500]};
+    display: flex;
+    gap: ${t.spacing[0.625]};
+    justify-content: center;
+    padding: ${t.spacing[0.75]};
+    text-align: center;
+    width: 151px;
+
+    &.active {
+      color: ${t.palette.gray[800]};
+      border-bottom: 3px solid ${t.palette.primary[400]};
+    }
+
+    &:hover {
+      color: ${t.palette.gray[800]};
+    }
+  `}
+`, p = n.div`
+  ${({ theme: t }) => `
+    align-items: center;
+    border-bottom: 2px solid ${t.palette.gray[200]};
+    display: flex;
+    gap: ${t.spacing[3]};
+    height: ${t.spacing[3]};
+    width: max-content;
+  `}
+`, i = n(e)`
+  ${({ theme: t }) => `
+    align-items: center;
+    background: transparent;
+    cursor: pointer;
+    color: ${t.palette.gray[800]};
+    font-family: ${t.typography.type.primary};
+    font-size: ${t.typography.text.sm};
+    display: flex;
+    font-weight: ${t.typography.weight.regular};
+    padding: ${t.spacing[0.625]} ${t.spacing[0.5]};
+    position: relative;
+    text-align: center;
+    text-decoration: unset;
+
+    &:disabled {
+      cursor: not-allowed;
+      background-color: ${t.palette.gray[300]};
+      color: ${t.palette.gray[300]};
+    }
+
+    &:hover:not([disabled]) {
+      background-color: ${t.palette.gray[100]};
+      color: ${t.palette.gray[800]};
+    }
+
+    &.active {
+      background-color: transparent;
+      border-bottom: solid 4px ${t.palette.primary[500]};
+      padding-bottom: calc(${t.spacing[0.625]} - 4px);
+
+      &:hover {
+        background-color: transparent;
+        border-bottom: solid 4px ${t.palette.primary[500]};
+      }
+    }
+  `}
+`;
+export {
+  p as S,
+  i as T,
+  r as a
+};

package/dist/styles-C3cZmKVJ.mjs

@@ -0,0 +1,131 @@
+import { styled as g } from "styled-components";
+import { theme as r } from "./components/colors/index.js";
+const C = ["padding", "px", "py", "pl", "pr", "pt", "pb", "margin", "mx", "my", "ml", "mr", "mt", "mb", "zIndex", "position", "top", "right", "bottom", "left", "border", "borderTop", "borderRight", "borderBottom", "borderLeft", "borderColor", "borderRadius", "scroll", "visibility", "display", "height", "width", "maxHeight", "maxWidth", "minHeight", "minWidth", "shadow", "bgColor", "bgGradient", "gap", "flexDirection", "flexGrow", "justify", "justifySelf", "alignItems", "alignSelf", "wrap", "color", "fontFamily", "fontSize", "fontWeight", "textAlign", "whiteSpace", "letterSpacing", "lineSpacing", "textDecoration", "textOverflow", "whiteSpace", "wordBreak", "wordWrap", "cursor", "transition", "borderColorHover", "bgColorHover", "shadowHover"], n = (i, t) => t === void 0 ? "" : `${i}: ${t};`, p = (i) => {
+  const t = i.py ?? i.pt ?? 0, e = i.px ?? i.pr ?? 0, a = i.py ?? i.pb ?? 0, o = i.px ?? i.pl ?? 0;
+  if (i.padding) {
+    const [$, s, d, l] = i.padding;
+    return `padding: ${r.spacing[$]} ${r.spacing[s]} ${r.spacing[d]} ${r.spacing[l]};`;
+  }
+  return `padding: ${r.spacing[t]} ${r.spacing[e]} ${r.spacing[a]} ${r.spacing[o]};`;
+}, c = (i) => {
+  const t = i.my ?? i.mt ?? 0, e = i.mx ?? i.mr ?? 0, a = i.my ?? i.mb ?? 0, o = i.mx ?? i.ml ?? 0;
+  if (i.margin) {
+    const [$, s, d, l] = i.margin;
+    return `margin: ${r.spacing[$]} ${r.spacing[s]} ${r.spacing[d]} ${r.spacing[l]};`;
+  }
+  return `margin: ${r.spacing[t]} ${r.spacing[e]} ${r.spacing[a]} ${r.spacing[o]};`;
+}, h = (i) => `
+    ${n("position", i.position)}
+    ${n("top", i.top)}
+    ${n("right", i.right)}
+    ${n("bottom", i.bottom)}
+    ${n("left", i.left)}
+    ${n("z-index", i.zIndex)}
+  `, b = (i) => `
+    ${n("border", i.border)}
+    ${n("border-top", i.borderTop)}
+    ${n("border-right", i.borderRight)}
+    ${n("border-bottom", i.borderBottom)}
+    ${n("border-left", i.borderLeft)}
+    ${n("border-color", i.borderColor)}
+    ${n("border-radius", i.borderRadius)}
+  `, f = (i) => {
+  const t = i.scroll ? `
+      ${((u) => u.includes("x") ? "overflow-x: auto;" : "")(i.scroll)}
+      ${((u) => u.includes("y") ? "overflow-y: auto;" : "")(i.scroll)}
+    ` : "", e = n("visibility", i.visibility), a = n("display", i.display), o = n("height", i.height), $ = n("width", i.width), s = n("max-height", i.maxHeight), d = n("max-width", i.maxWidth), l = n("min-height", i.minHeight), y = n("min-width", i.minWidth), v = n("box-shadow", i.shadow ? r.shadows[i.shadow] : void 0), S = n("gap", i.gap === void 0 ? void 0 : r.spacing[i.gap]);
+  return `
+    ${t}
+    ${e}
+    ${a}
+    ${o}
+    ${$}
+    ${s}
+    ${d}
+    ${l}
+    ${y}
+    ${v}
+    ${n("background-color", i.bgColor)}
+    ${n("background", i.bgGradient)}
+    ${S}
+    ${n("flex-direction", i.flexDirection)}
+    ${n("flex-grow", i.flexGrow)}
+    ${n("justify-content", i.justify)}
+    ${n("justify-self", i.justifySelf)}
+    ${n("align-items", i.alignItems)}
+    ${n("align-self", i.alignSelf)}
+    ${n("flex-wrap", i.wrap)}
+  `;
+}, m = (i) => `
+    ${n("color", i.color)}
+    ${n("font-family", i.fontFamily)}
+    ${n("font-size", i.fontSize)}
+    ${n("font-weight", i.fontWeight)}
+    ${n("line-spacing", i.letterSpacing)}
+    ${n("line-height", i.lineSpacing)}
+    ${n("text-align", i.textAlign)}
+    ${n("text-decoration", i.textDecoration)}
+    ${n("text-overflow", i.textOverflow)}
+    ${n("white-space", i.whiteSpace)}
+    ${n("word-break", i.wordBreak)}
+    ${n("word-wrap", i.wordWrap)}
+  `, w = (i) => {
+  const t = n("cursor", i.cursor), e = n("border-color", i.borderColorHover), a = n("background-color", i.bgColorHover), o = n("box-shadow", i.shadowHover === void 0 ? void 0 : r.shadows[i.shadowHover]);
+  return `
+    ${t}
+
+    &:hover {
+      ${n("transition", i.transition) || "transition: all 0.2s;"}
+      ${e}
+      ${a}
+      ${o}
+    }
+  `;
+}, x = () => ({ shouldForwardProp: (i) => !C.includes(i) }), j = g.div.withConfig(x())`
+  ${p}
+  ${c}
+  ${h}
+  ${f}
+  ${m}
+  ${b}
+  ${w}
+`, k = g.button.withConfig(x())`
+  ${p}
+  ${c}
+  ${h}
+  ${f}
+  ${m}
+  ${b}
+  ${w}
+`, z = g.p.withConfig(x())`
+  ${p}
+  ${c}
+  ${h}
+  ${f}
+  ${m}
+  ${b}
+  ${w}
+`, B = g.span.withConfig(x())`
+  ${p}
+  ${c}
+  ${h}
+  ${f}
+  ${m}
+  ${b}
+  ${w}
+`;
+export {
+  j as B,
+  k as a,
+  z as b,
+  B as c,
+  m as d,
+  c as e,
+  w as f,
+  h as g,
+  C as h,
+  f as i,
+  b as j,
+  x as k,
+  p as s
+};