@seed-design/react 0.1.15 → 0.2.1

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 (24) hide show
  1. package/lib/components/Chip/Chip.cjs +13 -4
  2. package/lib/components/Chip/Chip.d.ts.map +1 -1
  3. package/lib/components/Chip/Chip.js +13 -4
  4. package/lib/components/Chip/Chip.namespace.cjs +1 -0
  5. package/lib/components/Chip/Chip.namespace.d.ts +1 -1
  6. package/lib/components/Chip/Chip.namespace.d.ts.map +1 -1
  7. package/lib/components/Chip/Chip.namespace.js +1 -1
  8. package/lib/components/Divider/Divider.cjs +1 -1
  9. package/lib/components/Divider/Divider.d.ts +1 -1
  10. package/lib/components/Divider/Divider.js +1 -1
  11. package/lib/components/Icon/Icon.d.ts.map +1 -1
  12. package/lib/components/ResponsivePair/ResponsivePair.d.ts +1 -1
  13. package/lib/utils/createSlotRecipeContext.d.ts.map +1 -1
  14. package/lib/utils/createWithStateProps.cjs +1 -1
  15. package/lib/utils/createWithStateProps.js +1 -1
  16. package/package.json +3 -3
  17. package/src/components/ActionChip/ActionChip.tsx +2 -2
  18. package/src/components/Chip/Chip.namespace.ts +2 -0
  19. package/src/components/Chip/Chip.tsx +13 -4
  20. package/src/components/ControlChip/ControlChip.tsx +2 -2
  21. package/src/components/Divider/Divider.tsx +2 -2
  22. package/src/components/Icon/Icon.tsx +4 -1
  23. package/src/components/ResponsivePair/ResponsivePair.tsx +1 -1
  24. package/src/utils/createSlotRecipeContext.tsx +4 -1
package/lib/components/Chip/Chip.cjs CHANGED
@@ -7,27 +7,36 @@ const chip = require('@seed-design/css/recipes/chip');
7
7
  const reactPrimitive = require('@seed-design/react-primitive');
8
8
  const createSlotRecipeContext = require('../../utils/createSlotRecipeContext.cjs');
9
9
  const Icon = require('../Icon/Icon.cjs');
10
+ const createWithStateProps = require('../../utils/createWithStateProps.cjs');
11
+ const reactCheckbox = require('@seed-design/react-checkbox');
12
+ const reactRadioGroup = require('@seed-design/react-radio-group');
10
13
 
11
14
  const { withProvider, withContext } = createSlotRecipeContext.createSlotRecipeContext(chip.chip);
15
+ const withStateProps = createWithStateProps.createWithStateProps([reactCheckbox.useCheckboxContext, reactRadioGroup.useRadioGroupItemContext], {
16
+ strict: false
17
+ });
12
18
  const ChipRoot = Icon.withIconRequired(
13
19
  withProvider(reactPrimitive.Primitive.button, "root"),
14
20
  (props) => props.layout === "iconOnly"
15
21
  );
16
22
  ChipRoot.displayName = "Chip.Root";
17
- const ChipLabel = withContext(reactPrimitive.Primitive.span, "label");
23
+ const ChipLabel = withContext(
24
+ withStateProps(reactPrimitive.Primitive.span),
25
+ "label"
26
+ );
18
27
  ChipLabel.displayName = "Chip.Label";
19
28
  const ChipPrefixIcon = withContext(
20
- reactPrimitive.Primitive.div,
29
+ withStateProps(reactPrimitive.Primitive.div),
21
30
  "prefixIcon"
22
31
  );
23
32
  ChipPrefixIcon.displayName = "Chip.PrefixIcon";
24
33
  const ChipPrefixAvatar = withContext(
25
- reactPrimitive.Primitive.div,
34
+ withStateProps(reactPrimitive.Primitive.div),
26
35
  "prefixAvatar"
27
36
  );
28
37
  ChipPrefixAvatar.displayName = "Chip.PrefixAvatar";
29
38
  const ChipSuffixIcon = withContext(
30
- reactPrimitive.Primitive.div,
39
+ withStateProps(reactPrimitive.Primitive.div),
31
40
  "suffixIcon"
32
41
  );
33
42
  ChipSuffixIcon.displayName = "Chip.SuffixIcon";
