@ttoss/ui 5.0.15 → 5.1.0

package/dist/esm/index.js

@@ -823,11 +823,39 @@ var Stack = React13.forwardRef((props, ref) => {
 });
 Stack.displayName = "Stack";
 
+// src/components/Switch.tsx
+import { Switch as SwitchUi } from "theme-ui";
+import { jsx as jsx17 } from "react/jsx-runtime";
+var Switch = props => {
+  return /* @__PURE__ */jsx17(SwitchUi, {
+    ...props,
+    role: "switch",
+    "aria-checked": props.checked || false,
+    sx: {
+      backgroundColor: "input.background.muted.default",
+      "input:checked ~ &": {
+        backgroundColor: "input.background.secondary.default"
+      },
+      "input ~ & > div": {
+        backgroundColor: "input.background.primary.default"
+      },
+      "input:checked ~ & > div": {
+        backgroundColor: "input.background.accent.default"
+      },
+      "input:focus ~ &": {
+        outline: "md",
+        outlineColor: "input.border.accent.default",
+        outlineOffset: "0px"
+      }
+    }
+  });
+};
+
 // src/components/Textarea.tsx
 import * as React14 from "react";
 import { Icon as Icon8 } from "@ttoss/react-icons";
 import { Textarea as TextareaUI } from "theme-ui";
