@seed-design/react 2.5.1 → 2.6.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 (13) hide show
  1. package/lib/components/Box/Box.test.d.ts +2 -0
  2. package/lib/components/Box/Box.test.d.ts.map +1 -0
  3. package/lib/components/TextField/TextField.cjs +4 -0
  4. package/lib/components/TextField/TextField.d.ts.map +1 -1
  5. package/lib/components/TextField/TextField.js +4 -0
  6. package/lib/utils/styled.cjs +3 -2
  7. package/lib/utils/styled.d.ts +18 -11
  8. package/lib/utils/styled.d.ts.map +1 -1
  9. package/lib/utils/styled.js +3 -2
  10. package/package.json +2 -2
  11. package/src/components/Box/Box.test.tsx +88 -0
  12. package/src/components/TextField/TextField.tsx +9 -0
  13. package/src/utils/styled.tsx +72 -15
package/lib/components/Box/Box.test.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=Box.test.d.ts.map
package/lib/components/Box/Box.test.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Box.test.d.ts","sourceRoot":"","sources":["../../../src/components/Box/Box.test.tsx"],"names":[],"mappings":""}
package/lib/components/TextField/TextField.cjs CHANGED
@@ -57,11 +57,15 @@ var TextFieldTextarea = (0, react.forwardRef)(({ className, autoresize = true, .
57
57
  const prevAlignment = input.style.alignSelf;
58
58
  const prevOverflow = input.style.overflow;
59
59
  if (!("MozAppearance" in input.style)) input.style.overflow = "hidden";
60
+ const parent = input.parentElement;
61
+ const prevParentMinHeight = parent?.style.minHeight ?? "";
62
+ if (parent) parent.style.minHeight = getComputedStyle(parent).height;
60
63
  input.style.alignSelf = "start";
61
64
  input.style.height = "auto";
62
65
  input.style.height = `${input.scrollHeight + (input.offsetHeight - input.clientHeight)}px`;
63
66
  input.style.overflow = prevOverflow;
64
67
  input.style.alignSelf = prevAlignment;
68
+ if (parent) parent.style.minHeight = prevParentMinHeight;
65
69
  }, [
66
70
  inputRef,
67
71
  otherProps.style?.height,
package/lib/components/TextField/TextField.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../src/components/TextField/TextField.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,EAAE,SAAS,EAAuB,MAAM,+BAA+B,CAAC;AAE/E,OAAO,EAAa,KAAK,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AAE5F,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAcvE,MAAM,WAAW,kBAAmB,SAAQ,qBAAqB,EAAE,SAAS,CAAC,SAAS;CAAG;AAEzF,eAAO,MAAM,aAAa,2FAGzB,CAAC;AAIF,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB;CAAG;AAEtE,eAAO,MAAM,mBAAmB,gGAG/B,CAAC;AAEF,MAAM,WAAW,wBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAE5C,eAAO,MAAM,mBAAmB,kGAG/B,CAAC;AAEF,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB;CAAG;AAEtE,eAAO,MAAM,mBAAmB,gGAG/B,CAAC;AAEF,MAAM,WAAW,wBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAE5C,eAAO,MAAM,mBAAmB,kGAG/B,CAAC;AAIF,MAAM,WAAW,mBAAoB,SAAQ,SAAS,CAAC,UAAU;CAAG;AAEpE,eAAO,MAAM,cAAc,8FA6B1B,CAAC;AAGF,MAAM,WAAW,sBAAuB,SAAQ,SAAS,CAAC,aAAa;IACrE;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,iBAAiB,oGAuE7B,CAAC"}
1
+ {"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../src/components/TextField/TextField.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,EAAE,SAAS,EAAuB,MAAM,+BAA+B,CAAC;AAE/E,OAAO,EAAa,KAAK,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AAE5F,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAcvE,MAAM,WAAW,kBAAmB,SAAQ,qBAAqB,EAAE,SAAS,CAAC,SAAS;CAAG;AAEzF,eAAO,MAAM,aAAa,2FAGzB,CAAC;AAIF,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB;CAAG;AAEtE,eAAO,MAAM,mBAAmB,gGAG/B,CAAC;AAEF,MAAM,WAAW,wBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAE5C,eAAO,MAAM,mBAAmB,kGAG/B,CAAC;AAEF,MAAM,WAAW,wBAAyB,SAAQ,iBAAiB;CAAG;AAEtE,eAAO,MAAM,mBAAmB,gGAG/B,CAAC;AAEF,MAAM,WAAW,wBACf,SAAQ,cAAc,EACpB,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAE5C,eAAO,MAAM,mBAAmB,kGAG/B,CAAC;AAIF,MAAM,WAAW,mBAAoB,SAAQ,SAAS,CAAC,UAAU;CAAG;AAEpE,eAAO,MAAM,cAAc,8FA6B1B,CAAC;AAGF,MAAM,WAAW,sBAAuB,SAAQ,SAAS,CAAC,aAAa;IACrE;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,iBAAiB,oGAgF7B,CAAC"}
package/lib/components/TextField/TextField.js CHANGED
@@ -55,11 +55,15 @@ var TextFieldTextarea = forwardRef(({ className, autoresize = true, ...otherProp
55
55
  const prevAlignment = input.style.alignSelf;
56
56
  const prevOverflow = input.style.overflow;
57
57
  if (!("MozAppearance" in input.style)) input.style.overflow = "hidden";
58
+ const parent = input.parentElement;
59
+ const prevParentMinHeight = parent?.style.minHeight ?? "";
60
+ if (parent) parent.style.minHeight = getComputedStyle(parent).height;
58
61
  input.style.alignSelf = "start";
59
62
  input.style.height = "auto";
60
63
  input.style.height = `${input.scrollHeight + (input.offsetHeight - input.clientHeight)}px`;
61
64
  input.style.overflow = prevOverflow;
62
65
  input.style.alignSelf = prevAlignment;
66
+ if (parent) parent.style.minHeight = prevParentMinHeight;
63
67
  }, [
64
68
  inputRef,
65
69
  otherProps.style?.height,
package/lib/utils/styled.cjs CHANGED
@@ -34,6 +34,7 @@ function handleDimension(dimension) {
34
34
  }
35
35
  function handleBleed(dimension, direction) {
36
36
  if (dimension === "asPadding") return `var(--seed-box-padding-${direction})`;
37
+ if (dimension === "safeArea") return `var(--seed-safe-area-${direction})`;
37
38
  return handleDimension(dimension);
38
39
  }
39
40
  function handleShadow(shadow) {
@@ -103,9 +104,9 @@ function useStyleProps(props) {
103
104
  ...(paddingX ?? px) !== void 0 && resolveResponsive("--seed-box-padding-x", paddingX ?? px, handleDimension),
104
105
  ...(paddingY ?? py) !== void 0 && resolveResponsive("--seed-box-padding-y", paddingY ?? py, handleDimension),
105
106
  ...(paddingTop ?? pt) !== void 0 && resolveResponsive("--seed-box-padding-top", paddingTop ?? pt, (v) => handlePaddingWithSafeArea(v, "top")),
106
- ...(paddingRight ?? pr) !== void 0 && resolveResponsive("--seed-box-padding-right", paddingRight ?? pr, handleDimension),
107
+ ...(paddingRight ?? pr) !== void 0 && resolveResponsive("--seed-box-padding-right", paddingRight ?? pr, (v) => handlePaddingWithSafeArea(v, "right")),
107
108
  ...(paddingBottom ?? pb) !== void 0 && resolveResponsive("--seed-box-padding-bottom", paddingBottom ?? pb, (v) => handlePaddingWithSafeArea(v, "bottom")),
108
- ...(paddingLeft ?? pl) !== void 0 && resolveResponsive("--seed-box-padding-left", paddingLeft ?? pl, handleDimension),
109
+ ...(paddingLeft ?? pl) !== void 0 && resolveResponsive("--seed-box-padding-left", paddingLeft ?? pl, (v) => handlePaddingWithSafeArea(v, "left")),
109
110
  ...(bleedTop ?? bleedY ?? bleed) !== void 0 && resolveResponsive("--seed-box-bleed-top", bleedTop ?? bleedY ?? bleed, (v) => handleBleed(v, "top")),
110
111
  ...(bleedRight ?? bleedX ?? bleed) !== void 0 && resolveResponsive("--seed-box-bleed-right", bleedRight ?? bleedX ?? bleed, (v) => handleBleed(v, "right")),
111
112
  ...(bleedBottom ?? bleedY ?? bleed) !== void 0 && resolveResponsive("--seed-box-bleed-bottom", bleedBottom ?? bleedY ?? bleed, (v) => handleBleed(v, "bottom")),
package/lib/utils/styled.d.ts CHANGED
@@ -95,52 +95,59 @@ interface BleedStyleProps {
95
95
  /**
96
96
  * Negative margin on all four sides to extend the element outside its parent.
97
97
  * If set to "asPadding", it will use the padding value in the same direction.
98
+ * If set to "safeArea", it will use the safe area inset in the same direction.
98
99
  *
99
100
  * Cannot be combined with any `margin*` prop.
100
101
  */
101
- bleed?: ResponsiveValue<"asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
102
+ bleed?: ResponsiveValue<"asPadding" | "safeArea" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
102
103
  /**
103
104
  * Negative x-axis margin to extend the element outside its parent.
104
105
  * If set to "asPadding", it will use the padding value in the same direction.
106
+ * If set to "safeArea", it will use the safe area inset in the same direction.
105
107
  *
106
108
  * Cannot be combined with any `margin*` prop.
107
109
  */
108
- bleedX?: ResponsiveValue<"asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
110
+ bleedX?: ResponsiveValue<"asPadding" | "safeArea" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
109
111
  /**
110
112
  * Negative y-axis margin to extend the element outside its parent.
111
113
  * If set to "asPadding", it will use the padding value in the same direction.
114
+ * If set to "safeArea", it will use the safe area inset in the same direction.
112
115
  *
113
116
  * Cannot be combined with any `margin*` prop.
114
117
  */
115
- bleedY?: ResponsiveValue<"asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
118
+ bleedY?: ResponsiveValue<"asPadding" | "safeArea" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
116
119
  /**
117
120
  * Negative top margin to extend the element outside its parent.
118
121
  * If set to "asPadding", it will use the padding value in the same direction.
122
+ * If set to "safeArea", it will use the safe area inset in the same direction.
119
123
  *
120
124
  * Cannot be combined with any `margin*` prop.
121
125
  */
122
- bleedTop?: ResponsiveValue<"asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
126
+ bleedTop?: ResponsiveValue<"asPadding" | "safeArea" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
123
127
  /**
124
128
  * Negative right margin to extend the element outside its parent.
125
129
  * If set to "asPadding", it will use the padding value in the same direction.
130
+ * If set to "safeArea", it will use the safe area inset in the same direction.
126
131
  *
127
132
  * Cannot be combined with any `margin*` prop.
128
133
  */
129
- bleedRight?: ResponsiveValue<"asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
134
+ bleedRight?: ResponsiveValue<"asPadding" | "safeArea" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
130
135
  /**
131
136
  * Negative bottom margin to extend the element outside its parent.
132
137
  * If set to "asPadding", it will use the padding value in the same direction.
138
+ * If set to "safeArea", it will use the safe area inset in the same direction.
133
139
  *
134
140
  * Cannot be combined with any `margin*` prop.
135
141
  */
136
- bleedBottom?: ResponsiveValue<"asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
142
+ bleedBottom?: ResponsiveValue<"asPadding" | "safeArea" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
137
143
  /**
138
144
  * Negative left margin to extend the element outside its parent.
139
145
  * If set to "asPadding", it will use the padding value in the same direction.
146
+ * If set to "safeArea", it will use the safe area inset in the same direction.
140
147
  *
141
148
  * Cannot be combined with any `margin*` prop.
142
149
  */
143
- bleedLeft?: ResponsiveValue<"asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
150
+ bleedLeft?: ResponsiveValue<"asPadding" | "safeArea" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
144
151
  }
145
152
  /** Distributes `Omit` over each union branch, preserving the union structure. */
146
153
  export type DistributiveOmit<T, K extends PropertyKey> = T extends unknown ? Omit<T, K> : never;
@@ -211,21 +218,21 @@ export type StyleProps = {
211
218
  * Shorthand for `paddingTop`.
212
219
  */
213
220
  pt?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})>;
214
- paddingRight?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
221
+ paddingRight?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})>;
215
222
  /**
216
223
  * Shorthand for `paddingRight`.
217
224
  */
218
- pr?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
225
+ pr?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})>;
219
226
  paddingBottom?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})>;
220
227
  /**
221
228
  * Shorthand for `paddingBottom`.
222
229
  */
223
230
  pb?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})>;