package/lib/components/Chip/Chip.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAQpC,MAAM,WAAW,aACf,SAAQ,cAAc,EACpB,gBAAgB,EAChB,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;CAAG;AAEpD,eAAO,MAAM,QAAQ,+IAGpB,CAAC;AAKF,MAAM,WAAW,cAAe,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAEhG,eAAO,MAAM,SAAS,wFAAwE,CAAC;AAK/F,MAAM,WAAW,mBAAoB,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AACpG,eAAO,MAAM,cAAc,4FAG1B,CAAC;AAKF,MAAM,WAAW,qBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE3C,eAAO,MAAM,gBAAgB,8FAG5B,CAAC;AAKF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AACpG,eAAO,MAAM,cAAc,4FAG1B,CAAC"}
1
+ {"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/Chip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAcpC,MAAM,WAAW,aACf,SAAQ,cAAc,EACpB,gBAAgB,EAChB,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;CAAG;AAEpD,eAAO,MAAM,QAAQ,+IAGpB,CAAC;AAKF,MAAM,WAAW,cAAe,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAEhG,eAAO,MAAM,SAAS,wFAGrB,CAAC;AAKF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AACpG,eAAO,MAAM,cAAc,4FAG1B,CAAC;AAKF,MAAM,WAAW,qBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE3C,eAAO,MAAM,gBAAgB,8FAG5B,CAAC;AAKF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AACpG,eAAO,MAAM,cAAc,4FAG1B,CAAC"}
package/lib/components/Chip/Chip.js CHANGED
@@ -3,27 +3,36 @@ import { chip } from '@seed-design/css/recipes/chip';
3
3
  import { Primitive } from '@seed-design/react-primitive';
4
4
  import { createSlotRecipeContext } from '../../utils/createSlotRecipeContext.js';
5
5
  import { withIconRequired } from '../Icon/Icon.js';
6
+ import { createWithStateProps } from '../../utils/createWithStateProps.js';
7
+ import { useCheckboxContext } from '@seed-design/react-checkbox';
8
+ import { useRadioGroupItemContext } from '@seed-design/react-radio-group';
6
9
 
7
10
  const { withProvider, withContext } = createSlotRecipeContext(chip);
11
+ const withStateProps = createWithStateProps([useCheckboxContext, useRadioGroupItemContext], {
12
+ strict: false
13
+ });
8
14
  const ChipRoot = withIconRequired(
9
15
  withProvider(Primitive.button, "root"),
10
16
  (props) => props.layout === "iconOnly"
11
17
  );
12
18
  ChipRoot.displayName = "Chip.Root";
13
- const ChipLabel = withContext(Primitive.span, "label");
19
+ const ChipLabel = withContext(
20
+ withStateProps(Primitive.span),
21
+ "label"
22
+ );
14
23
  ChipLabel.displayName = "Chip.Label";
15
24
  const ChipPrefixIcon = withContext(
16
- Primitive.div,
25
+ withStateProps(Primitive.div),
17
26
  "prefixIcon"
18
27
  );
19
28
  ChipPrefixIcon.displayName = "Chip.PrefixIcon";
20
29
  const ChipPrefixAvatar = withContext(
21
- Primitive.div,
30
+ withStateProps(Primitive.div),
22
31
  "prefixAvatar"
23
32
  );
24
33
  ChipPrefixAvatar.displayName = "Chip.PrefixAvatar";
25
34
  const ChipSuffixIcon = withContext(
26
- Primitive.div,
35
+ withStateProps(Primitive.div),
27
36
  "suffixIcon"
28
37
  );
29
38
  ChipSuffixIcon.displayName = "Chip.SuffixIcon";
package/lib/components/Chip/Chip.namespace.cjs CHANGED
@@ -9,4 +9,5 @@ const Chip = require('./Chip.cjs');
9
9
  exports.Label = Chip.ChipLabel;
10
10
  exports.PrefixAvatar = Chip.ChipPrefixAvatar;
11
11
  exports.PrefixIcon = Chip.ChipPrefixIcon;
12
+ exports.Root = Chip.ChipRoot;
12
13
  exports.SuffixIcon = Chip.ChipSuffixIcon;
