@ttoss/ui 1.32.3 → 1.32.4

package/dist/esm/index.js

@@ -212,7 +212,21 @@ var Label = ({
 };
 
 // src/components/Link.tsx
-import { Link } from "theme-ui";
+import { Link as LinkUi } from "theme-ui";
+import React5 from "react";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var Link = /*#__PURE__*/React5.forwardRef(({
+  quiet,
+  className,
+  ...props
+}, ref) => {
+  return /* @__PURE__ */jsx7(LinkUi, {
+    className: `${quiet ? "quiet" : ""} ${className ?? ""}`,
+    ...props,
+    ref
+  });
+});
+Link.displayName = "Link";
 
 // src/components/LinearProgress.tsx
 import { Progress } from "theme-ui";
@@ -222,15 +236,15 @@ import { Text } from "theme-ui";
 
 // src/components/Select.tsx
 import { Select as SelectUi } from "theme-ui";
-import React5 from "react";
-import { Fragment as Fragment2, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
-var Select = /*#__PURE__*/React5.forwardRef(({
+import React6 from "react";
+import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+var Select = /*#__PURE__*/React6.forwardRef(({
   arrow,
   ...props
 }, ref) => {
-  return /* @__PURE__ */jsx7(SelectUi, {
+  return /* @__PURE__ */jsx8(SelectUi, {
     arrow: /* @__PURE__ */jsxs6(Fragment2, {
-      children: [arrow ?? /* @__PURE__ */jsx7(Text, {
+      children: [arrow ?? /* @__PURE__ */jsx8(Text, {
         sx: {
           marginLeft: ({
             space
@@ -241,10 +255,10 @@ var Select = /*#__PURE__*/React5.forwardRef(({
           pointerEvents: "none",
           lineHeight: 0
         },
-        children: /* @__PURE__ */jsx7(Icon, {
+        children: /* @__PURE__ */jsx8(Icon, {
           icon: "picker-down"
         })
-      }), props["aria-invalid"] === "true" && /* @__PURE__ */jsx7(Text, {
+      }), props["aria-invalid"] === "true" && /* @__PURE__ */jsx8(Text, {
         className: "error-icon",
         sx: {
           marginLeft: ({
@@ -256,7 +270,7 @@ var Select = /*#__PURE__*/React5.forwardRef(({
           pointerEvents: "none",
           lineHeight: 0
         },
-        children: /* @__PURE__ */jsx7(Icon, {
+        children: /* @__PURE__ */jsx8(Icon, {
           icon: "error"
         })
       })]
@@ -274,11 +288,11 @@ import { Spinner } from "theme-ui";
 import { Radio } from "theme-ui";
 
 // src/components/IconButton.tsx
-import * as React6 from "react";
+import * as React7 from "react";
 import { IconButton as IconButtonUi } from "theme-ui";
-import { jsx as jsx8 } from "react/jsx-runtime";
-var IconButton = /*#__PURE__*/React6.forwardRef((props, ref) => {
-  return /* @__PURE__ */jsx8(IconButtonUi, {
+import { jsx as jsx9 } from "react/jsx-runtime";
+var IconButton = /*#__PURE__*/React7.forwardRef((props, ref) => {
+  return /* @__PURE__ */jsx9(IconButtonUi, {
     type: "button",
     ...props,
     ref
@@ -293,12 +307,12 @@ import { Slider } from "theme-ui";
 import { Checkbox } from "theme-ui";
 
 // src/components/InfiniteLinearProgress.tsx
-import * as React7 from "react";
-import { jsx as jsx9 } from "react/jsx-runtime";
+import * as React8 from "react";
+import { jsx as jsx10 } from "react/jsx-runtime";
 var MAX_PROGRESS = 100;
 var InfiniteLinearProgress = () => {
-  const [progress, setProgress] = React7.useState(0);
-  React7.useEffect(() => {
+  const [progress, setProgress] = React8.useState(0);
+  React8.useEffect(() => {
     const timer = setInterval(() => {
       setProgress(oldProgress => {
         if (oldProgress === MAX_PROGRESS) {
@@ -319,7 +333,7 @@ var InfiniteLinearProgress = () => {
       clearInterval(timer);
     };
   }, []);
-  return /* @__PURE__ */jsx9(Progress, {
+  return /* @__PURE__ */jsx10(Progress, {
     max: MAX_PROGRESS,
     value: progress,
     role: "progressbar"
@@ -328,9 +342,9 @@ var InfiniteLinearProgress = () => {
 
 // src/components/Textarea.tsx
 import { Textarea as TextareaUI } from "theme-ui";
-import React8 from "react";
-import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
-var Textarea = /*#__PURE__*/React8.forwardRef(({
+import React9 from "react";
+import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
+var Textarea = /*#__PURE__*/React9.forwardRef(({
   trailingIcon,
   className,
   sx,
@@ -344,7 +358,7 @@ var Textarea = /*#__PURE__*/React8.forwardRef(({
       padding: 0,
       border: "none"
     },
-    children: [/* @__PURE__ */jsx10(TextareaUI, {
+    children: [/* @__PURE__ */jsx11(TextareaUI, {
       ref,
       sx: {
         ...sx,
@@ -353,13 +367,13 @@ var Textarea = /*#__PURE__*/React8.forwardRef(({
       },
       className,
       ...textareaProps
-    }), trailingIcon && /* @__PURE__ */jsx10(Text, {
+    }), trailingIcon && /* @__PURE__ */jsx11(Text, {
       sx: {
         position: "absolute",
         right: "1.25rem",
         top: "0.75rem"
       },
-      children: /* @__PURE__ */jsx10(Icon, {
+      children: /* @__PURE__ */jsx11(Icon, {
         inline: true,
         icon: trailingIcon
       })
@@ -372,14 +386,14 @@ Textarea.displayName = "Textarea";
 import { Container } from "theme-ui";
 
 // src/components/HelpText.tsx
-import { jsx as jsx11 } from "react/jsx-runtime";
+import { jsx as jsx12 } from "react/jsx-runtime";
 var HelpText = ({
   disabled,
   negative,
   ...props
 }) => {
   const variant = ["text.help", negative ? "negative" : void 0].filter(Boolean).join(".");
-  return /* @__PURE__ */jsx11(Text, {
+  return /* @__PURE__ */jsx12(Text, {
     variant,
     "aria-disabled": disabled ? "true" : void 0,
     ...props
@@ -388,9 +402,9 @@ var HelpText = ({
 
 // src/components/CloseButton.tsx
 import { Button as Button2 } from "theme-ui";
-import React9 from "react";
-import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
-var CloseButton = /*#__PURE__*/React9.forwardRef(({
+import React10 from "react";
+import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+var CloseButton = /*#__PURE__*/React10.forwardRef(({
   label,
   sx,
   ...props
@@ -406,7 +420,7 @@ var CloseButton = /*#__PURE__*/React9.forwardRef(({
     },
     ...props,
     ref,
-    children: [label, /* @__PURE__ */jsx12(Icon, {
+    children: [label, /* @__PURE__ */jsx13(Icon, {
       icon: "close"
     })]
   });
@@ -415,9 +429,9 @@ CloseButton.displayName = "CloseButton";
 
 // src/components/InputNumber.tsx
 import { Input as Input2 } from "theme-ui";
-import React10 from "react";
-import { jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
-var InputNumber = /*#__PURE__*/React10.forwardRef(({
+import React11 from "react";
+import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+var InputNumber = /*#__PURE__*/React11.forwardRef(({
   sx,
   value,
   infoIcon,
@@ -425,7 +439,7 @@ var InputNumber = /*#__PURE__*/React10.forwardRef(({
   onClickInfoIcon,
   ...inputProps
 }, ref) => {
-  const sxProps = React10.useMemo(() => {
+  const sxProps = React11.useMemo(() => {
     const size = String(typeof value === "undefined" ? 0 : value).length;
     if (inputProps["aria-invalid"] === "true") {
       return {
@@ -484,7 +498,7 @@ var InputNumber = /*#__PURE__*/React10.forwardRef(({
     },
     ref,
     "aria-invalid": inputProps["aria-invalid"],
-    children: [/* @__PURE__ */jsx13(Input2, {
+    children: [/* @__PURE__ */jsx14(Input2, {
       ref,
       variant: "forms.inputNumber",
       sx: sxProps,
@@ -494,7 +508,7 @@ var InputNumber = /*#__PURE__*/React10.forwardRef(({
       },
       value,
       ...inputProps
-    }), /* @__PURE__ */jsx13(Text, {
+    }), /* @__PURE__ */jsx14(Text, {
       sx: {
         position: "absolute",
         alignSelf: "center",
@@ -503,10 +517,10 @@ var InputNumber = /*#__PURE__*/React10.forwardRef(({
         cursor: "pointer"
       },
       onClick: handleChangeUp,
-      children: /* @__PURE__ */jsx13(Icon, {
+      children: /* @__PURE__ */jsx14(Icon, {
         icon: "picker-down"
       })
-    }), infoIcon && /* @__PURE__ */jsx13(Text, {
+    }), infoIcon && /* @__PURE__ */jsx14(Text, {
       sx: {
         position: "absolute",
         alignSelf: "center",
@@ -515,10 +529,10 @@ var InputNumber = /*#__PURE__*/React10.forwardRef(({
         cursor: onClickInfoIcon ? "pointer" : "default"
       },
       onClick: onClickInfoIcon,
-      children: /* @__PURE__ */jsx13(Icon, {
+      children: /* @__PURE__ */jsx14(Icon, {
         icon: "info"
       })
-    }), /* @__PURE__ */jsx13(Text, {
+    }), /* @__PURE__ */jsx14(Text, {
       sx: {
         position: "absolute",
         alignSelf: "center",
@@ -527,7 +541,7 @@ var InputNumber = /*#__PURE__*/React10.forwardRef(({
         cursor: "pointer"
       },
       onClick: handleChangeDown,
-      children: /* @__PURE__ */jsx13(Icon, {
+      children: /* @__PURE__ */jsx14(Icon, {
         icon: "picker-up"
       })
     })]
@@ -536,10 +550,10 @@ var InputNumber = /*#__PURE__*/React10.forwardRef(({
 InputNumber.displayName = "InputNumber";
 
 // src/components/Stack.tsx
-import * as React11 from "react";
-import { jsx as jsx14 } from "react/jsx-runtime";
-var Stack = /*#__PURE__*/React11.forwardRef((props, ref) => {
-  return /* @__PURE__ */jsx14(Flex, {
+import * as React12 from "react";
+import { jsx as jsx15 } from "react/jsx-runtime";
+var Stack = /*#__PURE__*/React12.forwardRef((props, ref) => {
+  return /* @__PURE__ */jsx15(Flex, {
     ref,
     ...props,
     sx: {

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as theme_ui from 'theme-ui';
-import { Theme, BadgeProps as BadgeProps$1, ButtonProps as ButtonProps$1, InputProps as InputProps$1, LabelProps as LabelProps$1, SelectProps, IconButtonProps, TextareaProps as TextareaProps$1, TextProps, FlexProps } from 'theme-ui';
-export { BaseStyles, Box, BoxProps, Card, CardProps, Checkbox, CheckboxProps, Container, ContainerProps, Divider, DividerProps, Flex, FlexProps, Grid, GridProps, Heading, HeadingProps, IconButtonProps, Image, ImageProps, Progress as LinearProgress, ProgressProps as LinearProgressProps, Link, LinkProps, Radio, RadioProps, SelectProps, Slider, SliderProps, Spinner, SpinnerProps, Text, TextProps, Theme } from 'theme-ui';
+import { Theme, BadgeProps as BadgeProps$1, ButtonProps as ButtonProps$1, InputProps as InputProps$1, LabelProps as LabelProps$1, LinkProps as LinkProps$1, SelectProps, IconButtonProps, TextareaProps as TextareaProps$1, TextProps, FlexProps } from 'theme-ui';
+export { BaseStyles, Box, BoxProps, Card, CardProps, Checkbox, CheckboxProps, Container, ContainerProps, Divider, DividerProps, Flex, FlexProps, Grid, GridProps, Heading, HeadingProps, IconButtonProps, Image, ImageProps, Progress as LinearProgress, ProgressProps as LinearProgressProps, Radio, RadioProps, SelectProps, Slider, SliderProps, Spinner, SpinnerProps, Text, TextProps, Theme } from 'theme-ui';
 export { useBreakpointIndex, useResponsiveValue } from '@theme-ui/match-media';
 import * as React from 'react';
 import React__default from 'react';
@@ -46,6 +46,11 @@ type LabelProps = LabelProps$1 & {
 };
 declare const Label: ({ children, onTooltipClick, tooltip, ...props }: LabelProps) => JSX.Element;
 
+type LinkProps = LinkProps$1 & {
+    quiet?: boolean;
+};
+declare const Link: React__default.ForwardRefExoticComponent<Omit<LinkProps, "ref"> & React__default.RefAttributes<HTMLAnchorElement>>;
+
 declare const Select: React__default.ForwardRefExoticComponent<Omit<SelectProps, "ref"> & React__default.RefAttributes<HTMLSelectElement>>;
 
 declare const IconButton: React.ForwardRefExoticComponent<Omit<IconButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
@@ -82,4 +87,4 @@ type StackProps = FlexProps;
  */
 declare const Stack: React.ForwardRefExoticComponent<theme_ui.BoxProps & React.RefAttributes<HTMLElement>>;
 
-export { Badge, BadgeProps, Button, ButtonProps, CloseButton, CloseButtonProps, HelpText, HelpTextProps, Icon, IconButton, IconProps, IconType, InfiniteLinearProgress, Input, InputNumber, InputNumberProps, InputProps, Label, LabelProps, Select, Stack, StackProps, Textarea, TextareaProps, ThemeProvider, ThemeProviderProps, useTheme };
+export { Badge, BadgeProps, Button, ButtonProps, CloseButton, CloseButtonProps, HelpText, HelpTextProps, Icon, IconButton, IconProps, IconType, InfiniteLinearProgress, Input, InputNumber, InputNumberProps, InputProps, Label, LabelProps, Link, LinkProps, Select, Stack, StackProps, Textarea, TextareaProps, ThemeProvider, ThemeProviderProps, useTheme };

package/dist/index.js

@@ -59,7 +59,7 @@ __export(src_exports, {
   InputNumber: () => InputNumber,
   Label: () => Label,
   LinearProgress: () => import_theme_ui15.Progress,
-  Link: () => import_theme_ui14.Link,
+  Link: () => Link,
   Radio: () => import_theme_ui19.Radio,
   Select: () => Select,
   Slider: () => import_theme_ui21.Slider,
@@ -285,6 +285,20 @@ var Label = ({
 
 // src/components/Link.tsx
 var import_theme_ui14 = require("theme-ui");
+var import_react4 = __toESM(require("react"));
+var import_jsx_runtime7 = require("react/jsx-runtime");
+var Link = import_react4.default.forwardRef(({
+  quiet,
+  className,
+  ...props
+}, ref) => {
+  return /* @__PURE__ */(0, import_jsx_runtime7.jsx)(import_theme_ui14.Link, {
+    className: `${quiet ? "quiet" : ""} ${className ?? ""}`,
+    ...props,
+    ref
+  });
+});
+Link.displayName = "Link";
 
 // src/components/LinearProgress.tsx
 var import_theme_ui15 = require("theme-ui");
@@ -294,15 +308,15 @@ var import_theme_ui16 = require("theme-ui");
 
 // src/components/Select.tsx
 var import_theme_ui17 = require("theme-ui");
-var import_react4 = __toESM(require("react"));
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var Select = import_react4.default.forwardRef(({
+var import_react5 = __toESM(require("react"));
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var Select = import_react5.default.forwardRef(({
   arrow,
   ...props
 }, ref) => {
-  return /* @__PURE__ */(0, import_jsx_runtime7.jsx)(import_theme_ui17.Select, {
-    arrow: /* @__PURE__ */(0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, {
-      children: [arrow ?? /* @__PURE__ */(0, import_jsx_runtime7.jsx)(import_theme_ui16.Text, {
+  return /* @__PURE__ */(0, import_jsx_runtime8.jsx)(import_theme_ui17.Select, {
+    arrow: /* @__PURE__ */(0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, {
+      children: [arrow ?? /* @__PURE__ */(0, import_jsx_runtime8.jsx)(import_theme_ui16.Text, {
         sx: {
           marginLeft: ({
             space
@@ -313,10 +327,10 @@ var Select = import_react4.default.forwardRef(({
           pointerEvents: "none",
           lineHeight: 0
         },
-        children: /* @__PURE__ */(0, import_jsx_runtime7.jsx)(Icon, {
+        children: /* @__PURE__ */(0, import_jsx_runtime8.jsx)(Icon, {
           icon: "picker-down"
         })
-      }), props["aria-invalid"] === "true" && /* @__PURE__ */(0, import_jsx_runtime7.jsx)(import_theme_ui16.Text, {
+      }), props["aria-invalid"] === "true" && /* @__PURE__ */(0, import_jsx_runtime8.jsx)(import_theme_ui16.Text, {
         className: "error-icon",
         sx: {
           marginLeft: ({
@@ -328,7 +342,7 @@ var Select = import_react4.default.forwardRef(({
           pointerEvents: "none",
           lineHeight: 0
         },
-        children: /* @__PURE__ */(0, import_jsx_runtime7.jsx)(Icon, {
+        children: /* @__PURE__ */(0, import_jsx_runtime8.jsx)(Icon, {
           icon: "error"
         })
       })]
@@ -346,11 +360,11 @@ var import_theme_ui18 = require("theme-ui");
 var import_theme_ui19 = require("theme-ui");
 
 // src/components/IconButton.tsx
-var React6 = __toESM(require("react"));
+var React7 = __toESM(require("react"));
 var import_theme_ui20 = require("theme-ui");
-var import_jsx_runtime8 = require("react/jsx-runtime");
-var IconButton = React6.forwardRef((props, ref) => {
-  return /* @__PURE__ */(0, import_jsx_runtime8.jsx)(import_theme_ui20.IconButton, {
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var IconButton = React7.forwardRef((props, ref) => {
+  return /* @__PURE__ */(0, import_jsx_runtime9.jsx)(import_theme_ui20.IconButton, {
     type: "button",
     ...props,
     ref
@@ -365,12 +379,12 @@ var import_theme_ui21 = require("theme-ui");
 var import_theme_ui22 = require("theme-ui");
 
 // src/components/InfiniteLinearProgress.tsx
-var React7 = __toESM(require("react"));
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var React8 = __toESM(require("react"));
+var import_jsx_runtime10 = require("react/jsx-runtime");
 var MAX_PROGRESS = 100;
 var InfiniteLinearProgress = () => {
-  const [progress, setProgress] = React7.useState(0);
-  React7.useEffect(() => {
+  const [progress, setProgress] = React8.useState(0);
+  React8.useEffect(() => {
     const timer = setInterval(() => {
       setProgress(oldProgress => {
         if (oldProgress === MAX_PROGRESS) {
@@ -391,7 +405,7 @@ var InfiniteLinearProgress = () => {
       clearInterval(timer);
     };
   }, []);
-  return /* @__PURE__ */(0, import_jsx_runtime9.jsx)(import_theme_ui15.Progress, {
+  return /* @__PURE__ */(0, import_jsx_runtime10.jsx)(import_theme_ui15.Progress, {
     max: MAX_PROGRESS,
     value: progress,
     role: "progressbar"
@@ -400,15 +414,15 @@ var InfiniteLinearProgress = () => {
 
 // src/components/Textarea.tsx
 var import_theme_ui23 = require("theme-ui");
-var import_react5 = __toESM(require("react"));
-var import_jsx_runtime10 = require("react/jsx-runtime");
-var Textarea = import_react5.default.forwardRef(({
+var import_react6 = __toESM(require("react"));
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var Textarea = import_react6.default.forwardRef(({
   trailingIcon,
   className,
   sx,
   ...textareaProps
 }, ref) => {
-  return /* @__PURE__ */(0, import_jsx_runtime10.jsxs)(import_theme_ui8.Flex, {
+  return /* @__PURE__ */(0, import_jsx_runtime11.jsxs)(import_theme_ui8.Flex, {
     className,
     sx: {
       ...sx,
@@ -416,7 +430,7 @@ var Textarea = import_react5.default.forwardRef(({
       padding: 0,
       border: "none"
     },
-    children: [/* @__PURE__ */(0, import_jsx_runtime10.jsx)(import_theme_ui23.Textarea, {
+    children: [/* @__PURE__ */(0, import_jsx_runtime11.jsx)(import_theme_ui23.Textarea, {
       ref,
       sx: {
         ...sx,
@@ -425,13 +439,13 @@ var Textarea = import_react5.default.forwardRef(({
       },
       className,
       ...textareaProps
-    }), trailingIcon && /* @__PURE__ */(0, import_jsx_runtime10.jsx)(import_theme_ui16.Text, {
+    }), trailingIcon && /* @__PURE__ */(0, import_jsx_runtime11.jsx)(import_theme_ui16.Text, {
       sx: {
         position: "absolute",
         right: "1.25rem",
         top: "0.75rem"
       },
-      children: /* @__PURE__ */(0, import_jsx_runtime10.jsx)(Icon, {
+      children: /* @__PURE__ */(0, import_jsx_runtime11.jsx)(Icon, {
         inline: true,
         icon: trailingIcon
       })
@@ -444,14 +458,14 @@ Textarea.displayName = "Textarea";
 var import_theme_ui24 = require("theme-ui");
 
 // src/components/HelpText.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var HelpText = ({
   disabled,
   negative,
   ...props
 }) => {
   const variant = ["text.help", negative ? "negative" : void 0].filter(Boolean).join(".");
-  return /* @__PURE__ */(0, import_jsx_runtime11.jsx)(import_theme_ui16.Text, {
+  return /* @__PURE__ */(0, import_jsx_runtime12.jsx)(import_theme_ui16.Text, {
     variant,
     "aria-disabled": disabled ? "true" : void 0,
     ...props
@@ -460,14 +474,14 @@ var HelpText = ({
 
 // src/components/CloseButton.tsx
 var import_theme_ui25 = require("theme-ui");
-var import_react6 = __toESM(require("react"));
-var import_jsx_runtime12 = require("react/jsx-runtime");
-var CloseButton = import_react6.default.forwardRef(({
+var import_react7 = __toESM(require("react"));
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var CloseButton = import_react7.default.forwardRef(({
   label,
   sx,
   ...props
 }, ref) => {
-  return /* @__PURE__ */(0, import_jsx_runtime12.jsxs)(import_theme_ui25.Button, {
+  return /* @__PURE__ */(0, import_jsx_runtime13.jsxs)(import_theme_ui25.Button, {
     variant: "buttons.closeButton",
     type: "button",
     "aria-label": label,
@@ -478,7 +492,7 @@ var CloseButton = import_react6.default.forwardRef(({
     },
     ...props,
     ref,
-    children: [label, /* @__PURE__ */(0, import_jsx_runtime12.jsx)(Icon, {
+    children: [label, /* @__PURE__ */(0, import_jsx_runtime13.jsx)(Icon, {
       icon: "close"
     })]
   });
@@ -487,9 +501,9 @@ CloseButton.displayName = "CloseButton";
 
 // src/components/InputNumber.tsx
 var import_theme_ui26 = require("theme-ui");
-var import_react7 = __toESM(require("react"));
-var import_jsx_runtime13 = require("react/jsx-runtime");
-var InputNumber = import_react7.default.forwardRef(({
+var import_react8 = __toESM(require("react"));
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var InputNumber = import_react8.default.forwardRef(({
   sx,
   value,
   infoIcon,
@@ -497,7 +511,7 @@ var InputNumber = import_react7.default.forwardRef(({
   onClickInfoIcon,
   ...inputProps
 }, ref) => {
-  const sxProps = import_react7.default.useMemo(() => {
+  const sxProps = import_react8.default.useMemo(() => {
     const size = String(typeof value === "undefined" ? 0 : value).length;
     if (inputProps["aria-invalid"] === "true") {
       return {
@@ -546,7 +560,7 @@ var InputNumber = import_react7.default.forwardRef(({
     }
     onChange(value + 1);
   };
-  return /* @__PURE__ */(0, import_jsx_runtime13.jsxs)(import_theme_ui8.Flex, {
+  return /* @__PURE__ */(0, import_jsx_runtime14.jsxs)(import_theme_ui8.Flex, {
     sx: {
       width: "fit-content",
       ...sx,
@@ -556,7 +570,7 @@ var InputNumber = import_react7.default.forwardRef(({
     },
     ref,
     "aria-invalid": inputProps["aria-invalid"],
-    children: [/* @__PURE__ */(0, import_jsx_runtime13.jsx)(import_theme_ui26.Input, {
+    children: [/* @__PURE__ */(0, import_jsx_runtime14.jsx)(import_theme_ui26.Input, {
       ref,
       variant: "forms.inputNumber",
       sx: sxProps,
@@ -566,7 +580,7 @@ var InputNumber = import_react7.default.forwardRef(({
       },
       value,
       ...inputProps
-    }), /* @__PURE__ */(0, import_jsx_runtime13.jsx)(import_theme_ui16.Text, {
+    }), /* @__PURE__ */(0, import_jsx_runtime14.jsx)(import_theme_ui16.Text, {
       sx: {
         position: "absolute",
         alignSelf: "center",
@@ -575,10 +589,10 @@ var InputNumber = import_react7.default.forwardRef(({
         cursor: "pointer"
       },
       onClick: handleChangeUp,
-      children: /* @__PURE__ */(0, import_jsx_runtime13.jsx)(Icon, {
+      children: /* @__PURE__ */(0, import_jsx_runtime14.jsx)(Icon, {
         icon: "picker-down"
       })
-    }), infoIcon && /* @__PURE__ */(0, import_jsx_runtime13.jsx)(import_theme_ui16.Text, {
+    }), infoIcon && /* @__PURE__ */(0, import_jsx_runtime14.jsx)(import_theme_ui16.Text, {
       sx: {
         position: "absolute",
         alignSelf: "center",
@@ -587,10 +601,10 @@ var InputNumber = import_react7.default.forwardRef(({
         cursor: onClickInfoIcon ? "pointer" : "default"
       },
       onClick: onClickInfoIcon,
-      children: /* @__PURE__ */(0, import_jsx_runtime13.jsx)(Icon, {
+      children: /* @__PURE__ */(0, import_jsx_runtime14.jsx)(Icon, {
         icon: "info"
       })
-    }), /* @__PURE__ */(0, import_jsx_runtime13.jsx)(import_theme_ui16.Text, {
+    }), /* @__PURE__ */(0, import_jsx_runtime14.jsx)(import_theme_ui16.Text, {
       sx: {
         position: "absolute",
         alignSelf: "center",
@@ -599,7 +613,7 @@ var InputNumber = import_react7.default.forwardRef(({
         cursor: "pointer"
       },
       onClick: handleChangeDown,
-      children: /* @__PURE__ */(0, import_jsx_runtime13.jsx)(Icon, {
+      children: /* @__PURE__ */(0, import_jsx_runtime14.jsx)(Icon, {
         icon: "picker-up"
       })
     })]
@@ -608,10 +622,10 @@ var InputNumber = import_react7.default.forwardRef(({
 InputNumber.displayName = "InputNumber";
 
 // src/components/Stack.tsx
-var React11 = __toESM(require("react"));
-var import_jsx_runtime14 = require("react/jsx-runtime");
-var Stack = React11.forwardRef((props, ref) => {
-  return /* @__PURE__ */(0, import_jsx_runtime14.jsx)(import_theme_ui8.Flex, {
+var React12 = __toESM(require("react"));
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var Stack = React12.forwardRef((props, ref) => {
+  return /* @__PURE__ */(0, import_jsx_runtime15.jsx)(import_theme_ui8.Flex, {
     ref,
     ...props,
     sx: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ttoss/ui",
-  "version": "1.32.3",
+  "version": "1.32.4",
   "description": "Primitive layout, typographic, and other components for styling applications.",
   "license": "UNLICENSED",
   "author": "ttoss",
@@ -23,7 +23,7 @@
     "@emotion/react": "^11.10.6",
     "@iconify-icon/react": "^1.0.7",
     "@theme-ui/match-media": "^0.15.7",
-    "@ttoss/theme": "^1.4.18",
+    "@ttoss/theme": "^1.4.19",
     "theme-ui": "^0.15.7"
   },
   "peerDependencies": {
@@ -48,5 +48,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "8eafbcce082f4e1d8173eef0d40b99c683de8af9"
+  "gitHead": "8cf5e69a478866466d1da542af3a9e1ffd1ae35e"
 }

package/src/components/Link.tsx

@@ -1 +1,20 @@
-export { Link, type LinkProps } from 'theme-ui';
+import { type LinkProps as LinkPropsUi, Link as LinkUi } from 'theme-ui';
+import React from 'react';
+
+export type LinkProps = LinkPropsUi & {
+  quiet?: boolean;
+};
+
+export const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(
+  ({ quiet, className, ...props }, ref) => {
+    return (
+      <LinkUi
+        className={`${quiet ? 'quiet' : ''} ${className ?? ''}`}
+        {...props}
+        ref={ref}
+      />
+    );
+  }
+);
+
+Link.displayName = 'Link';