@a-type/ui 6.0.71 → 6.0.72

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 (11) hide show
  1. package/dist/components/box/Box.d.ts +5 -1
  2. package/dist/components/box/Box.js +2 -2
  3. package/dist/components/box/Box.js.map +1 -1
  4. package/dist/components/box/Box.module.css +13 -6
  5. package/dist/components/box/Box.stories.d.ts +27 -0
  6. package/dist/components/box/Box.stories.js +27 -0
  7. package/dist/components/box/Box.stories.js.map +1 -1
  8. package/package.json +1 -1
  9. package/src/components/box/Box.module.css +13 -6
  10. package/src/components/box/Box.stories.tsx +27 -0
  11. package/src/components/box/Box.tsx +6 -0
package/dist/components/box/Box.d.ts CHANGED
@@ -41,6 +41,10 @@ export interface BoxProps extends Omit<SlotDivProps, 'wrap'> {
41
41
  * Adjust padding
42
42
  */
43
43
  p?: BoxSpacingSize | boolean;
44
+ /**
45
+ * Reduce padding in one axis by one level
46
+ */
47
+ squish?: 'vertical' | 'horizontal';
44
48
  /**
45
49
  * Apply surface intents
46
50
  */
@@ -87,5 +91,5 @@ export interface BoxProps extends Omit<SlotDivProps, 'wrap'> {
87
91
  dim?: boolean;
88
92
  self?: 'auto' | 'start' | 'end' | 'center' | 'stretch';
89
93
  }
90
- export declare function Box({ className, items: itemsSolo, justify: justifySolo, layout, gap, wrap, p, col, reverse, style, container, surface, color, border, full, overflow, grow, shrink, elevated, rounded, round, glass, dim, self, ref, ...rest }: BoxProps): import("react/jsx-runtime").JSX.Element;
94
+ export declare function Box({ className, items: itemsSolo, justify: justifySolo, layout, gap, wrap, p, col, reverse, style, container, surface, color, border, full, overflow, grow, shrink, elevated, rounded, round, glass, dim, self, squish, ref, ...rest }: BoxProps): import("react/jsx-runtime").JSX.Element;
91
95
  export {};
package/dist/components/box/Box.js CHANGED
@@ -15,11 +15,11 @@ import { SlotDiv } from '../utility/SlotDiv.js';
15
15
  import cls from './Box.module.css';
16
16
  export function Box(_a) {
17
17
  var _b;
18
- var { className, items: itemsSolo, justify: justifySolo, layout, gap, wrap, p, col, reverse, style, container, surface, color, border, full, overflow, grow, shrink, elevated, rounded = surface ? true : undefined, round = rounded, glass, dim, self, ref } = _a, rest = __rest(_a, ["className", "items", "justify", "layout", "gap", "wrap", "p", "col", "reverse", "style", "container", "surface", "color", "border", "full", "overflow", "grow", "shrink", "elevated", "rounded", "round", "glass", "dim", "self", "ref"]);
18
+ var { className, items: itemsSolo, justify: justifySolo, layout, gap, wrap, p, col, reverse, style, container, surface, color, border, full, overflow, grow, shrink, elevated, rounded = surface ? true : undefined, round = rounded, glass, dim, self, squish, ref } = _a, rest = __rest(_a, ["className", "items", "justify", "layout", "gap", "wrap", "p", "col", "reverse", "style", "container", "surface", "color", "border", "full", "overflow", "grow", "shrink", "elevated", "rounded", "round", "glass", "dim", "self", "squish", "ref"]);
19
19
  const items = itemsSolo !== null && itemsSolo !== void 0 ? itemsSolo : layout === null || layout === void 0 ? void 0 : layout.split(' ')[0];
20
20
  const justify = (_b = justifySolo !== null && justifySolo !== void 0 ? justifySolo : layout === null || layout === void 0 ? void 0 : layout.split(' ')[1]) !== null && _b !== void 0 ? _b : layout;
21
21
  const [inset, elevation, up] = parseElevated(elevated);
22
- const main = (_jsx(SlotDiv, Object.assign({ ref: ref }, rest, { style: style, className: clsx(color && `@mode-${color}`, cls.root, className), "data-col": col ? '' : undefined, "data-reverse": reverse ? '' : undefined, "data-gap": gap, "data-items": items, "data-justify": justify, "data-wrap": wrap, "data-p": p, "data-rounded": round, "data-surface": surface, "data-border": border, "data-full": full, "data-overflow": overflow, "data-grow": grow, "data-shrink": shrink, "data-elevated": elevation, "data-shadow-up": up, "data-shadow-inset": inset, "data-container": container, "data-glass": glass, "data-self": self, "data-dim": dim })));
22
+ const main = (_jsx(SlotDiv, Object.assign({ ref: ref }, rest, { style: style, className: clsx(color && `@mode-${color}`, cls.root, className), "data-col": col ? '' : undefined, "data-reverse": reverse ? '' : undefined, "data-gap": gap, "data-items": items, "data-justify": justify, "data-wrap": wrap, "data-p": p, "data-rounded": round, "data-surface": surface, "data-border": border, "data-full": full, "data-overflow": overflow, "data-grow": grow, "data-shrink": shrink, "data-elevated": elevation, "data-shadow-up": up, "data-shadow-inset": inset, "data-container": container, "data-glass": glass, "data-self": self, "data-dim": dim, "data-squish": squish })));
23
23
  return main;
24
24
  }
25
25
  function parseElevated(elevated) {
package/dist/components/box/Box.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Box.js","sourceRoot":"","sources":["../../../src/components/box/Box.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,OAAO,EAAgB,MAAM,uBAAuB,CAAC;AAC9D,OAAO,GAAG,MAAM,kBAAkB,CAAC;AAqGnC,MAAM,UAAU,GAAG,CAAC,EA2BT;;QA3BS,EACnB,SAAS,EACT,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,WAAW,EACpB,MAAM,EACN,GAAG,EACH,IAAI,EACJ,CAAC,EACD,GAAG,EACH,OAAO,EACP,KAAK,EACL,SAAS,EACT,OAAO,EACP,KAAK,EACL,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACpC,KAAK,GAAG,OAAO,EACf,KAAK,EACL,GAAG,EACH,IAAI,EACJ,GAAG,OAEO,EADP,IAAI,cA1BY,0OA2BnB,CADO;IAEP,MAAM,KAAK,GAAG,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;IACjD,MAAM,OAAO,GAAG,MAAA,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,mCAAI,MAAM,CAAC;IAC/D,MAAM,CAAC,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC;IAEvD,MAAM,IAAI,GAAG,CACZ,KAAC,OAAO,kBACP,GAAG,EAAE,GAAG,IACJ,IAAI,IACR,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,IAAI,CAAC,KAAK,IAAI,SAAS,KAAK,EAAE,EAAE,GAAG,CAAC,IAAI,EAAE,SAAS,CAAC,cACrD,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,kBAChB,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,cAC5B,GAAG,gBACD,KAAK,kBACH,OAAO,eACV,IAAI,YACP,CAAC,kBACK,KAAK,kBACL,OAAO,iBACR,MAAM,eACR,IAAI,mBACA,QAAQ,eACZ,IAAI,iBACF,MAAM,mBACJ,SAAS,oBACR,EAAE,uBACC,KAAK,oBACR,SAAS,gBACb,KAAK,eACN,IAAI,cACL,GAAG,IACZ,CACF,CAAC;IAEF,OAAO,IAAI,CAAC;AACb,CAAC;AAED,SAAS,aAAa,CAAC,QAAsB;IAC5C,IAAI,CAAC,QAAQ;QAAE,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAU,CAAC;IAErD,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,2BAA2B,CAAC,CAAC;IAC1D,IAAI,CAAC,KAAK,EAAE,CAAC;QACZ,OAAO,CAAC,IAAI,CACX,2BAA2B,QAAQ,iFAAiF,CACpH,CAAC;QACF,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAU,CAAC;IACvC,CAAC;IAED,MAAM,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,CAAC,GAAG,KAAK,CAAC;IAClC,MAAM,KAAK,GAAG,KAAK,KAAK,GAAG,CAAC;IAC5B,MAAM,SAAS,GAAG,IAAkB,CAAC;IACrC,MAAM,IAAI,GAAG,EAAE,KAAK,KAAK,CAAC;IAE1B,OAAO,CAAC,KAAK,EAAE,SAAS,EAAE,IAAI,CAAU,CAAC;AAC1C,CAAC"}
1
+ {"version":3,"file":"Box.js","sourceRoot":"","sources":["../../../src/components/box/Box.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,OAAO,EAAgB,MAAM,uBAAuB,CAAC;AAC9D,OAAO,GAAG,MAAM,kBAAkB,CAAC;AAyGnC,MAAM,UAAU,GAAG,CAAC,EA4BT;;QA5BS,EACnB,SAAS,EACT,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,WAAW,EACpB,MAAM,EACN,GAAG,EACH,IAAI,EACJ,CAAC,EACD,GAAG,EACH,OAAO,EACP,KAAK,EACL,SAAS,EACT,OAAO,EACP,KAAK,EACL,MAAM,EACN,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACpC,KAAK,GAAG,OAAO,EACf,KAAK,EACL,GAAG,EACH,IAAI,EACJ,MAAM,EACN,GAAG,OAEO,EADP,IAAI,cA3BY,oPA4BnB,CADO;IAEP,MAAM,KAAK,GAAG,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;IACjD,MAAM,OAAO,GAAG,MAAA,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,KAAK,CAAC,GAAG,EAAE,CAAC,CAAC,mCAAI,MAAM,CAAC;IAC/D,MAAM,CAAC,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,GAAG,aAAa,CAAC,QAAQ,CAAC,CAAC;IAEvD,MAAM,IAAI,GAAG,CACZ,KAAC,OAAO,kBACP,GAAG,EAAE,GAAG,IACJ,IAAI,IACR,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,IAAI,CAAC,KAAK,IAAI,SAAS,KAAK,EAAE,EAAE,GAAG,CAAC,IAAI,EAAE,SAAS,CAAC,cACrD,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,kBAChB,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,cAC5B,GAAG,gBACD,KAAK,kBACH,OAAO,eACV,IAAI,YACP,CAAC,kBACK,KAAK,kBACL,OAAO,iBACR,MAAM,eACR,IAAI,mBACA,QAAQ,eACZ,IAAI,iBACF,MAAM,mBACJ,SAAS,oBACR,EAAE,uBACC,KAAK,oBACR,SAAS,gBACb,KAAK,eACN,IAAI,cACL,GAAG,iBACA,MAAM,IAClB,CACF,CAAC;IAEF,OAAO,IAAI,CAAC;AACb,CAAC;AAED,SAAS,aAAa,CAAC,QAAsB;IAC5C,IAAI,CAAC,QAAQ;QAAE,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAU,CAAC;IAErD,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,2BAA2B,CAAC,CAAC;IAC1D,IAAI,CAAC,KAAK,EAAE,CAAC;QACZ,OAAO,CAAC,IAAI,CACX,2BAA2B,QAAQ,iFAAiF,CACpH,CAAC;QACF,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAU,CAAC;IACvC,CAAC;IAED,MAAM,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,CAAC,GAAG,KAAK,CAAC;IAClC,MAAM,KAAK,GAAG,KAAK,KAAK,GAAG,CAAC;IAC5B,MAAM,SAAS,GAAG,IAAkB,CAAC;IACrC,MAAM,IAAI,GAAG,EAAE,KAAK,KAAK,CAAC;IAE1B,OAAO,CAAC,KAAK,EAAE,SAAS,EAAE,IAAI,CAAU,CAAC;AAC1C,CAAC"}
package/dist/components/box/Box.module.css CHANGED
@@ -89,23 +89,30 @@
89
89
  }
90
90
 
91
91
  &[data-p='none'] {
92
- padding: 0;
92
+ --padding: 0;
93
93
  }
94
94
  &[data-p='xs'] {
95
- padding: var(--m-space-xs);
95
+ --padding: var(--m-space-xs);
96
96
  }
97
97
  &[data-p='sm'] {
98
- padding: var(--m-space-sm);
98
+ --padding: var(--m-space-sm);
99
99
  }
100
100
  &[data-p='md'] {
101
- padding: var(--m-space-md);
101
+ --padding: var(--m-space-md);
102
102
  }
103
103
  &[data-p='lg'],
104
104
  &[data-p='true'] {
105
- padding: var(--m-space-lg);
105
+ --padding: var(--m-space-lg);
106
106
  }
107
107
  &[data-p='xl'] {
108
- padding: var(--m-space-xl);
108
+ --padding: var(--m-space-xl);
109
+ }
110
+ padding: var(--padding, 0);
111
+ &[data-squish='vertical'] {
112
+ padding-block: calc(var(--padding, 0) / 2);
113
+ }
114
+ &[data-squish='horizontal'] {
115
+ padding-inline: calc(var(--padding, 0) / 2);
109
116
  }
110
117
 
111
118
  &[data-rounded='none'] {
package/dist/components/box/Box.stories.d.ts CHANGED
@@ -28,6 +28,33 @@ declare const meta: {
28
28
  container: {
29
29
  type: "boolean";
30
30
  };
31
+ p: {
32
+ type: "string";
33
+ options: string[];
34
+ control: {
35
+ type: "select";
36
+ };
37
+ };
38
+ gap: {
39
+ type: "string";
40
+ options: string[];
41
+ control: {
42
+ type: "select";
43
+ };
44
+ };
45
+ col: {
46
+ type: "boolean";
47
+ };
48
+ reverse: {
49
+ type: "boolean";
50
+ };
51
+ squish: {
52
+ type: "string";
53
+ options: string[];
54
+ control: {
55
+ type: "select";
56
+ };
57
+ };
31
58
  children: {
32
59
  table: {
33
60
  disable: true;
package/dist/components/box/Box.stories.js CHANGED
@@ -53,6 +53,33 @@ const meta = {
53
53
  container: {
54
54
  type: 'boolean',
55
55
  },
56
+ p: {
57
+ type: 'string',
58
+ options: ['none', 'xs', 'sm', 'md', 'lg', 'xl'],
59
+ control: {
60
+ type: 'select',
61
+ },
62
+ },
63
+ gap: {
64
+ type: 'string',
65
+ options: ['none', 'xs', 'sm', 'md', 'lg', 'xl'],
66
+ control: {
67
+ type: 'select',
68
+ },
69
+ },
70
+ col: {
71
+ type: 'boolean',
72
+ },
73
+ reverse: {
74
+ type: 'boolean',
75
+ },
76
+ squish: {
77
+ type: 'string',
78
+ options: ['horizontal', 'vertical'],
79
+ control: {
80
+ type: 'select',
81
+ },
82
+ },
56
83
  children: {
57
84
  table: {
58
85
  disable: true,
package/dist/components/box/Box.stories.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Box.stories.js","sourceRoot":"","sources":["../../../src/components/box/Box.stories.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Box.stories.js","sourceRoot":"","sources":["../../../src/components/box/Box.stories.tsx"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@a-type/ui",
3
- "version": "6.0.71",
3
+ "version": "6.0.72",
4
4
  "type": "module",
5
5
  "repository": {
6
6
  "url": "https://github.com/a-type/ui"
package/src/components/box/Box.module.css CHANGED
@@ -89,23 +89,30 @@
89
89
  }
90
90
 
91
91
  &[data-p='none'] {
92
- padding: 0;
92
+ --padding: 0;
93
93
  }
94
94
  &[data-p='xs'] {
95
- padding: var(--m-space-xs);
95
+ --padding: var(--m-space-xs);
96
96
  }
97
97
  &[data-p='sm'] {
98
- padding: var(--m-space-sm);
98
+ --padding: var(--m-space-sm);
99
99
  }
100
100
  &[data-p='md'] {
101
- padding: var(--m-space-md);
101
+ --padding: var(--m-space-md);
102
102
  }
103
103
  &[data-p='lg'],
104
104
  &[data-p='true'] {
105
- padding: var(--m-space-lg);
105
+ --padding: var(--m-space-lg);
106
106
  }
107
107
  &[data-p='xl'] {
108
- padding: var(--m-space-xl);
108
+ --padding: var(--m-space-xl);
109
+ }
110
+ padding: var(--padding, 0);
111
+ &[data-squish='vertical'] {
112
+ padding-block: calc(var(--padding, 0) / 2);
113
+ }
114
+ &[data-squish='horizontal'] {
115
+ padding-inline: calc(var(--padding, 0) / 2);
109
116
  }
110
117
 
111
118
  &[data-rounded='none'] {
package/src/components/box/Box.stories.tsx CHANGED
@@ -54,6 +54,33 @@ const meta = {
54
54
  container: {
55
55
  type: 'boolean',
56
56
  },
57
+ p: {
58
+ type: 'string',
59
+ options: ['none', 'xs', 'sm', 'md', 'lg', 'xl'],
60
+ control: {
61
+ type: 'select',
62
+ },
63
+ },
64
+ gap: {
65
+ type: 'string',
66
+ options: ['none', 'xs', 'sm', 'md', 'lg', 'xl'],
67
+ control: {
68
+ type: 'select',
69
+ },
70
+ },
71
+ col: {
72
+ type: 'boolean',
73
+ },
74
+ reverse: {
75
+ type: 'boolean',
76
+ },
77
+ squish: {
78
+ type: 'string',
79
+ options: ['horizontal', 'vertical'],
80
+ control: {
81
+ type: 'select',
82
+ },
83
+ },
57
84
  children: {
58
85
  table: {
59
86
  disable: true,
package/src/components/box/Box.tsx CHANGED
@@ -55,6 +55,10 @@ export interface BoxProps extends Omit<SlotDivProps, 'wrap'> {
55
55
  * Adjust padding
56
56
  */
57
57
  p?: BoxSpacingSize | boolean;
58
+ /**
59
+ * Reduce padding in one axis by one level
60
+ */
61
+ squish?: 'vertical' | 'horizontal';
58
62
  /**
59
63
  * Apply surface intents
60
64
  */
@@ -127,6 +131,7 @@ export function Box({
127
131
  glass,
128
132
  dim,
129
133
  self,
134
+ squish,
130
135
  ref,
131
136
  ...rest
132
137
  }: BoxProps) {
@@ -161,6 +166,7 @@ export function Box({
161
166
  data-glass={glass}
162
167
  data-self={self}
163
168
  data-dim={dim}
169
+ data-squish={squish}
164
170
  />
165
171
  );
166
172