@seed-design/react 1.2.4 → 1.2.6

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 (13) hide show
  1. package/lib/components/AspectRatio/AspectRatio.cjs +3 -0
  2. package/lib/components/AspectRatio/AspectRatio.d.ts +12 -0
  3. package/lib/components/AspectRatio/AspectRatio.d.ts.map +1 -1
  4. package/lib/components/AspectRatio/AspectRatio.js +3 -0
  5. package/lib/components/IdentityPlaceholder/IdentityPlaceholder.cjs +37 -23
  6. package/lib/components/IdentityPlaceholder/IdentityPlaceholder.d.ts.map +1 -1
  7. package/lib/components/IdentityPlaceholder/IdentityPlaceholder.js +37 -23
  8. package/lib/components/PullToRefresh/PullToRefresh.d.ts +1 -1
  9. package/lib/components/PullToRefresh/PullToRefresh.d.ts.map +1 -1
  10. package/package.json +6 -6
  11. package/src/components/AspectRatio/AspectRatio.tsx +18 -0
  12. package/src/components/IdentityPlaceholder/IdentityPlaceholder.tsx +52 -22
  13. package/src/components/PullToRefresh/PullToRefresh.tsx +1 -1
package/lib/components/AspectRatio/AspectRatio.cjs CHANGED
@@ -37,6 +37,9 @@ const AspectRatio = React__namespace.forwardRef(
37
37
  {
38
38
  ref,
39
39
  className: clsx(aspectRatio$1, className),
40
+ position: "relative",
41
+ overflowX: "hidden",
42
+ overflowY: "hidden",
40
43
  style: {
41
44
  // NOTE: aspectRatio는 iOS 15+부터 지원하기 때문에 padding으로 ratio hack을 사용합니다.
42
45
  "--seed-aspect-ratio-padding": `${1 / ratio * 100}%`,
package/lib/components/AspectRatio/AspectRatio.d.ts CHANGED
@@ -6,6 +6,18 @@ export interface AspectRatioProps extends BoxProps {
6
6
  * @default 4 / 3
7
7
  */
8
8
  ratio?: number;
9
+ /**
10
+ * @default "relative"
11
+ */
12
+ position?: BoxProps["position"];
13
+ /**
14
+ * @default "hidden"
15
+ */
16
+ overflowX?: BoxProps["overflowX"];
17
+ /**
18
+ * @default "hidden"
19
+ */
20
+ overflowY?: BoxProps["overflowY"];
9
21
  }
10
22
  export declare const AspectRatio: React.ForwardRefExoticComponent<AspectRatioProps & React.RefAttributes<HTMLDivElement>>;
11
23
  //# sourceMappingURL=AspectRatio.d.ts.map
package/lib/components/AspectRatio/AspectRatio.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AspectRatio.d.ts","sourceRoot":"","sources":["../../../src/components/AspectRatio/AspectRatio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEhD,MAAM,WAAW,gBAAiB,SAAQ,QAAQ;IAChD;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,WAAW,yFAsBvB,CAAC"}
1
+ {"version":3,"file":"AspectRatio.d.ts","sourceRoot":"","sources":["../../../src/components/AspectRatio/AspectRatio.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEhD,MAAM,WAAW,gBAAiB,SAAQ,QAAQ;IAChD;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAIf;;OAEG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,UAAU,CAAC,CAAC;IAChC;;OAEG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC,WAAW,CAAC,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC,WAAW,CAAC,CAAC;CACnC;AAED,eAAO,MAAM,WAAW,yFAyBvB,CAAC"}
package/lib/components/AspectRatio/AspectRatio.js CHANGED
@@ -14,6 +14,9 @@ const AspectRatio = React.forwardRef(
14
14
  {
15
15
  ref,
16
16
  className: clsx(aspectRatio$1, className),
17
+ position: "relative",
18
+ overflowX: "hidden",
19
+ overflowY: "hidden",
17
20
  style: {
18
21
  // NOTE: aspectRatio는 iOS 15+부터 지원하기 때문에 padding으로 ratio hack을 사용합니다.
19
22
  "--seed-aspect-ratio-padding": `${1 / ratio * 100}%`,
package/lib/components/IdentityPlaceholder/IdentityPlaceholder.cjs CHANGED
@@ -29,33 +29,47 @@ function _interopNamespaceDefault(e) {
29
29
 
30
30
  const React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
31
31
 
32
- const { useClassNames, withProvider } = createSlotRecipeContext.createSlotRecipeContext(identityPlaceholder.identityPlaceholder);
33
- const IdentityPlaceholderRoot = withProvider(
34
- reactPrimitive.Primitive.div,
35
- "root"
36
- );
32
+ const { ClassNamesProvider, PropsProvider, useClassNames, useProps } = createSlotRecipeContext.createSlotRecipeContext(identityPlaceholder.identityPlaceholder);
33
+ const IdentityPlaceholderRoot = React__namespace.forwardRef((props, ref) => {
34
+ const [variantProps, restProps] = identityPlaceholder.identityPlaceholder.splitVariantProps(props);
35
+ const classNames = identityPlaceholder.identityPlaceholder(variantProps);
36
+ return /* @__PURE__ */ jsxRuntime.jsx(PropsProvider, { value: variantProps, children: /* @__PURE__ */ jsxRuntime.jsx(ClassNamesProvider, { value: classNames, children: /* @__PURE__ */ jsxRuntime.jsx(reactPrimitive.Primitive.div, { ref, ...domUtils.mergeProps({ className: classNames.root }, restProps) }) }) });
37
+ });
38
+ IdentityPlaceholderRoot.displayName = "IdentityPlaceholderRoot";
37
39
  const IdentityPlaceholderImage = React__namespace.forwardRef((props, ref) => {
38
40
  const classNames = useClassNames();
39
- return /* @__PURE__ */ jsxRuntime.jsx(
40
- "svg",
41
- {
42
- ref,
43
- viewBox: "0 0 640 640",
44
- fill: "none",
45
- xmlns: "http://www.w3.org/2000/svg",
46
- role: "img",
47
- "aria-label": "Identity placeholder",
48
- ...domUtils.mergeProps({ className: classNames.image }, props),
49
- children: /* @__PURE__ */ jsxRuntime.jsx(
50
- "path",
41
+ const parentProps = useProps();
42
+ switch (parentProps?.identity) {
43
+ case "business":
44
+ return /* @__PURE__ */ jsxRuntime.jsx(
45
+ "svg",
51
46
  {
52
- fillRule: "evenodd",
53
- clipRule: "evenodd",
54
- d: "M481 301c0 56-29 106-72 135a264 264 0 0 1 175 248c0 18-118 38-264 38S56 702 56 684c0-114 73-211 174-248a162 162 0 1 1 251-135Zm-203-1c8 0 14-9 14-20s-6-20-14-20-15 9-15 20 7 20 15 20Zm83 0c8 0 15-9 15-20s-7-20-15-20-15 9-15 20 7 20 15 20Zm-88 25c4-2 9-1 11 4 4 7 15 19 36 19s32-12 36-19a8 8 0 1 1 15 8c-7 12-23 27-51 27s-44-15-50-27c-3-5-1-10 3-12Z"
47
+ ref,
48
+ viewBox: "0 0 640 640",
49
+ fill: "none",
50
+ xmlns: "http://www.w3.org/2000/svg",
51
+ role: "img",
52
+ "aria-label": "Identity placeholder",
53
+ ...domUtils.mergeProps({ className: classNames.image }, props),
54
+ children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m512 250-29-73c-7-17-24-29-42-29H200c-18 0-35 12-42 29l-29 73q-3 7 2 14c17 23 42 41 71 41q35-2 59-26 25 24 59 26 35-2 59-26 25 24 59 26c28 0 56-18 72-41 2-3 3-11 2-14M439 340c-28 0-47-12-59-23a86 86 0 0 1-59 23c-28 0-48-12-59-23a86 86 0 0 1-60 23q-33-2-53-17v119c0 27 22 49 49 49h138l107 1c27 0 49-22 49-50V323q-20 15-53 17m-143 72q-1 11-12 12h-18q-11-2-12-12v-19q1-10 12-11h18q11 1 12 11zm91 0q-1 11-11 12h-19q-11-2-12-12v-19q1-10 12-11h19q10 1 11 11z" })
55
55
  }
56
- )
57
- }
58
- );
56
+ );
57
+ case "person":
58
+ case void 0:
59
+ return /* @__PURE__ */ jsxRuntime.jsx(
60
+ "svg",
61
+ {
62
+ ref,
63
+ viewBox: "0 0 640 640",
64
+ fill: "none",
65
+ xmlns: "http://www.w3.org/2000/svg",
66
+ role: "img",
67
+ "aria-label": "Identity placeholder",
68
+ ...domUtils.mergeProps({ className: classNames.image }, props),
69
+ children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M496 460q4 5 0 11c-42 52-97 81-176 81s-134-29-176-81q-3-5-1-10c33-50 104-74 177-74s144 23 176 73M222 251a98 98 0 0 1 196 0c0 54-44 97-98 97s-98-43-98-97" })
70
+ }
71
+ );
72
+ }
59
73
  });
60
74
  IdentityPlaceholderImage.displayName = "IdentityPlaceholderImage";
61
75
 
package/lib/components/IdentityPlaceholder/IdentityPlaceholder.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IdentityPlaceholder.d.ts","sourceRoot":"","sources":["../../../src/components/IdentityPlaceholder/IdentityPlaceholder.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,+BAA+B,EACrC,MAAM,+CAA+C,CAAC;AAEvD,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,WAAW,4BACf,SAAQ,+BAA+B,EACrC,cAAc,EACd,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE3C,eAAO,MAAM,uBAAuB,qGAGnC,CAAC;AAEF,MAAM,WAAW,6BAA8B,SAAQ,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC;CAAG;AAEvF,eAAO,MAAM,wBAAwB,kHAsBnC,CAAC"}
1
+ {"version":3,"file":"IdentityPlaceholder.d.ts","sourceRoot":"","sources":["../../../src/components/IdentityPlaceholder/IdentityPlaceholder.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,+BAA+B,EACrC,MAAM,+CAA+C,CAAC;AAEvD,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,4BACf,SAAQ,+BAA+B,EACrC,cAAc,EACd,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;CAAG;AAE3C,eAAO,MAAM,uBAAuB,qGAclC,CAAC;AAGH,MAAM,WAAW,6BAA8B,SAAQ,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC;CAAG;AAEvF,eAAO,MAAM,wBAAwB,kHAuCnC,CAAC"}
package/lib/components/IdentityPlaceholder/IdentityPlaceholder.js CHANGED
@@ -6,33 +6,47 @@ import { Primitive } from '@seed-design/react-primitive';
6
6
  import * as React from 'react';
7
7
  import { createSlotRecipeContext } from '../../utils/createSlotRecipeContext.js';
8
8
 
9
- const { useClassNames, withProvider } = createSlotRecipeContext(identityPlaceholder);
10
- const IdentityPlaceholderRoot = withProvider(
11
- Primitive.div,
12
- "root"
13
- );
9
+ const { ClassNamesProvider, PropsProvider, useClassNames, useProps } = createSlotRecipeContext(identityPlaceholder);
10
+ const IdentityPlaceholderRoot = React.forwardRef((props, ref) => {
11
+ const [variantProps, restProps] = identityPlaceholder.splitVariantProps(props);
12
+ const classNames = identityPlaceholder(variantProps);
13
+ return /* @__PURE__ */ jsx(PropsProvider, { value: variantProps, children: /* @__PURE__ */ jsx(ClassNamesProvider, { value: classNames, children: /* @__PURE__ */ jsx(Primitive.div, { ref, ...mergeProps({ className: classNames.root }, restProps) }) }) });
14
+ });
15
+ IdentityPlaceholderRoot.displayName = "IdentityPlaceholderRoot";
14
16
  const IdentityPlaceholderImage = React.forwardRef((props, ref) => {
15
17
  const classNames = useClassNames();
16
- return /* @__PURE__ */ jsx(
17
- "svg",
18
- {
19
- ref,
20
- viewBox: "0 0 640 640",
21
- fill: "none",
22
- xmlns: "http://www.w3.org/2000/svg",
23
- role: "img",
24
- "aria-label": "Identity placeholder",
25
- ...mergeProps({ className: classNames.image }, props),
26
- children: /* @__PURE__ */ jsx(
27
- "path",
18
+ const parentProps = useProps();
19
+ switch (parentProps?.identity) {
20
+ case "business":
21
+ return /* @__PURE__ */ jsx(
22
+ "svg",
23
+ {
24
+ ref,
25
+ viewBox: "0 0 640 640",
26
+ fill: "none",
27
+ xmlns: "http://www.w3.org/2000/svg",
28
+ role: "img",
29
+ "aria-label": "Identity placeholder",
30
+ ...mergeProps({ className: classNames.image }, props),
31
+ children: /* @__PURE__ */ jsx("path", { d: "m512 250-29-73c-7-17-24-29-42-29H200c-18 0-35 12-42 29l-29 73q-3 7 2 14c17 23 42 41 71 41q35-2 59-26 25 24 59 26 35-2 59-26 25 24 59 26c28 0 56-18 72-41 2-3 3-11 2-14M439 340c-28 0-47-12-59-23a86 86 0 0 1-59 23c-28 0-48-12-59-23a86 86 0 0 1-60 23q-33-2-53-17v119c0 27 22 49 49 49h138l107 1c27 0 49-22 49-50V323q-20 15-53 17m-143 72q-1 11-12 12h-18q-11-2-12-12v-19q1-10 12-11h18q11 1 12 11zm91 0q-1 11-11 12h-19q-11-2-12-12v-19q1-10 12-11h19q10 1 11 11z" })
32
+ }
33
+ );
34
+ case "person":
35
+ case void 0:
36
+ return /* @__PURE__ */ jsx(
37
+ "svg",
28
38
  {
29
- fillRule: "evenodd",
30
- clipRule: "evenodd",
31
- d: "M481 301c0 56-29 106-72 135a264 264 0 0 1 175 248c0 18-118 38-264 38S56 702 56 684c0-114 73-211 174-248a162 162 0 1 1 251-135Zm-203-1c8 0 14-9 14-20s-6-20-14-20-15 9-15 20 7 20 15 20Zm83 0c8 0 15-9 15-20s-7-20-15-20-15 9-15 20 7 20 15 20Zm-88 25c4-2 9-1 11 4 4 7 15 19 36 19s32-12 36-19a8 8 0 1 1 15 8c-7 12-23 27-51 27s-44-15-50-27c-3-5-1-10 3-12Z"
39
+ ref,
40
+ viewBox: "0 0 640 640",
41
+ fill: "none",
42
+ xmlns: "http://www.w3.org/2000/svg",
43
+ role: "img",
44
+ "aria-label": "Identity placeholder",
45
+ ...mergeProps({ className: classNames.image }, props),
46
+ children: /* @__PURE__ */ jsx("path", { d: "M496 460q4 5 0 11c-42 52-97 81-176 81s-134-29-176-81q-3-5-1-10c33-50 104-74 177-74s144 23 176 73M222 251a98 98 0 0 1 196 0c0 54-44 97-98 97s-98-43-98-97" })
32
47
  }
33
- )
34
- }
35
- );
48
+ );
49
+ }
36
50
  });
37
51
  IdentityPlaceholderImage.displayName = "IdentityPlaceholderImage";
38
52
 
package/lib/components/PullToRefresh/PullToRefresh.d.ts CHANGED
@@ -3,7 +3,7 @@ import { PullToRefreshVariantProps } from '@seed-design/css/recipes/pull-to-refr
3
3
  import { ForwardRefExoticComponent, RefAttributes } from 'react';
4
4
  export interface PullToRefreshRootProps extends PullToRefreshVariantProps, PullToRefreshPrimitive.RootProps {
5
5
  }
6
- export declare const PullToRefreshRoot: ForwardRefExoticComponent<PullToRefreshRootProps & RefAttributes<SVGSVGElement>>;
6
+ export declare const PullToRefreshRoot: ForwardRefExoticComponent<PullToRefreshRootProps & RefAttributes<HTMLDivElement>>;
7
7
  export interface PullToRefreshIndicatorProps extends PullToRefreshPrimitive.IndicatorProps {
8
8
  }
9
9
  export declare const PullToRefreshIndicator: ForwardRefExoticComponent<PullToRefreshIndicatorProps & RefAttributes<HTMLDivElement>>;
package/lib/components/PullToRefresh/PullToRefresh.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"PullToRefresh.d.ts","sourceRoot":"","sources":["../../../src/components/PullToRefresh/PullToRefresh.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,IAAI,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAC7F,OAAO,EAEL,KAAK,yBAAyB,EAC/B,MAAM,0CAA0C,CAAC;AAKlD,MAAM,WAAW,sBACf,SAAQ,yBAAyB,EAC/B,sBAAsB,CAAC,SAAS;CAAG;AAEvC,eAAO,MAAM,iBAAiB,kHAG7B,CAAC;AAEF,MAAM,WAAW,2BAA4B,SAAQ,sBAAsB,CAAC,cAAc;CAAG;AAE7F,eAAO,MAAM,sBAAsB,wHAGlC,CAAC;AAEF,MAAM,WAAW,yBAA0B,SAAQ,sBAAsB,CAAC,YAAY;CAAG;AAEzF,eAAO,MAAM,oBAAoB,gIAAiC,CAAC"}
1
+ {"version":3,"file":"PullToRefresh.d.ts","sourceRoot":"","sources":["../../../src/components/PullToRefresh/PullToRefresh.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,IAAI,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAC7F,OAAO,EAEL,KAAK,yBAAyB,EAC/B,MAAM,0CAA0C,CAAC;AAKlD,MAAM,WAAW,sBACf,SAAQ,yBAAyB,EAC/B,sBAAsB,CAAC,SAAS;CAAG;AAEvC,eAAO,MAAM,iBAAiB,mHAG7B,CAAC;AAEF,MAAM,WAAW,2BAA4B,SAAQ,sBAAsB,CAAC,cAAc;CAAG;AAE7F,eAAO,MAAM,sBAAsB,wHAGlC,CAAC;AAEF,MAAM,WAAW,yBAA0B,SAAQ,sBAAsB,CAAC,YAAY;CAAG;AAEzF,eAAO,MAAM,oBAAoB,gIAAiC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seed-design/react",
3
- "version": "1.2.4",
3
+ "version": "1.2.6",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/daangn/seed-design.git",
@@ -45,11 +45,11 @@
45
45
  "@seed-design/react-checkbox": "1.0.1",
46
46
  "@seed-design/react-collapsible": "0.1.0",
47
47
  "@seed-design/react-dialog": "1.0.2",
48
- "@seed-design/react-drawer": "1.0.8",
48
+ "@seed-design/react-drawer": "1.0.9",
49
49
  "@seed-design/react-field": "1.0.1",
50
- "@seed-design/react-image": "0.1.0",
50
+ "@seed-design/react-image": "0.1.1",
51
51
  "@seed-design/react-fieldset": "0.1.0",
52
- "@seed-design/react-field-button": "1.0.1",
52
+ "@seed-design/react-field-button": "1.0.2",
53
53
  "@seed-design/react-popover": "1.0.3",
54
54
  "@seed-design/react-portal": "1.0.0",
55
55
  "@seed-design/react-primitive": "1.0.0",
@@ -57,12 +57,12 @@
57
57
  "@seed-design/react-pull-to-refresh": "1.0.1",
58
58
  "@seed-design/react-radio-group": "1.1.0",
59
59
  "@seed-design/react-segmented-control": "1.0.1",
60
- "@seed-design/react-slider": "1.0.1",
60
+ "@seed-design/react-slider": "1.0.2",
61
61
  "@seed-design/react-snackbar": "1.0.1",
62
62
  "@seed-design/react-switch": "1.0.1",
63
63
  "@seed-design/react-tabs": "1.0.2",
64
64
  "@seed-design/react-text-field": "1.1.1",
65
- "@seed-design/react-toggle": "1.0.0",
65
+ "@seed-design/react-toggle": "1.0.1",
66
66
  "clsx": "^2.1.1",
67
67
  "unicode-segmenter": "^0.14.4"
68
68
  },
package/src/components/AspectRatio/AspectRatio.tsx CHANGED
@@ -9,6 +9,21 @@ export interface AspectRatioProps extends BoxProps {
9
9
  * @default 4 / 3
10
10
  */
11
11
  ratio?: number;
12
+
13
+ // following 3 are just here for JSDoc purposes
14
+
15
+ /**
16
+ * @default "relative"
17
+ */
18
+ position?: BoxProps["position"];
19
+ /**
20
+ * @default "hidden"
21
+ */
22
+ overflowX?: BoxProps["overflowX"];
23
+ /**
24
+ * @default "hidden"
25
+ */
26
+ overflowY?: BoxProps["overflowY"];
12
27
  }
13
28
 
14
29
  export const AspectRatio = React.forwardRef<HTMLDivElement, AspectRatioProps>(
@@ -20,6 +35,9 @@ export const AspectRatio = React.forwardRef<HTMLDivElement, AspectRatioProps>(
20
35
  <Box
21
36
  ref={ref}
22
37
  className={clsx(aspectRatio, className)}
38
+ position="relative" // TODO: these are currently here but we might want to make AspectRatio just a Primitive.div which takes BoxProps
39
+ overflowX="hidden"
40
+ overflowY="hidden"
23
41
  style={
24
42
  {
25
43
  // NOTE: aspectRatio는 iOS 15+부터 지원하기 때문에 padding으로 ratio hack을 사용합니다.
package/src/components/IdentityPlaceholder/IdentityPlaceholder.tsx CHANGED
@@ -7,17 +7,30 @@ import { Primitive, type PrimitiveProps } from "@seed-design/react-primitive";
7
7
  import * as React from "react";
8
8
  import { createSlotRecipeContext } from "../../utils/createSlotRecipeContext";
9
9
 
10
- const { useClassNames, withProvider } = createSlotRecipeContext(identityPlaceholder);
10
+ const { ClassNamesProvider, PropsProvider, useClassNames, useProps } =
11
+ createSlotRecipeContext(identityPlaceholder);
11
12
 
12
13
  export interface IdentityPlaceholderRootProps
13
14
  extends IdentityPlaceholderVariantProps,
14
15
  PrimitiveProps,
15
16
  React.HTMLAttributes<HTMLDivElement> {}
16
17
 
17
- export const IdentityPlaceholderRoot = withProvider<HTMLDivElement, IdentityPlaceholderRootProps>(
18
- Primitive.div,
19
- "root",
20
- );
18
+ export const IdentityPlaceholderRoot = React.forwardRef<
19
+ HTMLDivElement,
20
+ IdentityPlaceholderRootProps
21
+ >((props, ref) => {
22
+ const [variantProps, restProps] = identityPlaceholder.splitVariantProps(props);
23
+ const classNames = identityPlaceholder(variantProps);
24
+
25
+ return (
26
+ <PropsProvider value={variantProps}>
27
+ <ClassNamesProvider value={classNames}>
28
+ <Primitive.div ref={ref} {...mergeProps({ className: classNames.root }, restProps)} />
29
+ </ClassNamesProvider>
30
+ </PropsProvider>
31
+ );
32
+ });
33
+ IdentityPlaceholderRoot.displayName = "IdentityPlaceholderRoot";
21
34
 
22
35
  export interface IdentityPlaceholderImageProps extends React.SVGProps<SVGSVGElement> {}
23
36
 
@@ -26,22 +39,39 @@ export const IdentityPlaceholderImage = React.forwardRef<
26
39
  IdentityPlaceholderImageProps
27
40
  >((props, ref) => {
28
41
  const classNames = useClassNames();
29
- return (
30
- <svg
31
- ref={ref}
32
- viewBox="0 0 640 640"
33
- fill="none"
34
- xmlns="http://www.w3.org/2000/svg"
35
- role="img"
36
- aria-label="Identity placeholder"
37
- {...mergeProps({ className: classNames.image }, props)}
38
- >
39
- <path
40
- fillRule="evenodd"
41
- clipRule="evenodd"
42
- d="M481 301c0 56-29 106-72 135a264 264 0 0 1 175 248c0 18-118 38-264 38S56 702 56 684c0-114 73-211 174-248a162 162 0 1 1 251-135Zm-203-1c8 0 14-9 14-20s-6-20-14-20-15 9-15 20 7 20 15 20Zm83 0c8 0 15-9 15-20s-7-20-15-20-15 9-15 20 7 20 15 20Zm-88 25c4-2 9-1 11 4 4 7 15 19 36 19s32-12 36-19a8 8 0 1 1 15 8c-7 12-23 27-51 27s-44-15-50-27c-3-5-1-10 3-12Z"
43
- />
44
- </svg>
45
- );
42
+ const parentProps = useProps();
43
+
44
+ switch (parentProps?.identity) {
45
+ case "business":
46
+ return (
47
+ <svg
48
+ ref={ref}
49
+ viewBox="0 0 640 640"
50
+ fill="none"
51
+ xmlns="http://www.w3.org/2000/svg"
52
+ role="img"
53
+ aria-label="Identity placeholder"
54
+ {...mergeProps({ className: classNames.image }, props)}
55
+ >
56
+ <path d="m512 250-29-73c-7-17-24-29-42-29H200c-18 0-35 12-42 29l-29 73q-3 7 2 14c17 23 42 41 71 41q35-2 59-26 25 24 59 26 35-2 59-26 25 24 59 26c28 0 56-18 72-41 2-3 3-11 2-14M439 340c-28 0-47-12-59-23a86 86 0 0 1-59 23c-28 0-48-12-59-23a86 86 0 0 1-60 23q-33-2-53-17v119c0 27 22 49 49 49h138l107 1c27 0 49-22 49-50V323q-20 15-53 17m-143 72q-1 11-12 12h-18q-11-2-12-12v-19q1-10 12-11h18q11 1 12 11zm91 0q-1 11-11 12h-19q-11-2-12-12v-19q1-10 12-11h19q10 1 11 11z" />
57
+ </svg>
58
+ );
59
+
60
+ case "person":
61
+ case undefined:
62
+ return (
63
+ <svg
64
+ ref={ref}
65
+ viewBox="0 0 640 640"
66
+ fill="none"
67
+ xmlns="http://www.w3.org/2000/svg"
68
+ role="img"
69
+ aria-label="Identity placeholder"
70
+ {...mergeProps({ className: classNames.image }, props)}
71
+ >
72
+ <path d="M496 460q4 5 0 11c-42 52-97 81-176 81s-134-29-176-81q-3-5-1-10c33-50 104-74 177-74s144 23 176 73M222 251a98 98 0 0 1 196 0c0 54-44 97-98 97s-98-43-98-97" />
73
+ </svg>
74
+ );
75
+ }
46
76
  });
47
77
  IdentityPlaceholderImage.displayName = "IdentityPlaceholderImage";
package/src/components/PullToRefresh/PullToRefresh.tsx CHANGED
@@ -11,7 +11,7 @@ export interface PullToRefreshRootProps
11
11
  extends PullToRefreshVariantProps,
12
12
  PullToRefreshPrimitive.RootProps {}
13
13
 
14
- export const PullToRefreshRoot = withProvider<SVGSVGElement, PullToRefreshRootProps>(
14
+ export const PullToRefreshRoot = withProvider<HTMLDivElement, PullToRefreshRootProps>(
15
15
  PullToRefreshPrimitive.Root,
16
16
  "root",
17
17
  );