-import { jsx as jsx17, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs8 } from "react/jsx-runtime";
 var Textarea = React14.forwardRef(({
   trailingIcon,
   className,
@@ -842,7 +870,7 @@ var Textarea = React14.forwardRef(({
       padding: 0,
       border: "none"
     },
-    children: [/* @__PURE__ */jsx17(TextareaUI, {
+    children: [/* @__PURE__ */jsx18(TextareaUI, {
       ref,
       sx: {
         fontFamily: "body",
@@ -854,13 +882,13 @@ var Textarea = React14.forwardRef(({
       },
       className,
       ...textareaProps
-    }), trailingIcon && /* @__PURE__ */jsx17(Text, {
+    }), trailingIcon && /* @__PURE__ */jsx18(Text, {
       sx: {
         position: "absolute",
         right: "1.25rem",
         top: "0.75rem"
       },
-      children: /* @__PURE__ */jsx17(Icon8, {
+      children: /* @__PURE__ */jsx18(Icon8, {
         inline: true,
         icon: trailingIcon
       })
@@ -873,16 +901,16 @@ Textarea.displayName = "Textarea";
 import { BruttalFonts, BruttalTheme } from "@ttoss/theme/Bruttal";
 import { Global, css } from "@emotion/react";
 import { ThemeUIProvider } from "theme-ui";
-import { Fragment, jsx as jsx18, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx19, jsxs as jsxs9 } from "react/jsx-runtime";
 var ThemeProvider = ({
   children,
   theme = BruttalTheme,
   fonts = BruttalFonts
 }) => {
-  return /* @__PURE__ */jsx18(Fragment, {
+  return /* @__PURE__ */jsx19(Fragment, {
     children: /* @__PURE__ */jsxs9(ThemeUIProvider, {
       theme,
-      children: [/* @__PURE__ */jsx18(Global, {
+      children: [/* @__PURE__ */jsx19(Global, {
         styles: css`
             ${fonts.map(url => {
           return `@import url('${url}');`;
@@ -901,4 +929,4 @@ var useTheme = useThemeUI;
 import { keyframes } from "@emotion/react";
 import { useBreakpointIndex, useResponsiveValue } from "@theme-ui/match-media";
 import { BaseStyles, Global as Global2 } from "theme-ui";
-export { ActionButton, Badge, BaseStyles, Box, Button, Card, Checkbox, CloseButton, Container, Divider, Flex, Global2 as Global, Grid, Heading, HelpText, IconButton, Image, InfiniteLinearProgress, Input, InputNumber, InputPassword, Label, Progress as LinearProgress, Link, Paragraph, Radio, Select, Slider, Spinner, Stack, Text, Textarea, ThemeProvider, keyframes, useBreakpointIndex, useResponsiveValue, useTheme };
+export { ActionButton, Badge, BaseStyles, Box, Button, Card, Checkbox, CloseButton, Container, Divider, Flex, Global2 as Global, Grid, Heading, HelpText, IconButton, Image, InfiniteLinearProgress, Input, InputNumber, InputPassword, Label, Progress as LinearProgress, Link, Paragraph, Radio, Select, Slider, Spinner, Stack, Switch, Text, Textarea, ThemeProvider, keyframes, useBreakpointIndex, useResponsiveValue, useTheme };

package/dist/index.d.ts

@@ -1,8 +1,8 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import * as theme_ui from 'theme-ui';
-import { ButtonProps as ButtonProps$1, BadgeProps as BadgeProps$1, CheckboxProps as CheckboxProps$1, TextProps, IconButtonProps, InputProps as InputProps$1, LabelProps as LabelProps$1, LinkProps as LinkProps$1, SxProp, FlexProps, TextareaProps as TextareaProps$1, Theme } from 'theme-ui';
-export { BaseStyles, Box, BoxProps, Card, CardProps, ContainerProps, Divider, DividerProps, Flex, FlexProps, Global, Grid, GridProps, Heading, HeadingProps, IconButtonProps, Image, ImageProps, Progress as LinearProgress, ProgressProps as LinearProgressProps, Paragraph, ParagraphProps, Radio, RadioProps, Slider, SliderProps, Spinner, SpinnerProps, SxProp, Text, TextProps, Theme, ThemeUIStyleObject } from 'theme-ui';
+import { ButtonProps as ButtonProps$1, BadgeProps as BadgeProps$1, CheckboxProps as CheckboxProps$1, TextProps, IconButtonProps, InputProps as InputProps$1, LabelProps as LabelProps$1, LinkProps as LinkProps$1, SxProp, FlexProps, SwitchProps, TextareaProps as TextareaProps$1, Theme } from 'theme-ui';
+export { BaseStyles, Box, BoxProps, Card, CardProps, ContainerProps, Divider, DividerProps, Flex, FlexProps, Global, Grid, GridProps, Heading, HeadingProps, IconButtonProps, Image, ImageProps, Progress as LinearProgress, ProgressProps as LinearProgressProps, Paragraph, ParagraphProps, Radio, RadioProps, Slider, SliderProps, Spinner, SpinnerProps, SwitchProps, SxProp, Text, TextProps, Theme, ThemeUIStyleObject } from 'theme-ui';
 import { IconType } from '@ttoss/react-icons';
 import { Props } from 'react-select';
 export { Keyframes, keyframes } from '@emotion/react';
@@ -123,6 +123,8 @@ type StackProps = FlexProps;
  */
 declare const Stack: React.ForwardRefExoticComponent<theme_ui.BoxProps & React.RefAttributes<HTMLElement>>;
 
+declare const Switch: (props: SwitchProps) => react_jsx_runtime.JSX.Element;
+
 interface TextareaProps extends TextareaProps$1 {
     trailingIcon?: IconType;
 }
@@ -140,4 +142,4 @@ declare const ThemeProvider: ({ children, theme, fonts, }: ThemeProviderProps) =
 
 declare const useTheme: () => theme_ui.ThemeUIContextValue;
 
-export { ActionButton, type ActionButtonProps, Badge, type BadgeProps, Button, type ButtonProps, Checkbox, type CheckboxProps, CloseButton, type CloseButtonProps, Container, HelpText, type HelpTextProps, IconButton, InfiniteLinearProgress, Input, InputNumber, type InputNumberProps, InputPassword, type InputPasswordProps, type InputProps, Label, type LabelProps, Link, type LinkProps, Select, type SelectOption, type SelectOptions, type SelectProps, Stack, type StackProps, Textarea, type TextareaProps, ThemeProvider, type ThemeProviderProps, useTheme };
+export { ActionButton, type ActionButtonProps, Badge, type BadgeProps, Button, type ButtonProps, Checkbox, type CheckboxProps, CloseButton, type CloseButtonProps, Container, HelpText, type HelpTextProps, IconButton, InfiniteLinearProgress, Input, InputNumber, type InputNumberProps, InputPassword, type InputPasswordProps, type InputProps, Label, type LabelProps, Link, type LinkProps, Select, type SelectOption, type SelectOptions, type SelectProps, Stack, type StackProps, Switch, Textarea, type TextareaProps, ThemeProvider, type ThemeProviderProps, useTheme };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ttoss/ui",
-  "version": "5.0.15",
+  "version": "5.1.0",
   "description": "Primitive layout, typographic, and other components for styling applications.",
   "license": "MIT",
   "author": "ttoss",