package/lib/components/Chip/Chip.namespace.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- export { ChipLabel as Label, ChipPrefixIcon as PrefixIcon, ChipPrefixAvatar as PrefixAvatar, ChipSuffixIcon as SuffixIcon, type ChipLabelProps as LabelProps, type ChipPrefixIconProps as PrefixIconProps, type ChipPrefixAvatarProps as PrefixAvatarProps, type ChipSuffixIconProps as SuffixIconProps, } from './Chip';
1
+ export { ChipRoot as Root, ChipLabel as Label, ChipPrefixIcon as PrefixIcon, ChipPrefixAvatar as PrefixAvatar, ChipSuffixIcon as SuffixIcon, type ChipRootProps as RootProps, type ChipLabelProps as LabelProps, type ChipPrefixIconProps as PrefixIconProps, type ChipPrefixAvatarProps as PrefixAvatarProps, type ChipSuffixIconProps as SuffixIconProps, } from './Chip';
2
2
  //# sourceMappingURL=Chip.namespace.d.ts.map
package/lib/components/Chip/Chip.namespace.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Chip.namespace.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/Chip.namespace.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,IAAI,KAAK,EAClB,cAAc,IAAI,UAAU,EAC5B,gBAAgB,IAAI,YAAY,EAChC,cAAc,IAAI,UAAU,EAC5B,KAAK,cAAc,IAAI,UAAU,EACjC,KAAK,mBAAmB,IAAI,eAAe,EAC3C,KAAK,qBAAqB,IAAI,iBAAiB,EAC/C,KAAK,mBAAmB,IAAI,eAAe,GAC5C,MAAM,QAAQ,CAAC"}
1
+ {"version":3,"file":"Chip.namespace.d.ts","sourceRoot":"","sources":["../../../src/components/Chip/Chip.namespace.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,IAAI,IAAI,EAChB,SAAS,IAAI,KAAK,EAClB,cAAc,IAAI,UAAU,EAC5B,gBAAgB,IAAI,YAAY,EAChC,cAAc,IAAI,UAAU,EAC5B,KAAK,aAAa,IAAI,SAAS,EAC/B,KAAK,cAAc,IAAI,UAAU,EACjC,KAAK,mBAAmB,IAAI,eAAe,EAC3C,KAAK,qBAAqB,IAAI,iBAAiB,EAC/C,KAAK,mBAAmB,IAAI,eAAe,GAC5C,MAAM,QAAQ,CAAC"}
package/lib/components/Chip/Chip.namespace.js CHANGED
@@ -1 +1 @@
1
- export { ChipLabel as Label, ChipPrefixAvatar as PrefixAvatar, ChipPrefixIcon as PrefixIcon, ChipSuffixIcon as SuffixIcon } from './Chip.js';
1
+ export { ChipLabel as Label, ChipPrefixAvatar as PrefixAvatar, ChipPrefixIcon as PrefixIcon, ChipRoot as Root, ChipSuffixIcon as SuffixIcon } from './Chip.js';
package/lib/components/Divider/Divider.cjs CHANGED
@@ -29,7 +29,7 @@ const React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
29
29
  const Divider = React__namespace.forwardRef((props, ref) => {
30
30
  const {
31
31
  as = "hr",
32
- color = "stroke.neutral",
32
+ color = "stroke.neutralMuted",
33
33
  thickness = 1,
34
34
  orientation = "horizontal",
35
35
  role,
package/lib/components/Divider/Divider.d.ts CHANGED
@@ -9,7 +9,7 @@ export interface DividerProps {
9
9
  */
10
10
  as?: "hr" | "div" | "li";
11
11
  /**
12
- * @default "stroke.neutral"
12
+ * @default "stroke.neutralMuted"
13
13
  */
14
14
  color?: BoxProps["borderColor"];
15
15
  /**
package/lib/components/Divider/Divider.js CHANGED
@@ -6,7 +6,7 @@ import { Box } from '../Box/Box.js';
6
6
  const Divider = React.forwardRef((props, ref) => {
7
7
  const {
8
8
  as = "hr",
9
- color = "stroke.neutral",
9
+ color = "stroke.neutralMuted",
10
10
  thickness = 1,
11
11
  orientation = "horizontal",
12
12
  role,
package/lib/components/Icon/Icon.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/Icon.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAgC,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAEnF,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,UAAU,2GAatB,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,UAAU,2GAatB,CAAC;AAIF,eAAO,MAAM,YAAY,GAAI,wBAG1B;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,4CAsDjD,CAAC;AAEF,MAAM,WAAW,SAAS;IACxB,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;IAErB,IAAI,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAE5B,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;CAC7B;AAED,eAAO,MAAM,IAAI,qGA+BhB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,EAC9C,SAAS,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,EAC1D,gBAAgB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,KAAK,OAAO,oHAe/D"}
1
+ {"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/Icon.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAgC,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAEnF,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,UAAU,2GAatB,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,UAAU,2GAatB,CAAC;AAIF,eAAO,MAAM,YAAY,GAAI,wBAG1B;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,OAAO,CAAC;CAClB,4CAsDA,CAAC;AAEF,MAAM,WAAW,SAAS;IACxB,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;IAErB,IAAI,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAE5B,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;CAC7B;AAED,eAAO,MAAM,IAAI,qGA+BhB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,EAC9C,SAAS,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,EAC1D,gBAAgB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,KAAK,OAAO,oHAe/D"}
package/lib/components/ResponsivePair/ResponsivePair.d.ts CHANGED
@@ -2,7 +2,7 @@ import { FlexProps } from '../Flex';
2
2
  import * as React from "react";
3
3
  export interface ResponsivePairProps extends Omit<FlexProps, "flexDirection" | "flexWrap"> {
4
4
  /**
5
- * @default wrap-reverse
5
+ * @default "wrap-reverse"
6
6
  */
7
7
  wrap?: "wrap" | "wrap-reverse";
8
8
  children: [React.ReactNode, React.ReactNode];
package/lib/utils/createSlotRecipeContext.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"createSlotRecipeContext.d.ts","sourceRoot":"","sources":["../../src/utils/createSlotRecipeContext.tsx"],"names":[],"mappings":"AAGA,KAAK,UAAU,CACb,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,EAC1D,UAAU,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,IACvC,CAAC,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,UAAU,CAAC,GAAG;IACpC,iBAAiB,EAAE,CAAC,CAAC,SAAS,KAAK,EAAE,KAAK,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,EAAE,MAAM,KAAK,CAAC,CAAC,CAAC;CACjF,CAAC;AAEF,wBAAgB,uBAAuB,CACrC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,EAC1D,UAAU,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACzC,MAAM,EAAE,UAAU,CAAC,KAAK,EAAE,UAAU,CAAC;+CAOlC;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,EAAE,UAAU,CAAA;KAAE;yCAIP;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,EAAE,KAAK,CAAA;KAAE;;;uBAmB7D,CAAC,aACd,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,YACvB;QACR,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;KAC3B,KACA,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;mBAsBtC,CAAC,EAAE,CAAC,aACb,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,QAC3B,MAAM,UAAU,YACZ;QACR,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;KAC3B,KACA,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;kBAuBhE,CAAC,EAAE,CAAC,aACZ,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,SAC1B,MAAM,UAAU,KACtB,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;EAsBtF"}
1
+ {"version":3,"file":"createSlotRecipeContext.d.ts","sourceRoot":"","sources":["../../src/utils/createSlotRecipeContext.tsx"],"names":[],"mappings":"AAGA,KAAK,UAAU,CACb,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,EAC1D,UAAU,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,IACvC,CAAC,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,UAAU,CAAC,GAAG;IACpC,iBAAiB,EAAE,CAAC,CAAC,SAAS,KAAK,EAAE,KAAK,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,EAAE,MAAM,KAAK,CAAC,CAAC,CAAC;CACjF,CAAC;AAEF,wBAAgB,uBAAuB,CACrC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,EAC1D,UAAU,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACzC,MAAM,EAAE,UAAU,CAAC,KAAK,EAAE,UAAU,CAAC;+CAOlC;QACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B,KAAK,EAAE,UAAU,CAAC;KACnB;yCAI2C;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,EAAE,KAAK,CAAA;KAAE;;;uBAmB7D,CAAC,aACd,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,YACvB;QACR,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;KAC3B,KACA,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;mBAsBtC,CAAC,EAAE,CAAC,aACb,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,QAC3B,MAAM,UAAU,YACZ;QACR,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;KAC3B,KACA,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;kBAuBhE,CAAC,EAAE,CAAC,aACZ,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,SAC1B,MAAM,UAAU,KACtB,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;EAsBtF"}
package/lib/utils/createWithStateProps.cjs CHANGED
@@ -7,7 +7,7 @@ const jsxRuntime = require('react/jsx-runtime');
7
7
  const React = require('react');
8
8
 
9
9
  function createWithStateProps(useContexts, options) {
10
- const strict = true;
10
+ const strict = options?.strict ?? true;
11
11
  return function withStateProps(Component) {
12
12
  const Node = React.forwardRef((props, ref) => {
13
13
  const stateProps = {};
package/lib/utils/createWithStateProps.js CHANGED
@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
3
3
  import { forwardRef } from 'react';
4
4
 
5
5
  function createWithStateProps(useContexts, options) {
6
- const strict = true;
6
+ const strict = options?.strict ?? true;
7
7
  return function withStateProps(Component) {
8
8
  const Node = forwardRef((props, ref) => {
9
9
  const stateProps = {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seed-design/react",
3
- "version": "0.1.15",
3
+ "version": "0.2.1",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/daangn/seed-design.git",
@@ -58,12 +58,12 @@
58
58
  "clsx": "^2.1.1"
59
59
  },
60
60
  "peerDependencies": {
61
- "@seed-design/css": "0.1.15",
61
+ "@seed-design/css": "0.2.1",
62
62
  "react": ">=18.0.0",
63
63
  "react-dom": ">=18.0.0"
64
64
  },
65
65
  "devDependencies": {
66
- "@seed-design/css": "0.1.15",
66
+ "@seed-design/css": "0.2.1",
67
67
  "@vitejs/plugin-react": "^5.0.0",
68
68
  "ajv": "^8.17.1",
69
69
  "globby": "^14.1.0",
package/src/components/ActionChip/ActionChip.tsx CHANGED
@@ -8,12 +8,12 @@ const { withContext } = createRecipeContext(actionChip);
8
8
 
9
9
  /**
10
10
  * @deprecated ActionChip is deprecated. Use Chip.Button with variant="solid" instead.
11
- *
11
+ *
12
12
  * Migration guide:
13
13
  * ```tsx
14
14
  * // Before
15
15
  * <ActionChip size="medium">Label</ActionChip>
16
- *
16
+ *
17
17
  * // After
18
18
  * import { Chip } from "@seed-design/react";
19
19
  * <Chip.Button size="medium" variant="solid">Label</Chip.Button>
package/src/components/Chip/Chip.namespace.ts CHANGED
@@ -1,8 +1,10 @@
1
1
  export {
2
+ ChipRoot as Root,
2
3
  ChipLabel as Label,
3
4
  ChipPrefixIcon as PrefixIcon,
4
5
  ChipPrefixAvatar as PrefixAvatar,
5
6
  ChipSuffixIcon as SuffixIcon,
7
+ type ChipRootProps as RootProps,
6
8
  type ChipLabelProps as LabelProps,
7
9
  type ChipPrefixIconProps as PrefixIconProps,
8
10
  type ChipPrefixAvatarProps as PrefixAvatarProps,
package/src/components/Chip/Chip.tsx CHANGED
@@ -3,8 +3,14 @@ import { Primitive, type PrimitiveProps } from "@seed-design/react-primitive";
3
3
  import type * as React from "react";
4
4
  import { createSlotRecipeContext } from "../../utils/createSlotRecipeContext";
5
5
  import { withIconRequired } from "../Icon/Icon";
6
+ import { createWithStateProps } from "../../utils/createWithStateProps";
7
+ import { useCheckboxContext } from "@seed-design/react-checkbox";
8
+ import { useRadioGroupItemContext } from "@seed-design/react-radio-group";
6
9
 
7
10
  const { withProvider, withContext } = createSlotRecipeContext(chip);
11
+ const withStateProps = createWithStateProps([useCheckboxContext, useRadioGroupItemContext], {
12
+ strict: false,
13
+ });
8
14
 
9
15
  ////////////////////////////////////////////////////////////////////////////////////
10
16
 
@@ -23,14 +29,17 @@ ChipRoot.displayName = "Chip.Root";
23
29
 
24
30
  export interface ChipLabelProps extends PrimitiveProps, React.HTMLAttributes<HTMLSpanElement> {}
25
31
 
26
- export const ChipLabel = withContext<HTMLSpanElement, ChipLabelProps>(Primitive.span, "label");
32
+ export const ChipLabel = withContext<HTMLSpanElement, ChipLabelProps>(
33
+ withStateProps(Primitive.span),
34
+ "label",
35
+ );
27
36
  ChipLabel.displayName = "Chip.Label";
28
37
 
29
38
  ////////////////////////////////////////////////////////////////////////////////////
30
39
 
31
40
  export interface ChipPrefixIconProps extends PrimitiveProps, React.HTMLAttributes<HTMLDivElement> {}
32
41
  export const ChipPrefixIcon = withContext<HTMLDivElement, ChipPrefixIconProps>(
33
- Primitive.div,
42
+ withStateProps(Primitive.div),
34
43
  "prefixIcon",
35
44
  );
36
45
  ChipPrefixIcon.displayName = "Chip.PrefixIcon";
@@ -42,7 +51,7 @@ export interface ChipPrefixAvatarProps
42
51
  React.HTMLAttributes<HTMLDivElement> {}
43
52
 
44
53
  export const ChipPrefixAvatar = withContext<HTMLDivElement, ChipPrefixAvatarProps>(
45
- Primitive.div,
54
+ withStateProps(Primitive.div),
46
55
  "prefixAvatar",
47
56
  );
48
57
  ChipPrefixAvatar.displayName = "Chip.PrefixAvatar";
@@ -51,7 +60,7 @@ ChipPrefixAvatar.displayName = "Chip.PrefixAvatar";
51
60
 
52
61
  export interface ChipSuffixIconProps extends PrimitiveProps, React.HTMLAttributes<HTMLDivElement> {}
53
62
  export const ChipSuffixIcon = withContext<HTMLDivElement, ChipSuffixIconProps>(
54
- Primitive.div,
63
+ withStateProps(Primitive.div),
55
64
  "suffixIcon",
56
65
  );
57
66
  ChipSuffixIcon.displayName = "Chip.SuffixIcon";
package/src/components/ControlChip/ControlChip.tsx CHANGED
@@ -13,12 +13,12 @@ export interface ControlChipBaseProps extends PrimitiveProps, ControlChipVariant
13
13
 
14
14
  /**
15
15
  * @deprecated ControlChipProps is deprecated. Use Chip.Toggle or Chip.Button instead.
16
- *
16
+ *
17
17
  * Migration guide:
18
18
  * ```tsx
19
19
  * // Before
20
20
  * <ControlChip size="medium">Label</ControlChip>
21
- *
21
+ *
22
22
  * // After
23
23
  * import { Chip } from "@seed-design/react";
24
24
  * <Chip.Toggle size="medium" variant="outlineStrong">Label</Chip.Toggle>
package/src/components/Divider/Divider.tsx CHANGED
@@ -11,7 +11,7 @@ export interface DividerProps {
11
11
  as?: "hr" | "div" | "li";
12
12
 
13
13
  /**
14
- * @default "stroke.neutral"
14
+ * @default "stroke.neutralMuted"
15
15
  */
16
16
  color?: BoxProps["borderColor"];
17
17
 
@@ -31,7 +31,7 @@ export interface DividerProps {
31
31
  export const Divider = React.forwardRef<HTMLHRElement, DividerProps>((props, ref) => {
32
32
  const {
33
33
  as = "hr",
34
- color = "stroke.neutral",
34
+ color = "stroke.neutralMuted",
35
35
  thickness = 1,
36
36
  orientation = "horizontal",
37
37
  role,
package/src/components/Icon/Icon.tsx CHANGED
@@ -46,7 +46,10 @@ const IconContext = createContext<{ register: () => void; unregister: () => void
46
46
  export const IconRequired = ({
47
47
  children,
48
48
  enabled,
49
- }: { children: React.ReactNode; enabled: boolean }) => {
49
+ }: {
50
+ children: React.ReactNode;
51
+ enabled: boolean;
52
+ }) => {
50
53
  const registeredRef = useRef(false);
51
54
  const parentContext = useContext(IconContext);
52
55
 
package/src/components/ResponsivePair/ResponsivePair.tsx CHANGED
@@ -5,7 +5,7 @@ import { Flex, type FlexProps } from "../Flex";
5
5
 
6
6
  export interface ResponsivePairProps extends Omit<FlexProps, "flexDirection" | "flexWrap"> {
7
7
  /**
8
- * @default wrap-reverse
8
+ * @default "wrap-reverse"
9
9
  */
10
10
  wrap?: "wrap" | "wrap-reverse";
11
11
 
package/src/utils/createSlotRecipeContext.tsx CHANGED
@@ -18,7 +18,10 @@ export function createSlotRecipeContext<
18
18
  const ClassNamesProvider = ({
19
19
  children,
20
20
  value,
21
- }: { children: React.ReactNode; value: Classnames }) => {
21
+ }: {
22
+ children: React.ReactNode;
23
+ value: Classnames;
24
+ }) => {
22
25
  return <ClassNamesContext.Provider value={value}>{children}</ClassNamesContext.Provider>;
23
26
  };
24
27