npm - untitledui - Versions diffs - 0.1.3 → 0.1.4 - Mend

untitledui 0.1.3 → 0.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (52) hide show

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "untitledui",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "main": "dist/index.mjs",
   "description": "Untitled UI CLI",
   "type": "module",

package/templates/default/src/app/home-screen.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import { BadgeGroup } from "@/components/shared/badges/badge-groups";
 import Button from "@/components/shared/buttons/button";
 import { Form } from "@/components/shared/form/form";
 import { Input } from "@/components/shared/input";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import Spiral from "../../public/marketing/spirals.webp";
 const Header = dynamic(() => import("@/components/marketing/header-navigation/components/header").then((mod) => mod.Header));

package/templates/default/src/app/layout.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 import type { Metadata, Viewport } from "next";
 import { Inter } from "next/font/google";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import { Theme } from "@/providers/theme";
 import "@/styles/globals.css";
@@ -26,7 +26,7 @@ export default function RootLayout({
 }>) {
     return (
         <html lang="en" suppressHydrationWarning>
-            <body className={cx(inter.variable, "light-mode bg-primary antialiased dark:dark-mode")}>
+            <body className={cx(inter.variable, "light-mode dark:dark-mode bg-primary antialiased")}>
                 <Theme>{children}</Theme>
             </body>
         </html>

package/templates/default/src/components/foundations/featured-icon/featured-icons.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 import type { FC, ReactNode, Ref } from "react";
 import { isValidElement } from "react";
-import { cx, sortCx } from "@/components/utils";
+import { cx, sortCx } from "@/components/utils/cx";
 import { isReactComponent } from "@/components/utils/isReactComponent";
 const iconsSizes = {

package/templates/default/src/components/marketing/header-navigation/base-components/nav-menu-item.tsx CHANGED Viewed

@@ -1,7 +1,7 @@
 "use client";
 import { type FC, type ReactNode, isValidElement } from "react";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import { isReactComponent } from "@/components/utils/isReactComponent";
 interface NavMenuItemLinkProps {

package/templates/default/src/components/marketing/header-navigation/components/header.tsx CHANGED Viewed

@@ -7,7 +7,7 @@ import { Button as AriaButton, Dialog, DialogTrigger, Popover } from "react-aria
 import UntitledLogo from "@/components/foundations/logo/UntitledLogo";
 import UntitledLogoMinimal from "@/components/foundations/logo/UntitledLogoMinimal";
 import Button from "@/components/shared/buttons/button";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import { DropdownMenuSimple } from "../dropdown-header-navigation";
 type HeaderNavItem = {

package/templates/default/src/components/shared/avatar/avatar-label-group.tsx CHANGED Viewed

@@ -1,7 +1,7 @@
 "use client";
 import { type ReactNode } from "react";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import Avatar, { type AvatarProps } from "./avatar";
 const styles = {

package/templates/default/src/components/shared/avatar/avatar-profile-photo.tsx CHANGED Viewed

@@ -2,7 +2,7 @@
 import { useState } from "react";
 import { User01 } from "@untitledui/icons";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import { type AvatarProps } from "./avatar";
 import { AvatarOnlineIndicator, VerifiedTick } from "./base-components";

package/templates/default/src/components/shared/avatar/avatar.tsx CHANGED Viewed

@@ -2,7 +2,7 @@
 import { type FC, type ReactNode, useState } from "react";
 import { User01 } from "@untitledui/icons";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import { AvatarOnlineIndicator, VerifiedTick } from "./base-components";
 type AvatarSize = "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";

package/templates/default/src/components/shared/avatar/base-components/avatar-add-button.tsx CHANGED Viewed

@@ -2,7 +2,7 @@
 import { Plus } from "@untitledui/icons";
 import type { ButtonProps } from "react-aria-components";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import { Tooltip, TooltipTrigger } from "../../tooltips/tooltips";
 const sizes = {

package/templates/default/src/components/shared/avatar/base-components/avatar-company-icon.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 "use client";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 const sizes = {
     xs: "size-2",

package/templates/default/src/components/shared/avatar/base-components/avatar-online-indicator.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 "use client";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 const sizes = {
     xs: "size-1.5",

package/templates/default/src/components/shared/avatar/base-components/verified-tick.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 "use client";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 const sizes = {
     xs: { root: "size-2.5", tick: "size-[4.38px" },

package/templates/default/src/components/shared/badges/badge-groups.tsx CHANGED Viewed

@@ -3,7 +3,7 @@
 import type { FC, ReactNode } from "react";
 import { isValidElement } from "react";
 import { ArrowRight } from "@untitledui/icons";
-import { cx, sortCx } from "@/components/utils";
+import { cx, sortCx } from "@/components/utils/cx";
 import { isReactComponent } from "@/components/utils/isReactComponent";
 type Size = "md" | "lg";

package/templates/default/src/components/shared/badges/badges.tsx CHANGED Viewed

@@ -3,7 +3,7 @@
 import type { MouseEventHandler, ReactNode } from "react";
 import { X as CloseX } from "@untitledui/icons";
 import Dot from "@/components/foundations/dot-icon";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import type { BadgeColors, BadgeTypeToColorMap, BadgeTypes, FlagTypes, IconComponentType, Sizes } from "./badge-types";
 import { badgeTypes } from "./badge-types";

package/templates/default/src/components/shared/button-group/button-group.tsx CHANGED Viewed

@@ -2,7 +2,7 @@
 import { type FC, type PropsWithChildren, type ReactNode, type RefAttributes, createContext, isValidElement, useContext } from "react";
 import { ToggleButton, ToggleButtonGroup, type ToggleButtonGroupProps, type ToggleButtonProps } from "react-aria-components";
-import { cx, sortCx } from "@/components/utils";
+import { cx, sortCx } from "@/components/utils/cx";
 import { isReactComponent } from "@/components/utils/isReactComponent";
 export const styles = sortCx({

package/templates/default/src/components/shared/buttons/app-store-buttons-outline.tsx CHANGED Viewed

@@ -1,7 +1,7 @@
 "use client";
 import type { AnchorHTMLAttributes } from "react";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 export const GooglePlayButton = ({ size = "md", ...props }: AnchorHTMLAttributes<HTMLAnchorElement> & { size?: "md" | "lg" }) => {
     return (

package/templates/default/src/components/shared/buttons/app-store-buttons.tsx CHANGED Viewed

@@ -1,7 +1,7 @@
 "use client";
 import type { AnchorHTMLAttributes } from "react";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 export const GooglePlayButton = ({ size = "md", ...props }: AnchorHTMLAttributes<HTMLAnchorElement> & { size?: "md" | "lg" }) => {
     return (

package/templates/default/src/components/shared/buttons/button-utility.tsx CHANGED Viewed

@@ -4,7 +4,7 @@ import type { DetailedHTMLProps, FC, HTMLAttributes, ReactNode } from "react";
 import React, { isValidElement } from "react";
 import type { ButtonProps as AriaButtonProps } from "react-aria-components";
 import { Button as AriaButton } from "react-aria-components";
-import { cx, sortCx } from "@/components/utils";
+import { cx, sortCx } from "@/components/utils/cx";
 import { isReactComponent } from "@/components/utils/isReactComponent";
 import { Tooltip } from "../tooltips/tooltips";

package/templates/default/src/components/shared/buttons/button.tsx CHANGED Viewed

@@ -5,7 +5,7 @@ import React, { isValidElement } from "react";
 import Link from "next/link";
 import type { ButtonProps as AriaButtonProps, PressEvent } from "react-aria-components";
 import { Button as AriaButton } from "react-aria-components";
-import { cx, sortCx } from "@/components/utils";
+import { cx, sortCx } from "@/components/utils/cx";
 import { isReactComponent } from "@/components/utils/isReactComponent";
 export const styles = sortCx({

package/templates/default/src/components/shared/buttons/close-button.tsx CHANGED Viewed

@@ -2,7 +2,7 @@
 import type { HTMLAttributes } from "react";
 import { X as CloseIcon } from "@untitledui/icons";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 const sizes = {
     sm: { root: "size-9", icon: "size-5" },

package/templates/default/src/components/shared/buttons/social-button.tsx CHANGED Viewed

@@ -4,7 +4,7 @@ import type { AnchorHTMLAttributes, ButtonHTMLAttributes, DetailedHTMLProps } fr
 import React from "react";
 import type { ButtonProps as AriaButtonProps } from "react-aria-components";
 import { Button as AriaButton } from "react-aria-components";
-import { cx, sortCx } from "@/components/utils";
+import { cx, sortCx } from "@/components/utils/cx";
 import { AppleLogo, DribbleLogo, FacebookLogo, FigmaLogo, FigmaLogoOutlined, GoogleLogo, TwitterLogo } from "./social-logos";
 export const styles = sortCx({

package/templates/default/src/components/shared/checkbox/checkbox.tsx CHANGED Viewed

@@ -2,7 +2,7 @@
 import type { ReactNode, Ref } from "react";
 import { Checkbox as AriaCheckbox, type CheckboxProps as AriaCheckboxProps } from "react-aria-components";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 export interface CheckboxBaseProps {
     size?: "sm" | "md";

package/templates/default/src/components/shared/dropdown/dropdown.tsx CHANGED Viewed

@@ -10,7 +10,7 @@ import type {
     SeparatorProps,
 } from "react-aria-components";
 import { Button as AriaButton, Header, Menu, MenuItem, MenuSection, MenuTrigger, Popover, Separator } from "react-aria-components";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface DropdownItemProps extends MenuItemProps {
     /** The label of the item to be displayed. */

package/templates/default/src/components/shared/input/hint-text.tsx CHANGED Viewed

@@ -3,7 +3,7 @@
 import type { ReactNode, Ref } from "react";
 import type { TextProps as AriaTextProps } from "react-aria-components";
 import { Text as AriaText } from "react-aria-components";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface HintTextProps extends AriaTextProps {
     children: ReactNode;

package/templates/default/src/components/shared/input/index.tsx CHANGED Viewed

@@ -7,7 +7,7 @@ import { Input as AriaInput, TextField as AriaTextField, Group } from "react-ari
 import HintText from "@/components/shared/input/hint-text";
 import Label from "@/components/shared/input/label";
 import { Tooltip, TooltipTrigger } from "@/components/shared/tooltips/tooltips";
-import { cx, sortCx } from "@/components/utils";
+import { cx, sortCx } from "@/components/utils/cx";
 export interface InputBaseProps extends TextFieldProps {
     label?: string;

package/templates/default/src/components/shared/input/input-payment.tsx CHANGED Viewed

@@ -7,7 +7,7 @@ import type { InputBaseProps } from "@/components/shared/input";
 import { InputBase } from "@/components/shared/input";
 import HintText from "@/components/shared/input/hint-text";
 import Label from "@/components/shared/input/label";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 const cardTypes = [
     {

package/templates/default/src/components/shared/input/input-with-button.tsx CHANGED Viewed

@@ -10,7 +10,7 @@ import type { InputBaseProps } from "@/components/shared/input";
 import { InputBase } from "@/components/shared/input";
 import HintText from "@/components/shared/input/hint-text";
 import Label from "@/components/shared/input/label";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface InputWithButtonProps extends Omit<InputBaseProps, "icon"> {
     buttonText: string;

package/templates/default/src/components/shared/input/input-with-dropdown.tsx CHANGED Viewed

@@ -8,7 +8,7 @@ import type { InputBaseProps } from "@/components/shared/input";
 import { InputBase } from "@/components/shared/input";
 import HintText from "@/components/shared/input/hint-text";
 import Label from "@/components/shared/input/label";
-import { cx, sortCx } from "@/components/utils";
+import { cx, sortCx } from "@/components/utils/cx";
 interface SelectorComponentProps {
     size: "sm" | "md";

package/templates/default/src/components/shared/input/input-with-prefix.tsx CHANGED Viewed

@@ -5,7 +5,7 @@ import type { InputBaseProps } from "@/components/shared/input";
 import { InputBase, TextField } from "@/components/shared/input";
 import HintText from "@/components/shared/input/hint-text";
 import Label from "@/components/shared/input/label";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface InputPrefixProps extends HTMLAttributes<HTMLDivElement> {
     position?: "leading" | "trailing";

package/templates/default/src/components/shared/input/label.tsx CHANGED Viewed

@@ -5,7 +5,7 @@ import { HelpCircle } from "@untitledui/icons";
 import type { LabelProps as AriaLabelProps } from "react-aria-components";
 import { Label as AriaLabel } from "react-aria-components";
 import { Tooltip, TooltipTrigger } from "@/components/shared/tooltips/tooltips";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface LabelProps extends AriaLabelProps {
     children: ReactNode;

package/templates/default/src/components/shared/progress-indicators/progress-circles.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 "use client";
-import { cx as clx, sortCx } from "@/components/utils";
+import { cx as clx, sortCx } from "@/components/utils/cx";
 interface ProgressBarProps {
     value: number;

package/templates/default/src/components/shared/progress-indicators/progress-indicators.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 "use client";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 export interface ProgressBarProps {
     value: number;
@@ -61,7 +61,7 @@ export const ProgressBarTextTopFloating = ({ value, min = 0, max = 100, valueFor
             <ProgressBar min={min} max={max} value={value} />
             <div
                 style={{ left: `${percentage}%` }}
-                className="absolute -top-2 -translate-x-1/2 -translate-y-full rounded-lg bg-primary_alt px-3 py-2 ring-1 shadow-lg ring-border-secondary_alt"
+                className="absolute -top-2 -translate-x-1/2 -translate-y-full rounded-lg bg-primary_alt px-3 py-2 shadow-lg ring-1 ring-border-secondary_alt"
             >
                 <div className="tt-xs-semi text-secondary tabular-nums">{valueFormatter ? valueFormatter(value, percentage) : `${percentage}%`}</div>
             </div>
@@ -77,7 +77,7 @@ export const ProgressBarTextBottomFloating = ({ value, min = 0, max = 100, value
             <ProgressBar min={min} max={max} value={value} />
             <div
                 style={{ left: `${percentage}%` }}
-                className="absolute -bottom-2 -translate-x-1/2 translate-y-full rounded-lg bg-primary_alt px-3 py-2 ring-1 shadow-lg ring-border-secondary_alt"
+                className="absolute -bottom-2 -translate-x-1/2 translate-y-full rounded-lg bg-primary_alt px-3 py-2 shadow-lg ring-1 ring-border-secondary_alt"
             >
                 <div className="tt-xs-semi text-secondary">{valueFormatter ? valueFormatter(value, percentage) : `${percentage}%`}</div>
             </div>

package/templates/default/src/components/shared/radio-buttons/radio-buttons.tsx CHANGED Viewed

@@ -3,7 +3,7 @@
 import { type ReactNode, type Ref, createContext, useContext } from "react";
 import type { RadioGroupProps as AriaRadioGroupProps } from "react-aria-components";
 import { type RadioProps as AriaRadioProps, Radio, RadioGroup } from "react-aria-components";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 export interface RadioButtonGroupContextType {
     size?: "sm" | "md";

package/templates/default/src/components/shared/radio-groups/radio-group-avatar.tsx CHANGED Viewed

@@ -4,7 +4,7 @@ import type { RadioGroupProps } from "react-aria-components";
 import { Label, Radio, RadioGroup, Text } from "react-aria-components";
 import AvatarComponent from "@/components/shared/avatar/avatar";
 import { CheckboxBase } from "@/components/shared/checkbox/checkbox";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface AvatarItemType {
     id: string;

package/templates/default/src/components/shared/radio-groups/radio-group-checkbox.tsx CHANGED Viewed

@@ -4,7 +4,7 @@ import type { FC } from "react";
 import type { RadioGroupProps } from "react-aria-components";
 import { Label, Radio, RadioGroup, Text } from "react-aria-components";
 import { CheckboxBase } from "@/components/shared/checkbox/checkbox";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 type RadioGroupItemType = {
     value: string;

package/templates/default/src/components/shared/radio-groups/radio-group-icon-card.tsx CHANGED Viewed

@@ -6,7 +6,7 @@ import { Radio, RadioGroup } from "react-aria-components";
 import { FeaturedIcon } from "@/components/foundations/featured-icon/featured-icons";
 import { BadgeWithDot } from "@/components/shared/badges/badges";
 import { CheckboxBase } from "@/components/shared/checkbox/checkbox";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 type IconCardItemType = {
     value: string;

package/templates/default/src/components/shared/radio-groups/radio-group-icon-simple.tsx CHANGED Viewed

@@ -5,7 +5,7 @@ import type { RadioGroupProps } from "react-aria-components";
 import { Label, Radio, RadioGroup, Text } from "react-aria-components";
 import { FeaturedIcon } from "@/components/foundations/featured-icon/featured-icons";
 import { CheckboxBase } from "@/components/shared/checkbox/checkbox";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 type RadioGroupItemType = {
     value: string;

package/templates/default/src/components/shared/radio-groups/radio-group-payment-icon.tsx CHANGED Viewed

@@ -5,7 +5,7 @@ import type { RadioGroupProps } from "react-aria-components";
 import { Label, Radio, RadioGroup, Text } from "react-aria-components";
 import Button from "@/components/shared/buttons/button";
 import { CheckboxBase } from "@/components/shared/checkbox/checkbox";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface PaymentCardItemType {
     value: string;

package/templates/default/src/components/shared/radio-groups/radio-group-radio-button.tsx CHANGED Viewed

@@ -3,7 +3,7 @@
 import type { FC } from "react";
 import type { RadioGroupProps } from "react-aria-components";
 import { Label, Radio, RadioGroup, Text } from "react-aria-components";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 type RadioGroupItemType = {
     value: string;

package/templates/default/src/components/shared/select/combobox.tsx CHANGED Viewed

@@ -13,7 +13,7 @@ import {
     ComboBoxStateContext,
 } from "react-aria-components";
 import { useHotkeys } from "react-hotkeys-hook";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import { useResizeObserver } from "@/hooks/use-resize-observer";
 import HintText from "../input/hint-text";
 import Label from "../input/label";

package/templates/default/src/components/shared/select/multi-select.tsx CHANGED Viewed

@@ -16,7 +16,7 @@ import {
 import { useHotkeys } from "react-hotkeys-hook";
 import type { ListData } from "react-stately";
 import { useListData } from "react-stately";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import { useResizeObserver } from "@/hooks/use-resize-observer";
 import Avatar from "../avatar/avatar";
 import type { IconComponentType } from "../badges/badge-types";

package/templates/default/src/components/shared/select/popover.tsx CHANGED Viewed

@@ -3,7 +3,7 @@
 import type { RefAttributes } from "react";
 import type { PopoverProps as AriaPopoverProps } from "react-aria-components";
 import { Popover as AriaPopover } from "react-aria-components";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface PopoverProps extends AriaPopoverProps, RefAttributes<HTMLElement> {
     size: "sm" | "md";

package/templates/default/src/components/shared/select/select-item.tsx CHANGED Viewed

@@ -5,7 +5,7 @@ import { Check } from "@untitledui/icons";
 import type { ListBoxItemProps as AriaListBoxItemProps } from "react-aria-components";
 import { ListBoxItem as AriaListBoxItem, Text } from "react-aria-components";
 import Avatar from "@/components/shared/avatar/avatar";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import type { SelectItemType } from "./select";
 import { SelectContext } from "./select";

package/templates/default/src/components/shared/select/select.tsx CHANGED Viewed

@@ -9,7 +9,7 @@ import Avatar from "@/components/shared/avatar/avatar";
 import type { IconComponentType } from "@/components/shared/badges/badge-types";
 import HintText from "@/components/shared/input/hint-text";
 import Label from "@/components/shared/input/label";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import { ComboBox } from "./combobox";
 import { Popover } from "./popover";
 import Item from "./select-item";

package/templates/default/src/components/shared/slider/slider.tsx CHANGED Viewed

@@ -2,13 +2,13 @@
 import type { SliderProps as AriaSliderProps } from "react-aria-components";
 import { Slider as AriaSlider, Label, SliderOutput, SliderThumb, SliderTrack } from "react-aria-components";
-import { cx, sortCx } from "@/components/utils";
+import { cx, sortCx } from "@/components/utils/cx";
 const styles = sortCx({
     default: "hidden",
     bottom: "absolute top-2 left-1/2 -translate-x-1/2 translate-y-full text-md leading-md font-medium text-primary",
     "top-floating":
-        "absolute -top-2 left-1/2 -translate-x-1/2 -translate-y-full rounded-lg bg-primary px-3 py-2 text-xs leading-xs font-semibold text-secondary ring-1 shadow-lg ring-border-secondary_alt",
+        "absolute -top-2 left-1/2 -translate-x-1/2 -translate-y-full rounded-lg bg-primary px-3 py-2 text-xs leading-xs font-semibold text-secondary shadow-lg ring-1 ring-border-secondary_alt",
 });
 interface SliderProps extends AriaSliderProps {
@@ -55,7 +55,7 @@ export const Slider = ({
                                         index={index}
                                         className={({ isFocusVisible, isDragging }) =>
                                             cx(
-                                                "absolute top-1/2 z-50 box-border size-6 cursor-grab rounded-full bg-slider-handle-bg ring-2 shadow-md ring-slider-handle-border ring-inset",
+                                                "absolute top-1/2 z-50 box-border size-6 cursor-grab rounded-full bg-slider-handle-bg shadow-md ring-2 ring-slider-handle-border ring-inset",
                                                 isFocusVisible && "outline-2 outline-offset-2 outline-focus-ring",
                                                 isDragging && "cursor-grabbing",
                                             )

package/templates/default/src/components/shared/tags/base-components/tag-checkbox.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 "use client";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface TagCheckboxProps {
     size?: "sm" | "md" | "lg";

package/templates/default/src/components/shared/tags/base-components/tag-close-x.tsx CHANGED Viewed

@@ -3,7 +3,7 @@
 import type { RefAttributes } from "react";
 import { XClose } from "@untitledui/icons";
 import { Button as AriaButton, type ButtonProps } from "react-aria-components";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface TagCloseXProps extends ButtonProps, RefAttributes<HTMLButtonElement> {
     size?: "sm" | "md" | "lg";

package/templates/default/src/components/shared/tags/tags.tsx CHANGED Viewed

@@ -9,7 +9,7 @@ import {
     type TagProps as AriaTagProps,
 } from "react-aria-components";
 import Dot from "@/components/foundations/dot-icon";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import Avatar from "../avatar/avatar";
 import TagCheckbox from "./base-components/tag-checkbox";
 import { TagCloseX } from "./base-components/tag-close-x";

package/templates/default/src/components/shared/textarea/textarea.tsx CHANGED Viewed

@@ -6,7 +6,7 @@ import type { TextAreaProps as AriaTextAreaProps, TextFieldProps as AriaTextFiel
 import { TextArea as AriaTextArea } from "react-aria-components";
 import HintText from "@/components/shared/input/hint-text";
 import Label from "@/components/shared/input/label";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 import { TextField } from "../input";
 interface TextAreaBaseProps extends AriaTextAreaProps {

package/templates/default/src/components/shared/toggle/toggle.tsx CHANGED Viewed

@@ -3,7 +3,7 @@
 import type { ReactNode } from "react";
 import type { SwitchProps } from "react-aria-components";
 import { Switch } from "react-aria-components";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 interface ToggleBaseProps {
     size?: "sm" | "md";

package/templates/default/src/components/shared/tooltips/tooltips.tsx CHANGED Viewed

@@ -7,7 +7,7 @@ import type { FocusableElement } from "@react-types/shared";
 import { mergeProps, useFocusable } from "react-aria";
 import { Tooltip as AriaTooltip, TooltipTrigger as AriaTooltipTrigger, Button, OverlayArrow } from "react-aria-components";
 import type { TooltipProps as AriaTooltipProps, ButtonProps, TooltipTriggerComponentProps } from "react-aria-components";
-import { cx } from "@/components/utils";
+import { cx } from "@/components/utils/cx";
 const padding: Partial<Record<Placement, string>> = {
     "top left": "px-2.5",