224
- paddingLeft?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
231
+ paddingLeft?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})>;
225
232
  /**
226
233
  * Shorthand for `paddingLeft`.
227
234
  */
228
- pl?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})>;
235
+ pl?: ResponsiveValue<Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})>;
229
236
  display?: ResponsiveValue<"block" | "flex" | "grid" | "inline-flex" | "inline" | "inline-block" | "none">;
230
237
  position?: "relative" | "absolute" | "fixed" | "sticky";
231
238
  overflowX?: "visible" | "hidden" | "scroll" | "auto";
package/lib/utils/styled.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../src/utils/styled.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../src/utils/styled.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EACV,aAAa,EACb,aAAa,EACb,kBAAkB,EAClB,iBAAiB,EACjB,SAAS,EACT,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,iBAAiB,EAClB,MAAM,uBAAuB,CAAC;AAG/B,OAAO,EAAE,KAAK,eAAe,EAAsB,MAAM,qBAAqB,CAAC;AAE/E,wBAAgB,iBAAiB,CAAC,CAAC,EACjC,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,EACzB,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,GAC/C,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAqBjC;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,OAOpD;AAED,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,GAAG,CAAC,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAiBrF;AAuCD,wBAAgB,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,GAAG,SAAS,OAM1D;AAgBD,UAAU,gBAAgB;IACxB;;;;OAIG;IACH,MAAM,CAAC,EAAE,eAAe,CACtB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,CAAC,CAAC,EAAE,eAAe,CACjB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,OAAO,CAAC,EAAE,eAAe,CACvB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,OAAO,CAAC,EAAE,eAAe,CACvB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,SAAS,CAAC,EAAE,eAAe,CACzB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,WAAW,CAAC,EAAE,eAAe,CAC3B,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,YAAY,CAAC,EAAE,eAAe,CAC5B,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,UAAU,CAAC,EAAE,eAAe,CAC1B,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;IAEF;;;;OAIG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACzF,CAAC;CACH;AAED,UAAU,eAAe;IACvB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,eAAe,CACnB,WAAW,GACX,UAAU,GACV,SAAS,GACT,YAAY,QAAQ,EAAE,GACtB,YAAY,QAAQ,EAAE,GACtB,CAAC,GACD,CAAC,MAAM,GAAG,EAAE,CAAC,CAChB,CAAC;IAEF;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,eAAe,CACpB,WAAW,GACX,UAAU,GACV,SAAS,GACT,YAAY,QAAQ,EAAE,GACtB,YAAY,QAAQ,EAAE,GACtB,CAAC,GACD,CAAC,MAAM,GAAG,EAAE,CAAC,CAChB,CAAC;IAEF;;;;;;OAMG;IACH,MAAM,CAAC,EAAE,eAAe,CACpB,WAAW,GACX,UAAU,GACV,SAAS,GACT,YAAY,QAAQ,EAAE,GACtB,YAAY,QAAQ,EAAE,GACtB,CAAC,GACD,CAAC,MAAM,GAAG,EAAE,CAAC,CAChB,CAAC;IAEF;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,eAAe,CACtB,WAAW,GACX,UAAU,GACV,SAAS,GACT,YAAY,QAAQ,EAAE,GACtB,YAAY,QAAQ,EAAE,GACtB,CAAC,GACD,CAAC,MAAM,GAAG,EAAE,CAAC,CAChB,CAAC;IAEF;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,eAAe,CACxB,WAAW,GACX,UAAU,GACV,SAAS,GACT,YAAY,QAAQ,EAAE,GACtB,YAAY,QAAQ,EAAE,GACtB,CAAC,GACD,CAAC,MAAM,GAAG,EAAE,CAAC,CAChB,CAAC;IAEF;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,eAAe,CACzB,WAAW,GACX,UAAU,GACV,SAAS,GACT,YAAY,QAAQ,EAAE,GACtB,YAAY,QAAQ,EAAE,GACtB,CAAC,GACD,CAAC,MAAM,GAAG,EAAE,CAAC,CAChB,CAAC;IAEF;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,eAAe,CACvB,WAAW,GACX,UAAU,GACV,SAAS,GACT,YAAY,QAAQ,EAAE,GACtB,YAAY,QAAQ,EAAE,GACtB,CAAC,GACD,CAAC,MAAM,GAAG,EAAE,CAAC,CAChB,CAAC;CACH;AAED,iFAAiF;AACjF,MAAM,MAAM,gBAAgB,CAAC,CAAC,EAAE,CAAC,SAAS,WAAW,IAAI,CAAC,SAAS,OAAO,GAAG,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,KAAK,CAAC;AAEhG;;;GAGG;AACH,MAAM,MAAM,UAAU,GAAG;IACvB;;OAEG;IACH,EAAE,CAAC,EAAE,aAAa,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAE5E,UAAU,CAAC,EAAE,aAAa,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEpF;;OAEG;IACH,UAAU,CAAC,EAAE,QAAQ,CAAC;IAEtB,kBAAkB,CAAC,EAAE,QAAQ,CAAC;IAE9B;;;OAGG;IACH,mBAAmB,CAAC,EAChB,UAAU,GACV,SAAS,GACT,QAAQ,GACR,WAAW,GACX,cAAc,GACd,aAAa,GACb,iBAAiB,GACjB,gBAAgB,GAChB,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAElB;;OAEG;IACH,2BAA2B,CAAC,EACxB,UAAU,GACV,SAAS,GACT,QAAQ,GACR,WAAW,GACX,cAAc,GACd,aAAa,GACb,iBAAiB,GACjB,gBAAgB,GAChB,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAElB,KAAK,CAAC,EAAE,aAAa,GAAG,kBAAkB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAE3D,WAAW,CAAC,EAAE,iBAAiB,GAAG,kBAAkB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAErE,WAAW,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEpC,cAAc,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEvC,gBAAgB,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEzC,iBAAiB,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAE1C,eAAe,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAExC,YAAY,CAAC,EAAE,MAAM,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAE1C,mBAAmB,CAAC,EAAE,MAAM,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEjD,oBAAoB,CAAC,EAAE,MAAM,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAElD,uBAAuB,CAAC,EAAE,MAAM,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAErD,sBAAsB,CAAC,EAAE,MAAM,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEpD,SAAS,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEnC,KAAK,CAAC,EAAE,eAAe,CACrB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACrF,CAAC;IAEF,QAAQ,CAAC,EAAE,eAAe,CACxB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACrF,CAAC;IAEF,QAAQ,CAAC,EAAE,eAAe,CACxB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACrF,CAAC;IAEF,MAAM,CAAC,EAAE,eAAe,CACtB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACrF,CAAC;IAEF,SAAS,CAAC,EAAE,eAAe,CACzB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACrF,CAAC;IAEF,SAAS,CAAC,EAAE,eAAe,CACzB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CACrF,CAAC;IAEF,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAExB,IAAI,CAAC,EAAE,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEzB,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAE1B,MAAM,CAAC,EAAE,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAE3B,OAAO,CAAC,EAAE,eAAe,CACvB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAChF,CAAC;IAEF;;OAEG;IACH,CAAC,CAAC,EAAE,eAAe,CACjB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAChF,CAAC;IAEF,QAAQ,CAAC,EAAE,eAAe,CACxB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAChF,CAAC;IAEF;;OAEG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAChF,CAAC;IAEF,QAAQ,CAAC,EAAE,eAAe,CACxB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAChF,CAAC;IAEF;;OAEG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAChF,CAAC;IAEF,UAAU,CAAC,EAAE,eAAe,CAC1B,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,UAAU,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAC7F,CAAC;IAEF;;OAEG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,UAAU,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAC7F,CAAC;IAEF,YAAY,CAAC,EAAE,eAAe,CAC5B,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,UAAU,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAC7F,CAAC;IAEF;;OAEG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,UAAU,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAC7F,CAAC;IAEF,aAAa,CAAC,EAAE,eAAe,CAC7B,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,UAAU,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAC7F,CAAC;IAEF;;OAEG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,UAAU,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAC7F,CAAC;IAEF,WAAW,CAAC,EAAE,eAAe,CAC3B,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,UAAU,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAC7F,CAAC;IAEF;;OAEG;IACH,EAAE,CAAC,EAAE,eAAe,CAClB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,UAAU,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAC7F,CAAC;IAEF,OAAO,CAAC,EAAE,eAAe,CACvB,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,aAAa,GAAG,QAAQ,GAAG,cAAc,GAAG,MAAM,CAC/E,CAAC;IAEF,QAAQ,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,OAAO,GAAG,QAAQ,CAAC;IAExD,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAC;IAErD,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,CAAC;IAErD,MAAM,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;IAEhC;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,GAAG,IAAI,CAAC;IAExC;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,GAAG,IAAI,CAAC;IAGtC,aAAa,CAAC,EAAE,eAAe,CAAC,KAAK,GAAG,QAAQ,GAAG,aAAa,GAAG,gBAAgB,CAAC,CAAC;IAErF;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,cAAc,GAAG,QAAQ,GAAG,IAAI,CAAC;IAErD,cAAc,CAAC,EAAE,YAAY,GAAG,UAAU,GAAG,QAAQ,GAAG,eAAe,GAAG,cAAc,CAAC;IAEzF;;OAEG;IACH,WAAW,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,SAAS,CAAC;IAErD,UAAU,CAAC,EAAE,YAAY,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;IAE9D,YAAY,CAAC,EAAE,YAAY,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;IAEhE,SAAS,CAAC,EAAE,YAAY,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;IAE7D,GAAG,CAAC,EAAE,eAAe,CACnB,SAAS,GAAG,YAAY,QAAQ,EAAE,GAAG,YAAY,QAAQ,EAAE,GAAG,CAAC,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAChF,CAAC;IAKF,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,OAAO,CAAC,EAAE,MAAM,CAAC;IAGjB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B,OAAO,CAAC,EAAE;QACR,EAAE,CAAC,EAAE,aAAa,GAAG,kBAAkB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;QAExD,UAAU,CAAC,EAAE,aAAa,GAAG,kBAAkB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;KACjE,CAAC;CACH,GAAG,CACA,CAAC,eAAe,GAAG;KAAG,CAAC,IAAI,MAAM,gBAAgB,CAAC,CAAC,EAAE,KAAK;CAAE,CAAC,GAC7D,CAAC,gBAAgB,GAAG;KAAG,CAAC,IAAI,MAAM,eAAe,CAAC,CAAC,EAAE,KAAK;CAAE,CAAC,CAChE,CAAC;AAEF,KAAK,aAAa,GAAG,UAAU,GAAG;IAChC,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF,wBAAgB,aAAa,CAAC,CAAC,SAAS,aAAa,EACnD,KAAK,EAAE,CAAC,GACP;IACD,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC;IAC3B,SAAS,EAAE,IAAI,CAAC,CAAC,EAAE,MAAM,aAAa,CAAC,CAAC;CACzC,CAuPA;AAED,wBAAgB,cAAc,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,EAC5C,SAAS,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,oHAY3D"}
package/lib/utils/styled.js CHANGED
@@ -33,6 +33,7 @@ function handleDimension(dimension) {
33
33
  }
