@seed-design/react 1.1.16 → 1.1.17

package/lib/components/Checkbox/Checkbox.cjs

@@ -25,6 +25,11 @@ const {
 const withStateProps = createWithStateProps.createWithStateProps([reactCheckbox.useCheckboxContext]);
 const CheckboxRoot = Object.assign(
   React.forwardRef(({ className, ...props }, ref) => {
+    if (process.env.NODE_ENV !== "production" && (props.weight === "default" || props.weight === "stronger")) {
+      console.warn(
+        `[SEED Design System] Checkbox weight='${props.weight}' is deprecated and will be removed in @seed-design/react@1.3.0. Use weight='${props.weight === "default" ? "regular" : "bold"}' instead.`
+      );
+    }
     const [{ checkbox: checkboxVariantProps, checkmark: checkmarkVariantProps }, otherProps] = splitMultipleVariantsProps.splitMultipleVariantsProps(
       {
         ...props,

package/lib/components/Checkbox/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,KAAK,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AACxF,OAAO,EAAa,KAAK,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAG3F,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAsB,MAAM,6BAA6B,CAAC;AAChG,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAiB9E;;GAEG;AACH,KAAK,oCAAoC,GAAG,SAAS,GAAG,UAAU,CAAC;AAEnE,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,oBAAoB,EAAE,QAAQ,CAAC,EAC1C,qBAAqB,EACrB,iBAAiB,CAAC,SAAS;IAC7B,MAAM,CAAC,EAAE,oBAAoB,CAAC,QAAQ,CAAC,GAAG,oCAAoC,CAAC;CAChF;AAED,eAAO,MAAM,YAAY;;CAkCxB,CAAC;AAIF;;;GAGG;AAEH,MAAM,WAAW,oBACf,SAAQ,qBAAqB,EAC3B,iBAAiB,CAAC,YAAY;CAAG;AAErC,eAAO,MAAM,eAAe,iHAG3B,CAAC;AAIF,MAAM,WAAW,sBAAuB,SAAQ,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC;IAChF;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACjC;AAED,eAAO,MAAM,iBAAiB,kHA8B7B,CAAC;AAKF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAEpG,eAAO,MAAM,aAAa,+GAGzB,CAAC;AAIF,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB,CAAC,gBAAgB;CAAG;AAEvF,eAAO,MAAM,mBAAmB,iIAAgC,CAAC"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,KAAK,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AACxF,OAAO,EAAa,KAAK,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAG3F,OAAO,EAAE,QAAQ,IAAI,iBAAiB,EAAsB,MAAM,6BAA6B,CAAC;AAChG,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAiB9E;;GAEG;AACH,KAAK,oCAAoC,GAAG,SAAS,GAAG,UAAU,CAAC;AAEnE,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,oBAAoB,EAAE,QAAQ,CAAC,EAC1C,qBAAqB,EACrB,iBAAiB,CAAC,SAAS;IAC7B,MAAM,CAAC,EAAE,oBAAoB,CAAC,QAAQ,CAAC,GAAG,oCAAoC,CAAC;CAChF;AAED,eAAO,MAAM,YAAY;;CA2CxB,CAAC;AAIF;;;GAGG;AAEH,MAAM,WAAW,oBACf,SAAQ,qBAAqB,EAC3B,iBAAiB,CAAC,YAAY;CAAG;AAErC,eAAO,MAAM,eAAe,iHAG3B,CAAC;AAIF,MAAM,WAAW,sBAAuB,SAAQ,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC;IAChF;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACjC;AAED,eAAO,MAAM,iBAAiB,kHA8B7B,CAAC;AAKF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAEpG,eAAO,MAAM,aAAa,+GAGzB,CAAC;AAIF,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB,CAAC,gBAAgB;CAAG;AAEvF,eAAO,MAAM,mBAAmB,iIAAgC,CAAC"}

package/lib/components/Checkbox/Checkbox.js

@@ -21,6 +21,11 @@ const {
 const withStateProps = createWithStateProps([useCheckboxContext]);
 const CheckboxRoot = Object.assign(
   forwardRef(({ className, ...props }, ref) => {
+    if (process.env.NODE_ENV !== "production" && (props.weight === "default" || props.weight === "stronger")) {
+      console.warn(
+        `[SEED Design System] Checkbox weight='${props.weight}' is deprecated and will be removed in @seed-design/react@1.3.0. Use weight='${props.weight === "default" ? "regular" : "bold"}' instead.`
+      );
+    }
     const [{ checkbox: checkboxVariantProps, checkmark: checkmarkVariantProps }, otherProps] = splitMultipleVariantsProps(
       {
         ...props,

package/lib/components/ChipTabs/ChipTabs.cjs

@@ -3,15 +3,34 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
+const jsxRuntime = require('react/jsx-runtime');
 const chipTabs = require('@seed-design/css/recipes/chip-tabs');
 const reactTabs = require('@seed-design/react-tabs');
 const createSlotRecipeContext = require('../../utils/createSlotRecipeContext.cjs');
+const React = require('react');
+const clsx = require('clsx');
 
-const { withProvider, withContext } = createSlotRecipeContext.createSlotRecipeContext(chipTabs.chipTabs);
-const ChipTabsRoot = withProvider(
-  reactTabs.Tabs.Root,
-  "root"
+const { ClassNamesProvider, withContext } = createSlotRecipeContext.createSlotRecipeContext(chipTabs.chipTabs);
+const ChipTabsRoot = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    if (process.env.NODE_ENV !== "production" && props.variant === "brandSolid") {
+      console.warn(
+        "[SEED Design System] ChipTabs variant='brandSolid' is deprecated and will be removed in @seed-design/react@1.3.0. Use variant='neutralSolid' or variant='neutralOutline' instead."
+      );
+    }
+    const [variantProps, otherProps] = chipTabs.chipTabs.splitVariantProps(props);
+    const classNames = chipTabs.chipTabs(variantProps);
+    return /* @__PURE__ */ jsxRuntime.jsx(ClassNamesProvider, { value: classNames, children: /* @__PURE__ */ jsxRuntime.jsx(
+      reactTabs.Tabs.Root,
+      {
+        ref,
+        className: clsx(classNames.root, className),
+        ...otherProps
+      }
+    ) });
+  }
 );
+ChipTabsRoot.displayName = "ChipTabsRoot";
 const ChipTabsList = withContext(
   reactTabs.Tabs.List,
   "list"

package/lib/components/ChipTabs/ChipTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChipTabs.d.ts","sourceRoot":"","sources":["../../../src/components/ChipTabs/ChipTabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,KAAK,oBAAoB,EAAE,MAAM,oCAAoC,CAAC;AACzF,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAOhE,MAAM,WAAW,iBAAkB,SAAQ,oBAAoB,EAAE,aAAa,CAAC,SAAS;CAAG;AAE3F,eAAO,MAAM,YAAY,8GAGxB,CAAC;AAIF,MAAM,WAAW,iBAAkB,SAAQ,aAAa,CAAC,SAAS;CAAG;AAErE,eAAO,MAAM,YAAY,8GAGxB,CAAC;AAIF,MAAM,WAAW,oBAAqB,SAAQ,aAAa,CAAC,YAAY;CAAG;AAE3E,eAAO,MAAM,eAAe,oHAG3B,CAAC;AAIF,MAAM,WAAW,oBAAqB,SAAQ,aAAa,CAAC,YAAY;CAAG;AAE3E,eAAO,MAAM,eAAe,kHAG3B,CAAC;AAIF,MAAM,WAAW,qBAAsB,SAAQ,aAAa,CAAC,aAAa;CAAG;AAE7E,eAAO,MAAM,gBAAgB,kHAG5B,CAAC;AAIF,MAAM,WAAW,2BAA4B,SAAQ,aAAa,CAAC,mBAAmB;CAAG;AAEzF,eAAO,MAAM,sBAAsB,wHAGlC,CAAC"}
+{"version":3,"file":"ChipTabs.d.ts","sourceRoot":"","sources":["../../../src/components/ChipTabs/ChipTabs.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAY,KAAK,oBAAoB,EAAE,MAAM,oCAAoC,CAAC;AACzF,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAShE,MAAM,WAAW,iBAAkB,SAAQ,oBAAoB,EAAE,aAAa,CAAC,SAAS;CAAG;AAE3F,eAAO,MAAM,YAAY,8GAqBxB,CAAC;AAKF,MAAM,WAAW,iBAAkB,SAAQ,aAAa,CAAC,SAAS;CAAG;AAErE,eAAO,MAAM,YAAY,8GAGxB,CAAC;AAIF,MAAM,WAAW,oBAAqB,SAAQ,aAAa,CAAC,YAAY;CAAG;AAE3E,eAAO,MAAM,eAAe,oHAG3B,CAAC;AAIF,MAAM,WAAW,oBAAqB,SAAQ,aAAa,CAAC,YAAY;CAAG;AAE3E,eAAO,MAAM,eAAe,kHAG3B,CAAC;AAIF,MAAM,WAAW,qBAAsB,SAAQ,aAAa,CAAC,aAAa;CAAG;AAE7E,eAAO,MAAM,gBAAgB,kHAG5B,CAAC;AAIF,MAAM,WAAW,2BAA4B,SAAQ,aAAa,CAAC,mBAAmB;CAAG;AAEzF,eAAO,MAAM,sBAAsB,wHAGlC,CAAC"}

package/lib/components/ChipTabs/ChipTabs.js

@@ -1,13 +1,32 @@
 'use client';
+import { jsx } from 'react/jsx-runtime';
 import { chipTabs } from '@seed-design/css/recipes/chip-tabs';
 import { Tabs } from '@seed-design/react-tabs';
 import { createSlotRecipeContext } from '../../utils/createSlotRecipeContext.js';
+import { forwardRef } from 'react';
+import clsx from 'clsx';
 
-const { withProvider, withContext } = createSlotRecipeContext(chipTabs);
-const ChipTabsRoot = withProvider(
-  Tabs.Root,
-  "root"
+const { ClassNamesProvider, withContext } = createSlotRecipeContext(chipTabs);
+const ChipTabsRoot = forwardRef(
+  ({ className, ...props }, ref) => {
+    if (process.env.NODE_ENV !== "production" && props.variant === "brandSolid") {
+      console.warn(
+        "[SEED Design System] ChipTabs variant='brandSolid' is deprecated and will be removed in @seed-design/react@1.3.0. Use variant='neutralSolid' or variant='neutralOutline' instead."
+      );
+    }
+    const [variantProps, otherProps] = chipTabs.splitVariantProps(props);
+    const classNames = chipTabs(variantProps);
+    return /* @__PURE__ */ jsx(ClassNamesProvider, { value: classNames, children: /* @__PURE__ */ jsx(
+      Tabs.Root,
+      {
+        ref,
+        className: clsx(classNames.root, className),
+        ...otherProps
+      }
+    ) });
+  }
 );
+ChipTabsRoot.displayName = "ChipTabsRoot";
 const ChipTabsList = withContext(
   Tabs.List,
   "list"

package/lib/components/Switch/Switch.cjs

@@ -23,6 +23,11 @@ const {
 const withStateProps = createWithStateProps.createWithStateProps([reactSwitch.useSwitchContext]);
 const SwitchRoot = React.forwardRef(
   ({ className, ...props }, ref) => {
+    if (process.env.NODE_ENV !== "production" && (props.size === "small" || props.size === "medium")) {
+      console.warn(
+        `[SEED Design System] Switch size='${props.size}' is deprecated and will be removed in @seed-design/react@1.3.0. Use size='${props.size === "small" ? "16" : "32"}' instead.`
+      );
+    }
     const [{ switch: switchVariantProps, switchMark: switchMarkVariantProps }, otherProps] = splitMultipleVariantsProps.splitMultipleVariantsProps(
       {
         ...props,

package/lib/components/Switch/Switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAoB,MAAM,2BAA2B,CAAC;AACxF,OAAO,EAAe,KAAK,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AACvF,OAAO,EAAc,KAAK,sBAAsB,EAAE,MAAM,sCAAsC,CAAC;AAE/F,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAE9E,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B;;GAEG;AACH,KAAK,gCAAgC,GAAG,OAAO,GAAG,QAAQ,CAAC;AAE3D,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC,EACtC,IAAI,CAAC,sBAAsB,EAAE,MAAM,CAAC,EACpC,eAAe,CAAC,SAAS;IAC3B,IAAI,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,GAAG,gCAAgC,CAAC;CACtE;AAED,eAAO,MAAM,UAAU,0FA0BtB,CAAC;AAKF,MAAM,WAAW,kBAAmB,SAAQ,sBAAsB,EAAE,eAAe,CAAC,YAAY;CAAG;AAEnG,eAAO,MAAM,aAAa,2FAGzB,CAAC;AAIF,MAAM,WAAW,gBAAiB,SAAQ,eAAe,CAAC,UAAU;CAAG;AAEvE,eAAO,MAAM,WAAW,yFAGvB,CAAC;AAIF,MAAM,WAAW,gBAAiB,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAElG,eAAO,MAAM,WAAW,0FAGvB,CAAC;AAIF,MAAM,WAAW,sBAAuB,SAAQ,eAAe,CAAC,gBAAgB;CAAG;AAEnF,eAAO,MAAM,iBAAiB,2GAA8B,CAAC"}
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/components/Switch/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAoB,MAAM,2BAA2B,CAAC;AACxF,OAAO,EAAe,KAAK,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AACvF,OAAO,EAAc,KAAK,sBAAsB,EAAE,MAAM,sCAAsC,CAAC;AAE/F,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAE9E,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B;;GAEG;AACH,KAAK,gCAAgC,GAAG,OAAO,GAAG,QAAQ,CAAC;AAE3D,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC,EACtC,IAAI,CAAC,sBAAsB,EAAE,MAAM,CAAC,EACpC,eAAe,CAAC,SAAS;IAC3B,IAAI,CAAC,EAAE,kBAAkB,CAAC,MAAM,CAAC,GAAG,gCAAgC,CAAC;CACtE;AAED,eAAO,MAAM,UAAU,0FAmCtB,CAAC;AAKF,MAAM,WAAW,kBAAmB,SAAQ,sBAAsB,EAAE,eAAe,CAAC,YAAY;CAAG;AAEnG,eAAO,MAAM,aAAa,2FAGzB,CAAC;AAIF,MAAM,WAAW,gBAAiB,SAAQ,eAAe,CAAC,UAAU;CAAG;AAEvE,eAAO,MAAM,WAAW,yFAGvB,CAAC;AAIF,MAAM,WAAW,gBAAiB,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAElG,eAAO,MAAM,WAAW,0FAGvB,CAAC;AAIF,MAAM,WAAW,sBAAuB,SAAQ,eAAe,CAAC,gBAAgB;CAAG;AAEnF,eAAO,MAAM,iBAAiB,2GAA8B,CAAC"}

package/lib/components/Switch/Switch.js

@@ -19,6 +19,11 @@ const {
 const withStateProps = createWithStateProps([useSwitchContext]);
 const SwitchRoot = React__default.forwardRef(
   ({ className, ...props }, ref) => {
+    if (process.env.NODE_ENV !== "production" && (props.size === "small" || props.size === "medium")) {
+      console.warn(
+        `[SEED Design System] Switch size='${props.size}' is deprecated and will be removed in @seed-design/react@1.3.0. Use size='${props.size === "small" ? "16" : "32"}' instead.`
+      );
+    }
     const [{ switch: switchVariantProps, switchMark: switchMarkVariantProps }, otherProps] = splitMultipleVariantsProps(
       {
         ...props,

package/lib/utils/styled.cjs

@@ -69,7 +69,7 @@ function handleDisplay(display) {
   if (process.env.NODE_ENV !== "production") {
     if (display === "inlineFlex" || display === "inlineBlock") {
       console.warn(
-        `[SEED Design System] ${display} is deprecated. Use inline-flex or inline-block instead.`
+        `[SEED Design System] display='${display}' is deprecated and will be removed in @seed-design/react@1.3.0. Use display='${display === "inlineFlex" ? "inline-flex" : "inline-block"}' instead.`
       );
     }
   }
@@ -89,7 +89,7 @@ function handleFlexDirection(flexDirection) {
   if (process.env.NODE_ENV !== "production") {
     if (flexDirection === "rowReverse" || flexDirection === "columnReverse") {
       console.warn(
-        `[SEED Design System] ${flexDirection} is deprecated. Use row-reverse or column-reverse instead.`
+        `[SEED Design System] flexDirection='${flexDirection}' is deprecated and will be removed in @seed-design/react@1.3.0. Use flexDirection='${flexDirection === "rowReverse" ? "row-reverse" : "column-reverse"}' instead.`
       );
     }
   }
@@ -109,12 +109,12 @@ function handleJustifyContent(justifyContent) {
   if (process.env.NODE_ENV !== "production") {
     if (justifyContent === "flexStart" || justifyContent === "flexEnd") {
       console.warn(
-        `[SEED Design System] ${justifyContent} is deprecated. Use flex-start or flex-end instead.`
+        `[SEED Design System] justifyContent='${justifyContent}' is deprecated and will be removed in @seed-design/react@1.3.0. Use justifyContent='${justifyContent === "flexStart" ? "flex-start" : "flex-end"}' instead.`
       );
     }
     if (justifyContent === "spaceBetween" || justifyContent === "spaceAround") {
       console.warn(
-        `[SEED Design System] ${justifyContent} is deprecated. Use space-between or space-around instead.`
+        `[SEED Design System] justifyContent='${justifyContent}' is deprecated and will be removed in @seed-design/react@1.3.0. Use justifyContent='${justifyContent === "spaceBetween" ? "space-between" : "space-around"}' instead.`
       );
     }
   }
@@ -137,7 +137,7 @@ function handleAlignItems(alignItems) {
   if (process.env.NODE_ENV !== "production") {
     if (alignItems === "flexStart" || alignItems === "flexEnd") {
       console.warn(
-        `[SEED Design System] ${alignItems} is deprecated. Use flex-start or flex-end instead.`
+        `[SEED Design System] alignItems='${alignItems}' is deprecated and will be removed in @seed-design/react@1.3.0. Use alignItems='${alignItems === "flexStart" ? "flex-start" : "flex-end"}' instead.`
       );
     }
   }

package/lib/utils/styled.js

@@ -65,7 +65,7 @@ function handleDisplay(display) {
   if (process.env.NODE_ENV !== "production") {
     if (display === "inlineFlex" || display === "inlineBlock") {
       console.warn(
-        `[SEED Design System] ${display} is deprecated. Use inline-flex or inline-block instead.`
+        `[SEED Design System] display='${display}' is deprecated and will be removed in @seed-design/react@1.3.0. Use display='${display === "inlineFlex" ? "inline-flex" : "inline-block"}' instead.`
       );
     }
   }
@@ -85,7 +85,7 @@ function handleFlexDirection(flexDirection) {
   if (process.env.NODE_ENV !== "production") {
     if (flexDirection === "rowReverse" || flexDirection === "columnReverse") {
       console.warn(
-        `[SEED Design System] ${flexDirection} is deprecated. Use row-reverse or column-reverse instead.`
+        `[SEED Design System] flexDirection='${flexDirection}' is deprecated and will be removed in @seed-design/react@1.3.0. Use flexDirection='${flexDirection === "rowReverse" ? "row-reverse" : "column-reverse"}' instead.`
       );
     }
   }
@@ -105,12 +105,12 @@ function handleJustifyContent(justifyContent) {
   if (process.env.NODE_ENV !== "production") {
     if (justifyContent === "flexStart" || justifyContent === "flexEnd") {
       console.warn(
-        `[SEED Design System] ${justifyContent} is deprecated. Use flex-start or flex-end instead.`
+        `[SEED Design System] justifyContent='${justifyContent}' is deprecated and will be removed in @seed-design/react@1.3.0. Use justifyContent='${justifyContent === "flexStart" ? "flex-start" : "flex-end"}' instead.`
       );
     }
     if (justifyContent === "spaceBetween" || justifyContent === "spaceAround") {
       console.warn(
-        `[SEED Design System] ${justifyContent} is deprecated. Use space-between or space-around instead.`
+        `[SEED Design System] justifyContent='${justifyContent}' is deprecated and will be removed in @seed-design/react@1.3.0. Use justifyContent='${justifyContent === "spaceBetween" ? "space-between" : "space-around"}' instead.`
       );
     }
   }
@@ -133,7 +133,7 @@ function handleAlignItems(alignItems) {
   if (process.env.NODE_ENV !== "production") {
     if (alignItems === "flexStart" || alignItems === "flexEnd") {
       console.warn(
-        `[SEED Design System] ${alignItems} is deprecated. Use flex-start or flex-end instead.`
+        `[SEED Design System] alignItems='${alignItems}' is deprecated and will be removed in @seed-design/react@1.3.0. Use alignItems='${alignItems === "flexStart" ? "flex-start" : "flex-end"}' instead.`
       );
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seed-design/react",
-  "version": "1.1.16",
+  "version": "1.1.17",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/daangn/seed-design.git",
@@ -64,7 +64,7 @@
     "unicode-segmenter": "^0.14.4"
   },
   "peerDependencies": {
-    "@seed-design/css": ">=1.1.16",
+    "@seed-design/css": ">=1.1.17",
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
   },

package/src/components/Checkbox/Checkbox.tsx

@@ -34,6 +34,15 @@ export interface CheckboxRootProps
 
 export const CheckboxRoot = Object.assign(
   forwardRef<HTMLLabelElement, CheckboxRootProps>(({ className, ...props }, ref) => {
+    if (
+      process.env.NODE_ENV !== "production" &&
+      (props.weight === "default" || props.weight === "stronger")
+    ) {
+      console.warn(
+        `[SEED Design System] Checkbox weight='${props.weight}' is deprecated and will be removed in @seed-design/react@1.3.0. Use weight='${props.weight === "default" ? "regular" : "bold"}' instead.`,
+      );
+    }
+
     const [{ checkbox: checkboxVariantProps, checkmark: checkmarkVariantProps }, otherProps] =
       splitMultipleVariantsProps(
         {

package/src/components/ChipTabs/ChipTabs.tsx

@@ -1,17 +1,38 @@
 import { chipTabs, type ChipTabsVariantProps } from "@seed-design/css/recipes/chip-tabs";
 import { Tabs as TabsPrimitive } from "@seed-design/react-tabs";
 import { createSlotRecipeContext } from "../../utils/createSlotRecipeContext";
+import { forwardRef } from "react";
+import clsx from "clsx";
 
-const { withProvider, withContext } = createSlotRecipeContext(chipTabs);
+const { ClassNamesProvider, withContext } = createSlotRecipeContext(chipTabs);
 
 ////////////////////////////////////////////////////////////////////////////////////
 
 export interface ChipTabsRootProps extends ChipTabsVariantProps, TabsPrimitive.RootProps {}
 
-export const ChipTabsRoot = withProvider<HTMLDivElement, ChipTabsRootProps>(
-  TabsPrimitive.Root,
-  "root",
+export const ChipTabsRoot = forwardRef<HTMLDivElement, ChipTabsRootProps>(
+  ({ className, ...props }, ref) => {
+    if (process.env.NODE_ENV !== "production" && props.variant === "brandSolid") {
+      console.warn(
+        "[SEED Design System] ChipTabs variant='brandSolid' is deprecated and will be removed in @seed-design/react@1.3.0. Use variant='neutralSolid' or variant='neutralOutline' instead.",
+      );
+    }
+
+    const [variantProps, otherProps] = chipTabs.splitVariantProps(props);
+    const classNames = chipTabs(variantProps);
+
+    return (
+      <ClassNamesProvider value={classNames}>
+        <TabsPrimitive.Root
+          ref={ref}
+          className={clsx(classNames.root, className)}
+          {...otherProps}
+        />
+      </ClassNamesProvider>
+    );
+  },
 );
+ChipTabsRoot.displayName = "ChipTabsRoot";
 
 ////////////////////////////////////////////////////////////////////////////////////
 

package/src/components/Switch/Switch.tsx

@@ -32,6 +32,15 @@ export interface SwitchRootProps
 
 export const SwitchRoot = React.forwardRef<HTMLLabelElement, SwitchRootProps>(
   ({ className, ...props }, ref) => {
+    if (
+      process.env.NODE_ENV !== "production" &&
+      (props.size === "small" || props.size === "medium")
+    ) {
+      console.warn(
+        `[SEED Design System] Switch size='${props.size}' is deprecated and will be removed in @seed-design/react@1.3.0. Use size='${props.size === "small" ? "16" : "32"}' instead.`,
+      );
+    }
+
     const [{ switch: switchVariantProps, switchMark: switchMarkVariantProps }, otherProps] =
       splitMultipleVariantsProps(
         {

package/src/utils/styled.tsx

@@ -105,7 +105,7 @@ function handleDisplay(display: string | undefined) {
   if (process.env.NODE_ENV !== "production") {
     if (display === "inlineFlex" || display === "inlineBlock") {
       console.warn(
-        `[SEED Design System] ${display} is deprecated. Use inline-flex or inline-block instead.`,
+        `[SEED Design System] display='${display}' is deprecated and will be removed in @seed-design/react@1.3.0. Use display='${display === "inlineFlex" ? "inline-flex" : "inline-block"}' instead.`,
       );
     }
   }
@@ -128,7 +128,7 @@ function handleFlexDirection(flexDirection: string | undefined) {
   if (process.env.NODE_ENV !== "production") {
     if (flexDirection === "rowReverse" || flexDirection === "columnReverse") {
       console.warn(
-        `[SEED Design System] ${flexDirection} is deprecated. Use row-reverse or column-reverse instead.`,
+        `[SEED Design System] flexDirection='${flexDirection}' is deprecated and will be removed in @seed-design/react@1.3.0. Use flexDirection='${flexDirection === "rowReverse" ? "row-reverse" : "column-reverse"}' instead.`,
       );
     }
   }
@@ -151,12 +151,12 @@ function handleJustifyContent(justifyContent: string | undefined) {
   if (process.env.NODE_ENV !== "production") {
     if (justifyContent === "flexStart" || justifyContent === "flexEnd") {
       console.warn(
-        `[SEED Design System] ${justifyContent} is deprecated. Use flex-start or flex-end instead.`,
+        `[SEED Design System] justifyContent='${justifyContent}' is deprecated and will be removed in @seed-design/react@1.3.0. Use justifyContent='${justifyContent === "flexStart" ? "flex-start" : "flex-end"}' instead.`,
       );
     }
     if (justifyContent === "spaceBetween" || justifyContent === "spaceAround") {
       console.warn(
-        `[SEED Design System] ${justifyContent} is deprecated. Use space-between or space-around instead.`,
+        `[SEED Design System] justifyContent='${justifyContent}' is deprecated and will be removed in @seed-design/react@1.3.0. Use justifyContent='${justifyContent === "spaceBetween" ? "space-between" : "space-around"}' instead.`,
       );
     }
   }
@@ -180,7 +180,7 @@ function handleAlignItems(alignItems: string | undefined) {
   if (process.env.NODE_ENV !== "production") {
     if (alignItems === "flexStart" || alignItems === "flexEnd") {
       console.warn(
-        `[SEED Design System] ${alignItems} is deprecated. Use flex-start or flex-end instead.`,
+        `[SEED Design System] alignItems='${alignItems}' is deprecated and will be removed in @seed-design/react@1.3.0. Use alignItems='${alignItems === "flexStart" ? "flex-start" : "flex-end"}' instead.`,
       );
     }
   }