@tecsinapse/cortex-react 1.16.0-beta.1 → 1.16.0-beta.10

package/dist/cjs/components/Accordion/Trigger.js

@@ -35,7 +35,7 @@ const AccordionTrigger = ({
     "div",
     {
       className: clsx(
-        "flex justify-between align-center border-secondary-light cursor-pointer",
+        "flex justify-between align-center border-content-minimal cursor-pointer",
         { "mr-deca": floating && direction === "horizontal" },
         { "mb-deca": floating && direction === "vertical" },
         { "border-r flex-col px-mili": direction === "horizontal" },
@@ -47,12 +47,12 @@ const AccordionTrigger = ({
           "div",
           {
             className: clsx(
-              "rounded-mili border border-secondary-light flex align-center justify-center p-micro",
+              "rounded-mili border border-content-minimal flex align-center justify-center p-micro",
               {
-                "absolute -translate-x-micro translate-y-deca bg-white": floating && direction === "horizontal"
+                "absolute -translate-x-micro translate-y-deca bg-surface-overlay": floating && direction === "horizontal"
               },
               {
-                "absolute -translate-y-micro translate-x-deca bg-white": floating && direction === "vertical"
+                "absolute -translate-y-micro translate-x-deca bg-surface-overlay": floating && direction === "vertical"
               },
               className
             ),
@@ -60,7 +60,7 @@ const AccordionTrigger = ({
               lia.LiaAngleRightSolid,
               {
                 className: clsx(
-                  "text-secondary-medium transition-transform duration-200",
+                  "text-content-low transition-transform duration-200",
                   {
                     "rotate-180": invertedArrow ? !open : open
                   }
@@ -70,7 +70,7 @@ const AccordionTrigger = ({
               lia.LiaAngleDownSolid,
               {
                 className: clsx(
-                  "text-secondary-medium transition-transform duration-200",
+                  "text-content-low transition-transform duration-200",
                   {
                     "rotate-180": invertedArrow ? !open : open
                   }

package/dist/cjs/components/Avatar.js

@@ -16,7 +16,7 @@ const Avatar = ({ src, name, className, ...rest }) => {
     {
       ...rest,
       className: clsx(
-        "rounded-pill bg-secondary-dark h-mega flex items-center justify-center cursor-pointer aspect-square",
+        "rounded-pill bg-content-medium h-mega flex items-center justify-center cursor-pointer aspect-square",
         className
       ),
       children: src && !hasError ? /* @__PURE__ */ jsxRuntime.jsx(

package/dist/cjs/components/Breadcrumbs/BreadcrumbItem.js

@@ -17,7 +17,7 @@ const BreadcrumbItem = ({
       {
         className: clsx(
           "no-underline",
-          isLast ? "text-secondary-medium cursor-default" : "text-secondary-xdark cursor-pointer"
+          isLast ? "text-content-low cursor-default" : "text-content-medium cursor-pointer"
         ),
         children: title
       }

package/dist/cjs/components/Calendar/CalendarGrid.js

@@ -23,7 +23,7 @@ const CalendarGrid = ({ state }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: "bg-white rounded-micro px-deca py-mili",
+      className: "bg-surface-overlay rounded-micro px-deca py-mili",
       "data-testid": "calendar-grid",
       children: /* @__PURE__ */ jsxRuntime.jsxs("table", { ...gridProps, className: "border-separate border-spacing-y-nano", children: [
         /* @__PURE__ */ jsxRuntime.jsx("thead", { ...headerProps, children: /* @__PURE__ */ jsxRuntime.jsx(CalendarGridHeaderRow.CalendarGridHeaderRow, { weekDays }) }),

package/dist/cjs/components/ColorPicker.js

@@ -6,19 +6,28 @@ var React = require('react');
 
 const Box = React.forwardRef((props, ref) => {
   const { id, className, ...rest } = props;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx("w-tera h-kilo border overflow-hidden relative", className), children: /* @__PURE__ */ jsxRuntime.jsx(
-    "input",
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
     {
-      ...rest,
-      id,
-      type: "color",
-      className: "bg-transparent cursor-pointer disabled:opacity-50 disabled:cursor-default absolute -top-1.5 -right-1 w-peta h-giga",
-      ref
+      className: clsx(
+        "w-tera h-kilo border overflow-hidden relative",
+        className
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          ...rest,
+          id,
+          type: "color",
+          className: "bg-transparent cursor-pointer disabled:opacity-50 disabled:cursor-default absolute -top-1.5 -right-1 w-peta h-giga",
+          ref
+        }
+      )
     }
-  ) });
+  );
 });
 const Face = ({ children }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-mili p-mili shadow-default bg-white flex flex-row items-center gap-2", children });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-mili p-mili shadow-default bg-default flex flex-row items-center gap-2", children });
 };
 const Label = ({
   children,

package/dist/cjs/components/Kanban.js

@@ -9,7 +9,7 @@ const Root = ({ children, className, ...rest }) => {
     {
       ...rest,
       className: clsx.clsx(
-        "border border-dashed border-secondary-medium rounded-mili bg-secondary-xlight overflow-hidden",
+        "border border-dashed border-content-low rounded-mili bg-content-inverse overflow-hidden",
         className
       ),
       children

package/dist/cjs/components/Popover/Content.js

@@ -28,7 +28,7 @@ const PopoverContent = ({
       ref: refs.setFloating,
       ...getFloatingProps(),
       className: clsx(
-        "border border-gray-200 bg-black p-[0px] rounded-md shadow-default z-popover",
+        "border border-gray-200 bg-surface-inverse p-0 rounded-md shadow-default z-popover",
         className
       ),
       style: {

package/dist/cjs/components/Select/Popover.js

@@ -11,7 +11,7 @@ const SelectPopover = ({ children }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(react.FloatingPortal, { children: /* @__PURE__ */ jsxRuntime.jsx(
     index.Popover.Content,
     {
-      className: "bg-white max-h-[30vh] overflow-y-auto gap-y-mili flex flex-col p-0",
+      className: "bg-surface-overlay max-h-[30vh] overflow-y-auto gap-y-mili flex flex-col p-0",
       style: {
         width: triggerWidth ? `${triggerWidth}px` : "auto",
         zIndex: 9999

package/dist/cjs/components/Skeleton.js

@@ -9,7 +9,7 @@ const Skeleton = ({ className, children, ...rest }) => {
     {
       ...rest,
       "data-testid": "skeleton",
-      className: clsx("animate-pulse bg-secondary-light", className),
+      className: clsx("animate-pulse bg-content-minimal", className),
       children
     }
   );

package/dist/cjs/components/Stepper/Root.js

@@ -58,7 +58,7 @@ const Root = ({
     "div",
     {
       className: clsx(
-        "flex w-full space-x-2 bg-white p-4 pb-2 rounded-mili",
+        "flex w-full space-x-2 bg-surface-overlay p-4 pb-2 rounded-mili",
         className
       ),
       children: React.Children.map(children, renderNode)

package/dist/cjs/components/TimePicker/TimePickerInput.js

@@ -62,7 +62,7 @@ const TimePickerInputWithPopover = (props) => {
     /* @__PURE__ */ jsxRuntime.jsx(
       index.Popover.Content,
       {
-        className: "bg-white shadow-default border-none p-deca flex flex-col",
+        className: "bg-surface-overlay shadow-default border-none p-deca flex flex-col",
         initialFocus: -1,
         children: /* @__PURE__ */ jsxRuntime.jsx(
           TimePickerSelector.TimePickerSelector,

package/dist/cjs/components/Uploader/Dropzone.js

@@ -19,7 +19,7 @@ const Dropzone = ({
     {
       ...getRootProps(),
       className: clsx(
-        "bg-white w-full border-dashed border-2 p-deca flex flex-col justify-center rounded-mili overflow-auto h-[18rem]",
+        "bg-surface-overlay w-full border-dashed border-2 p-deca flex flex-col justify-center rounded-mili overflow-auto h-[18rem]",
         {
           "border-success-medium bg-gray-100": isDragActive
         }
@@ -27,7 +27,7 @@ const Dropzone = ({
       children: [
         /* @__PURE__ */ jsxRuntime.jsx("input", { ...getInputProps() }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col justify-center text-center items-center", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               hi2.HiOutlineCloudArrowUp,
               {
@@ -38,7 +38,7 @@ const Dropzone = ({
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg font-semibold", "data-testid": "select-dropzone", children: selectFileText })
           ] }),
           hasButton ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-centi", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-secondary-medium", children: dropText }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-content-low", children: dropText }),
             isFileLimitReached ? /* @__PURE__ */ jsxRuntime.jsx(Tooltip.Tooltip, { text: "Voc\xEA s\xF3 pode selecionar um \xFAnico arquivo.", children: /* @__PURE__ */ jsxRuntime.jsx(
               "button",
               {

package/dist/cjs/components/Uploader/Files.js

@@ -8,7 +8,7 @@ const Files = ({
   onDelete,
   uploadProgressText = "Upload(s) in progress"
 }) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white w-full border-2 p-deca flex flex-col overflow-y-auto rounded-mili h-[18rem]", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-surface-overlay w-full border-2 p-deca flex flex-col overflow-y-auto rounded-mili h-[18rem]", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-mili items-center mb-deca", children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center w-deca h-deca bg-primary-medium rounded-full text-micro text-white", children: `${files.length}` }),
       /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-md font-semibold", "data-testid": "upload-progress", children: uploadProgressText })

package/dist/cjs/components/Uploader/Manager.js

@@ -47,7 +47,7 @@ const Manager = ({
                 children: min ? /* @__PURE__ */ jsxRuntime.jsx(io5.IoChevronUp, {}) : /* @__PURE__ */ jsxRuntime.jsx(io5.IoChevronDown, {})
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx("h3", { "data-testid": "upload-progress", children: isLoading ? uploadProgressText : uploadSuccessText }),
+            /* @__PURE__ */ jsxRuntime.jsx("h3", { "data-testid": "upload-progress", className: "font-bold text-h4", children: isLoading ? uploadProgressText : uploadSuccessText }),
             /* @__PURE__ */ jsxRuntime.jsx(
               Button.Button,
               {

package/dist/cjs/components/Uploader/Modal.js

@@ -18,7 +18,7 @@ const Modal = ({
       {
         open,
         onClose,
-        className: "flex flex-col bg-secondary-xlight rounded-mili min-w-[70vw] max-w-[95vh] max-h-[95vh] overflow-auto",
+        className: "flex flex-col bg-surface-base rounded-mili min-w-[70vw] max-w-[95vh] max-h-[95vh] overflow-auto text-default",
         children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full items-center justify-between mb-deca", children: [
             /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-deca font-semibold ml-tera flex-1 text-center", children: title }),

package/dist/cjs/styles/calendar-cell.js

@@ -4,7 +4,7 @@ var tailwindVariants = require('tailwind-variants');
 
 const calendarCell = tailwindVariants.tv({
   slots: {
-    cell: "text-center rounded-mili text-black hover:bg-primary-light",
+    cell: "text-center rounded-mili hover:bg-primary-light",
     button: "flex aspect-square items-center justify-center"
   },
   variants: {
@@ -35,7 +35,7 @@ const calendarCell = tailwindVariants.tv({
     },
     isDisabled: {
       true: {
-        cell: "text-secondary-light cursor-default  hover:bg-white-500",
+        cell: "text-content-minimal cursor-default  hover:bg-surface-overlay",
         button: "cursor-default"
       }
     }

package/dist/cjs/styles/date-picker-input-base.js

@@ -9,7 +9,7 @@ const datePickerInputBase = tailwindVariants.tv({
   variants: {
     disabled: {
       true: {
-        icon: "text-secondary-light cursor-default"
+        icon: "text-content-minimal cursor-default"
       }
     }
   }

package/dist/cjs/styles/date-segment.js

@@ -4,12 +4,12 @@ var tailwindVariants = require('tailwind-variants');
 
 const dateSegment = tailwindVariants.tv({
   slots: {
-    base: "focus:outline-none focus:bg-secondary-light"
+    base: "focus:outline-none focus:bg-content-minimal"
   },
   variants: {
     disabled: {
       true: {
-        base: "text-secondary-light"
+        base: "text-content-minimal"
       }
     }
   }

package/dist/cjs/styles/groupButton.js

@@ -4,12 +4,12 @@ var tailwindVariants = require('tailwind-variants');
 
 const groupButton = tailwindVariants.tv({
   slots: {
-    button: "border-[1px] border-secondary-medium px-centi py-mili items-center flex text-sub font-bold",
-    inactive: "bg-white text-secondary-medium disabled:bg-secondary-light",
+    button: "border-[1px] border-content-low px-centi py-mili items-center flex text-sub font-bold",
+    inactive: "bg-surface-overlay text-content-low disabled:bg-content-minimal",
     firstButton: "first:rounded-l-mili first:border-r-0",
     lastButton: "last:rounded-r-mili last:border-l-0",
     container: "flex flex-row h-[2rem]",
-    active: "text-white bg-secondary-medium"
+    active: "text-white bg-content-low"
   }
 });
 

package/dist/cjs/styles/menubar.js

@@ -4,10 +4,10 @@ var tailwindVariants = require('tailwind-variants');
 
 const menubar = tailwindVariants.tv({
   slots: {
-    header: "relative w-screen px-kilo py-deca flex flex-row md:justify-between bg-white z-header sm:justify-start",
+    header: "relative w-screen px-kilo py-deca flex flex-row md:justify-between bg-surface-overlay z-header sm:justify-start",
     left: "flex items-center w-fit",
     right: "flex items-center gap-x-deca hidden sm:flex",
-    dropdown: "w-full bg-white flex-1 shadow-default z-popover px-[8vw] absolute"
+    dropdown: "w-full bg-surface-overlay flex-1 shadow-default z-popover px-[8vw] absolute"
   },
   variants: {
     show: {
@@ -21,7 +21,7 @@ const menubar = tailwindVariants.tv({
 const mostUsed = tailwindVariants.tv({
   slots: {
     container: "mb-kilo",
-    label: "font-bold mb-centi",
+    label: "font-bold mb-centi text-default",
     containerList: "gap-x-kilo flex flex-row"
   }
 });
@@ -29,26 +29,26 @@ const mostUsedItem = tailwindVariants.tv({
   slots: {
     container: "flex-1 py-mili",
     title: "text-primary-medium font-bold text-base",
-    category: "text-secondary-medium text-label"
+    category: "text-content-low text-label"
   }
 });
 const item = tailwindVariants.tv({
   slots: {
-    container: "flex flex-row gap-x-deca items-center text-secondary-dark hover:cursor-pointer text-base",
+    container: "flex flex-row gap-x-deca items-center text-content-medium hover:cursor-pointer text-base",
     textBehavior: "hover:text-primary-medium",
     icon: "text-primary-medium hover:cursor-pointer"
   }
 });
 const category = tailwindVariants.tv({
   slots: {
-    text: "mb-mili font-bold",
-    hr: "mb-mili border-0 h-px bg-secondary-light",
+    text: "mb-mili font-bold text-default",
+    hr: "mb-mili border-0 h-px bg-content-high",
     container: "flex flex-col gap-y-mili"
   }
 });
 const subItem = tailwindVariants.tv({
   slots: {
-    container: "pl-deca text-sub border-l-[1px] border-primary-medium text-secondary-dark hover:text-primary-medium cursor-pointer"
+    container: "pl-deca text-sub border-l-[1px] border-primary-medium text-content-medium hover:text-primary-medium cursor-pointer"
   }
 });
 const animate = tailwindVariants.tv({

package/dist/cjs/styles/progressBar.js

@@ -5,7 +5,7 @@ var tailwindVariants = require('tailwind-variants');
 const ProgressVariants = tailwindVariants.tv({
   slots: {
     container: "relative",
-    bar: "h-1.5 w-full overflow-hidden bg-secondary-xlight",
+    bar: "h-1.5 w-full overflow-hidden bg-content-inverse",
     progress: "w-full h-full rounded-mili"
   },
   variants: {

package/dist/cjs/styles/stepNodeVariants.js

@@ -30,8 +30,8 @@ const StepNodeVariants = tailwindVariants.tv({
         content: "font-bold"
       },
       false: {
-        content: "text-secondary-medium",
-        separator: "bg-secondary-light"
+        content: "text-content-low",
+        separator: "bg-content-minimal"
       }
     },
     selected: {

package/dist/cjs/styles/time-field-input.js

@@ -9,7 +9,7 @@ const timePickerInputBase = tailwindVariants.tv({
   variants: {
     disabled: {
       true: {
-        icon: "text-secondary-light cursor-default"
+        icon: "text-content-minimal cursor-default"
       }
     }
   }

package/dist/esm/components/Accordion/Trigger.js

@@ -33,7 +33,7 @@ const AccordionTrigger = ({
     "div",
     {
       className: clsx(
-        "flex justify-between align-center border-secondary-light cursor-pointer",
+        "flex justify-between align-center border-content-minimal cursor-pointer",
         { "mr-deca": floating && direction === "horizontal" },
         { "mb-deca": floating && direction === "vertical" },
         { "border-r flex-col px-mili": direction === "horizontal" },
@@ -45,12 +45,12 @@ const AccordionTrigger = ({
           "div",
           {
             className: clsx(
-              "rounded-mili border border-secondary-light flex align-center justify-center p-micro",
+              "rounded-mili border border-content-minimal flex align-center justify-center p-micro",
               {
-                "absolute -translate-x-micro translate-y-deca bg-white": floating && direction === "horizontal"
+                "absolute -translate-x-micro translate-y-deca bg-surface-overlay": floating && direction === "horizontal"
               },
               {
-                "absolute -translate-y-micro translate-x-deca bg-white": floating && direction === "vertical"
+                "absolute -translate-y-micro translate-x-deca bg-surface-overlay": floating && direction === "vertical"
               },
               className
             ),
@@ -58,7 +58,7 @@ const AccordionTrigger = ({
               LiaAngleRightSolid,
               {
                 className: clsx(
-                  "text-secondary-medium transition-transform duration-200",
+                  "text-content-low transition-transform duration-200",
                   {
                     "rotate-180": invertedArrow ? !open : open
                   }
@@ -68,7 +68,7 @@ const AccordionTrigger = ({
               LiaAngleDownSolid,
               {
                 className: clsx(
-                  "text-secondary-medium transition-transform duration-200",
+                  "text-content-low transition-transform duration-200",
                   {
                     "rotate-180": invertedArrow ? !open : open
                   }

package/dist/esm/components/Avatar.js

@@ -14,7 +14,7 @@ const Avatar = ({ src, name, className, ...rest }) => {
     {
       ...rest,
       className: clsx(
-        "rounded-pill bg-secondary-dark h-mega flex items-center justify-center cursor-pointer aspect-square",
+        "rounded-pill bg-content-medium h-mega flex items-center justify-center cursor-pointer aspect-square",
         className
       ),
       children: src && !hasError ? /* @__PURE__ */ jsx(

package/dist/esm/components/Breadcrumbs/BreadcrumbItem.js

@@ -15,7 +15,7 @@ const BreadcrumbItem = ({
       {
         className: clsx(
           "no-underline",
-          isLast ? "text-secondary-medium cursor-default" : "text-secondary-xdark cursor-pointer"
+          isLast ? "text-content-low cursor-default" : "text-content-medium cursor-pointer"
         ),
         children: title
       }

package/dist/esm/components/Calendar/CalendarGrid.js

@@ -21,7 +21,7 @@ const CalendarGrid = ({ state }) => {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      className: "bg-white rounded-micro px-deca py-mili",
+      className: "bg-surface-overlay rounded-micro px-deca py-mili",
       "data-testid": "calendar-grid",
       children: /* @__PURE__ */ jsxs("table", { ...gridProps, className: "border-separate border-spacing-y-nano", children: [
         /* @__PURE__ */ jsx("thead", { ...headerProps, children: /* @__PURE__ */ jsx(CalendarGridHeaderRow, { weekDays }) }),

package/dist/esm/components/ColorPicker.js

@@ -4,19 +4,28 @@ import { forwardRef } from 'react';
 
 const Box = forwardRef((props, ref) => {
   const { id, className, ...rest } = props;
-  return /* @__PURE__ */ jsx("div", { className: clsx("w-tera h-kilo border overflow-hidden relative", className), children: /* @__PURE__ */ jsx(
-    "input",
+  return /* @__PURE__ */ jsx(
+    "div",
     {
-      ...rest,
-      id,
-      type: "color",
-      className: "bg-transparent cursor-pointer disabled:opacity-50 disabled:cursor-default absolute -top-1.5 -right-1 w-peta h-giga",
-      ref
+      className: clsx(
+        "w-tera h-kilo border overflow-hidden relative",
+        className
+      ),
+      children: /* @__PURE__ */ jsx(
+        "input",
+        {
+          ...rest,
+          id,
+          type: "color",
+          className: "bg-transparent cursor-pointer disabled:opacity-50 disabled:cursor-default absolute -top-1.5 -right-1 w-peta h-giga",
+          ref
+        }
+      )
     }
-  ) });
+  );
 });
 const Face = ({ children }) => {
-  return /* @__PURE__ */ jsx("div", { className: "rounded-mili p-mili shadow-default bg-white flex flex-row items-center gap-2", children });
+  return /* @__PURE__ */ jsx("div", { className: "rounded-mili p-mili shadow-default bg-default flex flex-row items-center gap-2", children });
 };
 const Label = ({
   children,

package/dist/esm/components/Kanban.js

@@ -7,7 +7,7 @@ const Root = ({ children, className, ...rest }) => {
     {
       ...rest,
       className: clsx(
-        "border border-dashed border-secondary-medium rounded-mili bg-secondary-xlight overflow-hidden",
+        "border border-dashed border-content-low rounded-mili bg-content-inverse overflow-hidden",
         className
       ),
       children

package/dist/esm/components/Popover/Content.js

@@ -26,7 +26,7 @@ const PopoverContent = ({
       ref: refs.setFloating,
       ...getFloatingProps(),
       className: clsx(
-        "border border-gray-200 bg-black p-[0px] rounded-md shadow-default z-popover",
+        "border border-gray-200 bg-surface-inverse p-0 rounded-md shadow-default z-popover",
         className
       ),
       style: {

package/dist/esm/components/Select/Popover.js

@@ -9,7 +9,7 @@ const SelectPopover = ({ children }) => {
   return /* @__PURE__ */ jsx(FloatingPortal, { children: /* @__PURE__ */ jsx(
     Popover.Content,
     {
-      className: "bg-white max-h-[30vh] overflow-y-auto gap-y-mili flex flex-col p-0",
+      className: "bg-surface-overlay max-h-[30vh] overflow-y-auto gap-y-mili flex flex-col p-0",
       style: {
         width: triggerWidth ? `${triggerWidth}px` : "auto",
         zIndex: 9999

package/dist/esm/components/Skeleton.js

@@ -7,7 +7,7 @@ const Skeleton = ({ className, children, ...rest }) => {
     {
       ...rest,
       "data-testid": "skeleton",
-      className: clsx("animate-pulse bg-secondary-light", className),
+      className: clsx("animate-pulse bg-content-minimal", className),
       children
     }
   );

package/dist/esm/components/Stepper/Root.js

@@ -56,7 +56,7 @@ const Root = ({
     "div",
     {
       className: clsx(
-        "flex w-full space-x-2 bg-white p-4 pb-2 rounded-mili",
+        "flex w-full space-x-2 bg-surface-overlay p-4 pb-2 rounded-mili",
         className
       ),
       children: React.Children.map(children, renderNode)

package/dist/esm/components/TimePicker/TimePickerInput.js

@@ -60,7 +60,7 @@ const TimePickerInputWithPopover = (props) => {
     /* @__PURE__ */ jsx(
       Popover.Content,
       {
-        className: "bg-white shadow-default border-none p-deca flex flex-col",
+        className: "bg-surface-overlay shadow-default border-none p-deca flex flex-col",
         initialFocus: -1,
         children: /* @__PURE__ */ jsx(
           TimePickerSelector,

package/dist/esm/components/Uploader/Dropzone.js

@@ -17,7 +17,7 @@ const Dropzone = ({
     {
       ...getRootProps(),
       className: clsx(
-        "bg-white w-full border-dashed border-2 p-deca flex flex-col justify-center rounded-mili overflow-auto h-[18rem]",
+        "bg-surface-overlay w-full border-dashed border-2 p-deca flex flex-col justify-center rounded-mili overflow-auto h-[18rem]",
         {
           "border-success-medium bg-gray-100": isDragActive
         }
@@ -25,7 +25,7 @@ const Dropzone = ({
       children: [
         /* @__PURE__ */ jsx("input", { ...getInputProps() }),
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-center text-center items-center", children: [
-          /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center", children: [
             /* @__PURE__ */ jsx(
               HiOutlineCloudArrowUp,
               {
@@ -36,7 +36,7 @@ const Dropzone = ({
             /* @__PURE__ */ jsx("p", { className: "text-lg font-semibold", "data-testid": "select-dropzone", children: selectFileText })
           ] }),
           hasButton ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-centi", children: [
-            /* @__PURE__ */ jsx("p", { className: "text-sm text-secondary-medium", children: dropText }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-content-low", children: dropText }),
             isFileLimitReached ? /* @__PURE__ */ jsx(Tooltip, { text: "Voc\xEA s\xF3 pode selecionar um \xFAnico arquivo.", children: /* @__PURE__ */ jsx(
               "button",
               {

package/dist/esm/components/Uploader/Files.js

@@ -6,7 +6,7 @@ const Files = ({
   onDelete,
   uploadProgressText = "Upload(s) in progress"
 }) => {
-  return /* @__PURE__ */ jsxs("div", { className: "bg-white w-full border-2 p-deca flex flex-col overflow-y-auto rounded-mili h-[18rem]", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "bg-surface-overlay w-full border-2 p-deca flex flex-col overflow-y-auto rounded-mili h-[18rem]", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex gap-mili items-center mb-deca", children: [
       /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center w-deca h-deca bg-primary-medium rounded-full text-micro text-white", children: `${files.length}` }),
       /* @__PURE__ */ jsx("h2", { className: "text-md font-semibold", "data-testid": "upload-progress", children: uploadProgressText })

package/dist/esm/components/Uploader/Manager.js

@@ -45,7 +45,7 @@ const Manager = ({
                 children: min ? /* @__PURE__ */ jsx(IoChevronUp, {}) : /* @__PURE__ */ jsx(IoChevronDown, {})
               }
             ),
-            /* @__PURE__ */ jsx("h3", { "data-testid": "upload-progress", children: isLoading ? uploadProgressText : uploadSuccessText }),
+            /* @__PURE__ */ jsx("h3", { "data-testid": "upload-progress", className: "font-bold text-h4", children: isLoading ? uploadProgressText : uploadSuccessText }),
             /* @__PURE__ */ jsx(
               Button,
               {

package/dist/esm/components/Uploader/Modal.js

@@ -16,7 +16,7 @@ const Modal = ({
       {
         open,
         onClose,
-        className: "flex flex-col bg-secondary-xlight rounded-mili min-w-[70vw] max-w-[95vh] max-h-[95vh] overflow-auto",
+        className: "flex flex-col bg-surface-base rounded-mili min-w-[70vw] max-w-[95vh] max-h-[95vh] overflow-auto text-default",
         children: [
           /* @__PURE__ */ jsxs("div", { className: "flex w-full items-center justify-between mb-deca", children: [
             /* @__PURE__ */ jsx("h2", { className: "text-deca font-semibold ml-tera flex-1 text-center", children: title }),

package/dist/esm/styles/calendar-cell.js

@@ -2,7 +2,7 @@ import { tv } from 'tailwind-variants';
 
 const calendarCell = tv({
   slots: {
-    cell: "text-center rounded-mili text-black hover:bg-primary-light",
+    cell: "text-center rounded-mili hover:bg-primary-light",
     button: "flex aspect-square items-center justify-center"
   },
   variants: {
@@ -33,7 +33,7 @@ const calendarCell = tv({
     },
     isDisabled: {
       true: {
-        cell: "text-secondary-light cursor-default  hover:bg-white-500",
+        cell: "text-content-minimal cursor-default  hover:bg-surface-overlay",
         button: "cursor-default"
       }
     }

package/dist/esm/styles/date-picker-input-base.js

@@ -7,7 +7,7 @@ const datePickerInputBase = tv({
   variants: {
     disabled: {
       true: {
-        icon: "text-secondary-light cursor-default"
+        icon: "text-content-minimal cursor-default"
       }
     }
   }

package/dist/esm/styles/date-segment.js

@@ -2,12 +2,12 @@ import { tv } from 'tailwind-variants';
 
 const dateSegment = tv({
   slots: {
-    base: "focus:outline-none focus:bg-secondary-light"
+    base: "focus:outline-none focus:bg-content-minimal"
   },
   variants: {
     disabled: {
       true: {
-        base: "text-secondary-light"
+        base: "text-content-minimal"
       }
     }
   }

package/dist/esm/styles/groupButton.js

@@ -2,12 +2,12 @@ import { tv } from 'tailwind-variants';
 
 const groupButton = tv({
   slots: {
-    button: "border-[1px] border-secondary-medium px-centi py-mili items-center flex text-sub font-bold",
-    inactive: "bg-white text-secondary-medium disabled:bg-secondary-light",
+    button: "border-[1px] border-content-low px-centi py-mili items-center flex text-sub font-bold",
+    inactive: "bg-surface-overlay text-content-low disabled:bg-content-minimal",
     firstButton: "first:rounded-l-mili first:border-r-0",
     lastButton: "last:rounded-r-mili last:border-l-0",
     container: "flex flex-row h-[2rem]",
-    active: "text-white bg-secondary-medium"
+    active: "text-white bg-content-low"
   }
 });
 

package/dist/esm/styles/menubar.js

@@ -2,10 +2,10 @@ import { tv } from 'tailwind-variants';
 
 const menubar = tv({
   slots: {
-    header: "relative w-screen px-kilo py-deca flex flex-row md:justify-between bg-white z-header sm:justify-start",
+    header: "relative w-screen px-kilo py-deca flex flex-row md:justify-between bg-surface-overlay z-header sm:justify-start",
     left: "flex items-center w-fit",
     right: "flex items-center gap-x-deca hidden sm:flex",
-    dropdown: "w-full bg-white flex-1 shadow-default z-popover px-[8vw] absolute"
+    dropdown: "w-full bg-surface-overlay flex-1 shadow-default z-popover px-[8vw] absolute"
   },
   variants: {
     show: {
@@ -19,7 +19,7 @@ const menubar = tv({
 const mostUsed = tv({
   slots: {
     container: "mb-kilo",
-    label: "font-bold mb-centi",
+    label: "font-bold mb-centi text-default",
     containerList: "gap-x-kilo flex flex-row"
   }
 });
@@ -27,26 +27,26 @@ const mostUsedItem = tv({
   slots: {
     container: "flex-1 py-mili",
     title: "text-primary-medium font-bold text-base",
-    category: "text-secondary-medium text-label"
+    category: "text-content-low text-label"
   }
 });
 const item = tv({
   slots: {
-    container: "flex flex-row gap-x-deca items-center text-secondary-dark hover:cursor-pointer text-base",
+    container: "flex flex-row gap-x-deca items-center text-content-medium hover:cursor-pointer text-base",
     textBehavior: "hover:text-primary-medium",
     icon: "text-primary-medium hover:cursor-pointer"
   }
 });
 const category = tv({
   slots: {
-    text: "mb-mili font-bold",
-    hr: "mb-mili border-0 h-px bg-secondary-light",
+    text: "mb-mili font-bold text-default",
+    hr: "mb-mili border-0 h-px bg-content-high",
     container: "flex flex-col gap-y-mili"
   }
 });
 const subItem = tv({
   slots: {
-    container: "pl-deca text-sub border-l-[1px] border-primary-medium text-secondary-dark hover:text-primary-medium cursor-pointer"
+    container: "pl-deca text-sub border-l-[1px] border-primary-medium text-content-medium hover:text-primary-medium cursor-pointer"
   }
 });
 const animate = tv({

package/dist/esm/styles/progressBar.js

@@ -3,7 +3,7 @@ import { tv } from 'tailwind-variants';
 const ProgressVariants = tv({
   slots: {
     container: "relative",
-    bar: "h-1.5 w-full overflow-hidden bg-secondary-xlight",
+    bar: "h-1.5 w-full overflow-hidden bg-content-inverse",
     progress: "w-full h-full rounded-mili"
   },
   variants: {

package/dist/esm/styles/stepNodeVariants.js

@@ -28,8 +28,8 @@ const StepNodeVariants = tv({
         content: "font-bold"
       },
       false: {
-        content: "text-secondary-medium",
-        separator: "bg-secondary-light"
+        content: "text-content-low",
+        separator: "bg-content-minimal"
       }
     },
     selected: {

package/dist/esm/styles/time-field-input.js

@@ -7,7 +7,7 @@ const timePickerInputBase = tv({
   variants: {
     disabled: {
       true: {
-        icon: "text-secondary-light cursor-default"
+        icon: "text-content-minimal cursor-default"
       }
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tecsinapse/cortex-react",
-  "version": "1.16.0-beta.1",
+  "version": "1.16.0-beta.10",
   "description": "React components based in @tecsinapse/cortex-core",
   "license": "MIT",
   "main": "dist/esm/index.js",
@@ -20,7 +20,7 @@
   "dependencies": {
     "@floating-ui/react": "^0.26.18",
     "@internationalized/date": "3.7.0",
-    "@tecsinapse/cortex-core": "1.3.0-beta.1",
+    "@tecsinapse/cortex-core": "1.3.0-beta.10",
     "clsx": "2.1.1",
     "currency.js": "2.0.4",
     "embla-carousel-autoplay": "^8.0.0",
@@ -48,5 +48,5 @@
     "react-icons": ">=5.2.0",
     "tailwind": ">=3.3.0"
   },
-  "gitHead": "c976f6fea2c049735ce9fcacfc61583a552c10e1"
+  "gitHead": "67cc6fecd28f1c78c8542c70ffe87982b7b85e6a"
 }