34
34
  function handleBleed(dimension, direction) {
35
35
  if (dimension === "asPadding") return `var(--seed-box-padding-${direction})`;
36
+ if (dimension === "safeArea") return `var(--seed-safe-area-${direction})`;
36
37
  return handleDimension(dimension);
37
38
  }
38
39
  function handleShadow(shadow) {
@@ -102,9 +103,9 @@ function useStyleProps(props) {
102
103
  ...(paddingX ?? px) !== void 0 && resolveResponsive("--seed-box-padding-x", paddingX ?? px, handleDimension),
103
104
  ...(paddingY ?? py) !== void 0 && resolveResponsive("--seed-box-padding-y", paddingY ?? py, handleDimension),
104
105
  ...(paddingTop ?? pt) !== void 0 && resolveResponsive("--seed-box-padding-top", paddingTop ?? pt, (v) => handlePaddingWithSafeArea(v, "top")),
105
- ...(paddingRight ?? pr) !== void 0 && resolveResponsive("--seed-box-padding-right", paddingRight ?? pr, handleDimension),
106
+ ...(paddingRight ?? pr) !== void 0 && resolveResponsive("--seed-box-padding-right", paddingRight ?? pr, (v) => handlePaddingWithSafeArea(v, "right")),
106
107
  ...(paddingBottom ?? pb) !== void 0 && resolveResponsive("--seed-box-padding-bottom", paddingBottom ?? pb, (v) => handlePaddingWithSafeArea(v, "bottom")),
107
- ...(paddingLeft ?? pl) !== void 0 && resolveResponsive("--seed-box-padding-left", paddingLeft ?? pl, handleDimension),
108
+ ...(paddingLeft ?? pl) !== void 0 && resolveResponsive("--seed-box-padding-left", paddingLeft ?? pl, (v) => handlePaddingWithSafeArea(v, "left")),
108
109
  ...(bleedTop ?? bleedY ?? bleed) !== void 0 && resolveResponsive("--seed-box-bleed-top", bleedTop ?? bleedY ?? bleed, (v) => handleBleed(v, "top")),
109
110
  ...(bleedRight ?? bleedX ?? bleed) !== void 0 && resolveResponsive("--seed-box-bleed-right", bleedRight ?? bleedX ?? bleed, (v) => handleBleed(v, "right")),
110
111
  ...(bleedBottom ?? bleedY ?? bleed) !== void 0 && resolveResponsive("--seed-box-bleed-bottom", bleedBottom ?? bleedY ?? bleed, (v) => handleBleed(v, "bottom")),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seed-design/react",
3
- "version": "2.5.1",
3
+ "version": "2.6.1",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/daangn/seed-design.git",
@@ -83,7 +83,7 @@
83
83
  "unicode-segmenter": "^0.17.3"
84
84
  },
85
85
  "peerDependencies": {
86
- "@seed-design/css": "^2.8.0",
86
+ "@seed-design/css": "^2.9.0",
87
87
  "react": ">=18.0.0",
88
88
  "react-dom": ">=18.0.0"
89
89
  },
package/src/components/Box/Box.test.tsx ADDED
@@ -0,0 +1,88 @@
1
+ import { render, screen } from "@testing-library/react";
2
+ import { describe, expect, it } from "bun:test";
3
+ import { Box } from "./Box";
4
+
5
+ describe("Box safeArea", () => {
6
+ it("resolves pl and pr to the inline safe area insets", () => {
7
+ render(<Box data-testid="box" pl="safeArea" pr="safeArea" />);
8
+ const { style } = screen.getByTestId("box");
9
+
10
+ expect(style.getPropertyValue("--seed-box-padding-left-base")).toBe(
11
+ "var(--seed-safe-area-left)",
12
+ );
13
+ expect(style.getPropertyValue("--seed-box-padding-right-base")).toBe(
14
+ "var(--seed-safe-area-right)",
15
+ );
16
+ });
17
+
18
+ it("keeps resolving other pl and pr values as dimensions", () => {
19
+ render(<Box data-testid="box" pl="spacingX.globalGutter" pr="x4" />);
20
+ const { style } = screen.getByTestId("box");
21
+
22
+ expect(style.getPropertyValue("--seed-box-padding-left-base")).toBe(
23
+ "var(--seed-dimension-spacing-x-global-gutter)",
24
+ );
25
+ expect(style.getPropertyValue("--seed-box-padding-right-base")).toBe(
26
+ "var(--seed-dimension-x4)",
27
+ );
28
+ });
29
+
30
+ it("resolves safeArea per breakpoint", () => {
31
+ render(<Box data-testid="box" pl={{ base: "safeArea", md: "x4" }} />);
32
+ const { style } = screen.getByTestId("box");
33
+
34
+ expect(style.getPropertyValue("--seed-box-padding-left-base")).toBe(
35
+ "var(--seed-safe-area-left)",
36
+ );
37
+ expect(style.getPropertyValue("--seed-box-padding-left-md")).toBe("var(--seed-dimension-x4)");
38
+ });
39
+
40
+ it("prefers paddingLeft over pl", () => {
41
+ render(<Box data-testid="box" paddingLeft="safeArea" pl="x4" />);
42
+ const { style } = screen.getByTestId("box");
43
+
44
+ expect(style.getPropertyValue("--seed-box-padding-left-base")).toBe(
45
+ "var(--seed-safe-area-left)",
46
+ );
47
+ });
48
+
49
+ it("resolves directional bleed to the safe area inset and its negative margin", () => {
50
+ render(<Box data-testid="box" bleedLeft="safeArea" bleedTop="safeArea" />);
51
+ const { style } = screen.getByTestId("box");
52
+
53
+ expect(style.getPropertyValue("--seed-box-bleed-left-base")).toBe("var(--seed-safe-area-left)");
54
+ expect(style.getPropertyValue("--seed-box-margin-left-base")).toBe(
55
+ "calc(var(--seed-safe-area-left) * -1)",
56
+ );
57
+ expect(style.getPropertyValue("--seed-box-bleed-top-base")).toBe("var(--seed-safe-area-top)");
58
+ expect(style.getPropertyValue("--seed-box-margin-top-base")).toBe(
59
+ "calc(var(--seed-safe-area-top) * -1)",
60
+ );
61
+ });
62
+
63
+ it("resolves bleedX and bleedY to each side's own inset", () => {
64
+ render(<Box data-testid="box" bleedX="safeArea" bleedY="safeArea" />);
65
+ const { style } = screen.getByTestId("box");
66
+
67
+ expect(style.getPropertyValue("--seed-box-bleed-left-base")).toBe("var(--seed-safe-area-left)");
68
+ expect(style.getPropertyValue("--seed-box-bleed-right-base")).toBe(
69
+ "var(--seed-safe-area-right)",
70
+ );
71
+ expect(style.getPropertyValue("--seed-box-margin-right-base")).toBe(
72
+ "calc(var(--seed-safe-area-right) * -1)",
73
+ );
74
+ expect(style.getPropertyValue("--seed-box-bleed-top-base")).toBe("var(--seed-safe-area-top)");
75
+ expect(style.getPropertyValue("--seed-box-bleed-bottom-base")).toBe(
76
+ "var(--seed-safe-area-bottom)",
77
+ );
78
+ });
79
+
80
+ it("lets a directional bleed override bleed", () => {
81
+ render(<Box data-testid="box" bleed="safeArea" bleedBottom="x4" />);
82
+ const { style } = screen.getByTestId("box");
83
+
84
+ expect(style.getPropertyValue("--seed-box-bleed-top-base")).toBe("var(--seed-safe-area-top)");
85
+ expect(style.getPropertyValue("--seed-box-bleed-left-base")).toBe("var(--seed-safe-area-left)");
86
+ expect(style.getPropertyValue("--seed-box-bleed-bottom-base")).toBe("var(--seed-dimension-x4)");
87
+ });
88
+ });
package/src/components/TextField/TextField.tsx CHANGED
@@ -154,6 +154,14 @@ export const TextFieldTextarea = forwardRef<HTMLTextAreaElement, TextFieldTextar
154
154
  input.style.overflow = "hidden";
155
155
  }
156
156
 
157
+ // `auto`로 줄인 채 scrollHeight를 읽으면 줄어든 레이아웃이 확정된다. 아래로 남은 스크롤
158
+ // 거리가 줄어든 양보다 작으면 조상(문서 포함)의 scrollTop이 줄어든 범위로 잘리고,
159
+ // 높이를 되돌려도 복원되지 않는다.
160
+ // 측정하는 동안 부모 높이를 고정해 바깥 레이아웃이 줄어들지 않게 한다.
161
+ const parent = input.parentElement;
162
+ const prevParentMinHeight = parent?.style.minHeight ?? "";
163
+ if (parent) parent.style.minHeight = getComputedStyle(parent).height;
164
+
157
165
  input.style.alignSelf = "start";
158
166
  input.style.height = "auto";
159
167
 
@@ -162,6 +170,7 @@ export const TextFieldTextarea = forwardRef<HTMLTextAreaElement, TextFieldTextar
162
170
 
163
171
  input.style.overflow = prevOverflow;
164
172
  input.style.alignSelf = prevAlignment;
173
+ if (parent) parent.style.minHeight = prevParentMinHeight;
165
174
  }, [inputRef, otherProps.style?.height, autoresize]);
166
175
 
167
176
  useLayoutEffect(() => {
package/src/utils/styled.tsx CHANGED
@@ -71,13 +71,17 @@ export function handleDimension(dimension: string | 0 | undefined): string | und
71
71
  }
72
72
 
73
73
  function handleBleed(
74
- dimension: "asPadding" | string | 0 | undefined,
74
+ dimension: "asPadding" | "safeArea" | string | 0 | undefined,
75
75
  direction: "top" | "right" | "bottom" | "left",
76
76
  ) {
77
77
  if (dimension === "asPadding") {
78
78
  return `var(--seed-box-padding-${direction})`;
79
79
  }
80
80
 
81
+ if (dimension === "safeArea") {
82
+ return `var(--seed-safe-area-${direction})`;
83
+ }
84
+
81
85
  return handleDimension(dimension);
82
86
  }
83
87
 
@@ -92,7 +96,7 @@ function handleShadow(shadow: Shadow | (string & {}) | undefined) {
92
96
 
93
97
  function handlePaddingWithSafeArea(
94
98
  padding: string | 0 | undefined,
95
- direction: "top" | "bottom",
99
+ direction: "top" | "right" | "bottom" | "left",
96
100
  ): string | undefined {
97
101
  if (padding === "safeArea") {
98
102
  return `var(--seed-safe-area-${direction})`;
@@ -257,71 +261,120 @@ interface BleedStyleProps {
257
261
  /**
258
262
  * Negative margin on all four sides to extend the element outside its parent.
259
263
  * If set to "asPadding", it will use the padding value in the same direction.
264
+ * If set to "safeArea", it will use the safe area inset in the same direction.
260
265
  *
261
266
  * Cannot be combined with any `margin*` prop.
262
267
  */
263
268
  bleed?: ResponsiveValue<
264
- "asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
269
+ | "asPadding"
270
+ | "safeArea"
271
+ | Dimension
272
+ | `spacingX.${SpacingX}`
273
+ | `spacingY.${SpacingY}`
274
+ | 0
275
+ | (string & {})
265
276
  >;
266
277
 
267
278
  /**
268
279
  * Negative x-axis margin to extend the element outside its parent.
269
280
  * If set to "asPadding", it will use the padding value in the same direction.
281
+ * If set to "safeArea", it will use the safe area inset in the same direction.
270
282
  *
271
283
  * Cannot be combined with any `margin*` prop.
272
284
  */
273
285
  bleedX?: ResponsiveValue<
274
- "asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
286
+ | "asPadding"
287
+ | "safeArea"
288
+ | Dimension
289
+ | `spacingX.${SpacingX}`
290
+ | `spacingY.${SpacingY}`
291
+ | 0
292
+ | (string & {})
275
293
  >;
276
294
 
277
295
  /**
278
296
  * Negative y-axis margin to extend the element outside its parent.
279
297
  * If set to "asPadding", it will use the padding value in the same direction.
298
+ * If set to "safeArea", it will use the safe area inset in the same direction.
280
299
  *
281
300
  * Cannot be combined with any `margin*` prop.
282
301
  */
283
302
  bleedY?: ResponsiveValue<
284
- "asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
303
+ | "asPadding"
304
+ | "safeArea"
305
+ | Dimension
306
+ | `spacingX.${SpacingX}`
307
+ | `spacingY.${SpacingY}`
308
+ | 0
309
+ | (string & {})
285
310
  >;
286
311
 
287
312
  /**
288
313
  * Negative top margin to extend the element outside its parent.
289
314
  * If set to "asPadding", it will use the padding value in the same direction.
315
+ * If set to "safeArea", it will use the safe area inset in the same direction.
290
316
  *
291
317
  * Cannot be combined with any `margin*` prop.
292
318
  */
293
319
  bleedTop?: ResponsiveValue<
294
- "asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
320
+ | "asPadding"
321
+ | "safeArea"
322
+ | Dimension
323
+ | `spacingX.${SpacingX}`
324
+ | `spacingY.${SpacingY}`
325
+ | 0
326
+ | (string & {})
295
327
  >;
296
328
 
297
329
  /**
298
330
  * Negative right margin to extend the element outside its parent.
299
331
  * If set to "asPadding", it will use the padding value in the same direction.
332
+ * If set to "safeArea", it will use the safe area inset in the same direction.
300
333
  *
301
334
  * Cannot be combined with any `margin*` prop.
302
335
  */
303
336
  bleedRight?: ResponsiveValue<
304
- "asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
337
+ | "asPadding"
338
+ | "safeArea"
339
+ | Dimension
340
+ | `spacingX.${SpacingX}`
341
+ | `spacingY.${SpacingY}`
342
+ | 0
343
+ | (string & {})
305
344
  >;
306
345
 
307
346
  /**
308
347
  * Negative bottom margin to extend the element outside its parent.
309
348
  * If set to "asPadding", it will use the padding value in the same direction.
349
+ * If set to "safeArea", it will use the safe area inset in the same direction.
310
350
  *
311
351
  * Cannot be combined with any `margin*` prop.
312
352
  */
313
353
  bleedBottom?: ResponsiveValue<
314
- "asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
354
+ | "asPadding"
355
+ | "safeArea"
356
+ | Dimension
357
+ | `spacingX.${SpacingX}`
358
+ | `spacingY.${SpacingY}`
359
+ | 0
360
+ | (string & {})
315
361
  >;
316
362
 
317
363
  /**
318
364
  * Negative left margin to extend the element outside its parent.
319
365
  * If set to "asPadding", it will use the padding value in the same direction.
366
+ * If set to "safeArea", it will use the safe area inset in the same direction.
320
367
  *
321
368
  * Cannot be combined with any `margin*` prop.
322
369
  */
323
370
  bleedLeft?: ResponsiveValue<
324
- "asPadding" | Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
371
+ | "asPadding"
372
+ | "safeArea"
373
+ | Dimension
374
+ | `spacingX.${SpacingX}`
375
+ | `spacingY.${SpacingY}`
376
+ | 0
377
+ | (string & {})
325
378
  >;
326
379
  }
327
380
 
@@ -479,14 +532,14 @@ export type StyleProps = {
479
532
  >;
480
533
 
481
534
  paddingRight?: ResponsiveValue<
482
- Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
535
+ Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})
483
536
  >;
484
537
 
485
538
  /**
486
539
  * Shorthand for `paddingRight`.
487
540
  */
488
541
  pr?: ResponsiveValue<
489
- Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
542
+ Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})
490
543
  >;
491
544
 
492
545
  paddingBottom?: ResponsiveValue<
@@ -501,14 +554,14 @@ export type StyleProps = {
501
554
  >;
502
555
 
503
556
  paddingLeft?: ResponsiveValue<
504
- Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
557
+ Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})
505
558
  >;
506
559
 
507
560
  /**
508
561
  * Shorthand for `paddingLeft`.
509
562
  */
510
563
  pl?: ResponsiveValue<
511
- Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | (string & {})
564
+ Dimension | `spacingX.${SpacingX}` | `spacingY.${SpacingY}` | 0 | "safeArea" | (string & {})
512
565
  >;
513
566
 
514
567
  display?: ResponsiveValue<
@@ -747,13 +800,17 @@ export function useStyleProps<T extends UseStyleProps>(
747
800
  handlePaddingWithSafeArea(v, "top"),
748
801
  )),
749
802
  ...((paddingRight ?? pr) !== undefined &&
750
- resolveResponsive("--seed-box-padding-right", paddingRight ?? pr, handleDimension)),
803
+ resolveResponsive("--seed-box-padding-right", paddingRight ?? pr, (v) =>
804
+ handlePaddingWithSafeArea(v, "right"),
805
+ )),
751
806
  ...((paddingBottom ?? pb) !== undefined &&
752
807
  resolveResponsive("--seed-box-padding-bottom", paddingBottom ?? pb, (v) =>
753
808
  handlePaddingWithSafeArea(v, "bottom"),
754
809
  )),
755
810
  ...((paddingLeft ?? pl) !== undefined &&
756
- resolveResponsive("--seed-box-padding-left", paddingLeft ?? pl, handleDimension)),
811
+ resolveResponsive("--seed-box-padding-left", paddingLeft ?? pl, (v) =>
812
+ handlePaddingWithSafeArea(v, "left"),
813
+ )),
757
814
  ...((bleedTop ?? bleedY ?? bleed) !== undefined &&
758
815
  resolveResponsive("--seed-box-bleed-top", bleedTop ?? bleedY ?? bleed, (v) =>
759
816
  handleBleed(v, "top"),