@hanzo/ui 8.4.5 → 8.4.7
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.
- package/dist/box.cjs +11 -1
- package/dist/box.d.ts +13 -3
- package/dist/box.d.ts.map +1 -1
- package/dist/box.js +11 -1
- package/dist/box.js.map +1 -1
- package/dist/gallery.html +4 -3
- package/dist/styles.css +1 -0
- package/package.json +1 -1
package/dist/box.cjs
CHANGED
|
@@ -42,7 +42,13 @@ const tw_1 = require("./tw.cjs");
|
|
|
42
42
|
/** Properties a frame ignores and a DOM element passes to its children. */
|
|
43
43
|
const TEXT_PROPS = ['fontSize', 'lineHeight', 'fontWeight', 'letterSpacing',
|
|
44
44
|
'textTransform', 'fontFamily', 'fontStyle', 'textAlign', 'color',
|
|
45
|
-
'textDecorationLine', 'whiteSpace'
|
|
45
|
+
'textDecorationLine', 'whiteSpace',
|
|
46
|
+
// `tabular-nums` is the one class on a checkout that MUST survive: it is what
|
|
47
|
+
// makes a column of figures line up. tw converts it to fontVariantNumeric,
|
|
48
|
+
// which a frame drops like the rest of these, and the loss shows as a money
|
|
49
|
+
// column going ragged — a 25px total measuring 27px, which no test asserting
|
|
50
|
+
// on text would notice.
|
|
51
|
+
'fontVariantNumeric'];
|
|
46
52
|
exports.Box = (0, react_1.forwardRef)(function Box({ className, children, 'aria-hidden': hidden, tag, ...rest }, ref) {
|
|
47
53
|
const { props, rest: unread } = (0, tw_1.tw)(className);
|
|
48
54
|
// A View pins `min-height: 0`; a div's is `auto`, and auto is what gives a
|
|
@@ -50,6 +56,10 @@ exports.Box = (0, react_1.forwardRef)(function Box({ className, children, 'aria-
|
|
|
50
56
|
// a row of indefinite height measured 0px and its content vanished.
|
|
51
57
|
if (!('minHeight' in props))
|
|
52
58
|
props.minHeight = 'auto';
|
|
59
|
+
// The same fact on the other axis. A View pins `min-width: 0`, a div's is
|
|
60
|
+
// auto, and auto is what stops a flex child shrinking below its content.
|
|
61
|
+
if (!('minWidth' in props))
|
|
62
|
+
props.minWidth = 'auto';
|
|
53
63
|
// gui drops a text property set on a frame — `fontSize` is not a frame style
|
|
54
64
|
// prop, so it silently rendered at the inherited size and a page carrying
|
|
55
65
|
// `text-xs` on a box came out three pixels larger everywhere. A div DOES pass
|
package/dist/box.d.ts
CHANGED
|
@@ -34,13 +34,23 @@
|
|
|
34
34
|
import { type ReactNode } from 'react';
|
|
35
35
|
import { YStack } from '@hanzo/gui';
|
|
36
36
|
import { type ClassValue } from './tw.js';
|
|
37
|
-
|
|
37
|
+
/**
|
|
38
|
+
* The props of the element being stood in for, ALONGSIDE gui's.
|
|
39
|
+
*
|
|
40
|
+
* A `<button>` carries `type` and `disabled`, a `<form>` carries `onSubmit`, a
|
|
41
|
+
* `<select>` carries `value` and `onChange`. None of those are gui props, so a
|
|
42
|
+
* Box typed only as a Stack rejects the very markup it exists to replace — and
|
|
43
|
+
* an app converting a form finds fifteen type errors that read as a broken
|
|
44
|
+
* component rather than as a missing generic. `style` and `ref` come from each
|
|
45
|
+
* side and are taken from gui's, which is the one that reaches the DOM.
|
|
46
|
+
*/
|
|
47
|
+
export type BoxProps<T extends keyof React.JSX.IntrinsicElements = 'div'> = Omit<React.ComponentProps<typeof YStack>, 'aria-hidden'> & Omit<React.JSX.IntrinsicElements[T], 'style' | 'ref' | 'children' | 'className' | 'color'> & {
|
|
38
48
|
className?: ClassValue;
|
|
39
49
|
children?: ReactNode;
|
|
40
50
|
/**
|
|
41
51
|
* The element to render. Omitted, Box is the `<div>` it has always been.
|
|
42
52
|
*/
|
|
43
|
-
tag?:
|
|
53
|
+
tag?: T;
|
|
44
54
|
/**
|
|
45
55
|
* ARIA states are strings in markup and gui types this one as a boolean, so
|
|
46
56
|
* both spellings are taken and normalised. Rejecting `"true"` would make a
|
|
@@ -48,6 +58,6 @@ export type BoxProps = Omit<React.ComponentProps<typeof YStack>, 'aria-hidden'>
|
|
|
48
58
|
*/
|
|
49
59
|
'aria-hidden'?: boolean | 'true' | 'false';
|
|
50
60
|
};
|
|
51
|
-
export declare const Box: import("react").ForwardRefExoticComponent<Omit<BoxProps
|
|
61
|
+
export declare const Box: import("react").ForwardRefExoticComponent<Omit<BoxProps<keyof import("react").JSX.IntrinsicElements>, "ref"> & import("react").RefAttributes<any>>;
|
|
52
62
|
export default Box;
|
|
53
63
|
//# sourceMappingURL=box.d.ts.map
|
package/dist/box.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"box.d.ts","sourceRoot":"","sources":["../src/box.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AACjE,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACnC,OAAO,EAAM,KAAK,UAAU,EAAE,MAAM,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"box.d.ts","sourceRoot":"","sources":["../src/box.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AACjE,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACnC,OAAO,EAAM,KAAK,UAAU,EAAE,MAAM,MAAM,CAAA;AAa1C;;;;;;;;;GASG;AACH,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,MAAM,KAAK,CAAC,GAAG,CAAC,iBAAiB,GAAG,KAAK,IACtE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,aAAa,CAAC,GACxD,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC,GAAG;IAC3F,SAAS,CAAC,EAAE,UAAU,CAAA;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB;;OAEG;IACH,GAAG,CAAC,EAAE,CAAC,CAAA;IACP;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAA;CAC3C,CAAA;AAEH,eAAO,MAAM,GAAG,oJAwDd,CAAA;eAEa,GAAG"}
|
package/dist/box.js
CHANGED
|
@@ -39,7 +39,13 @@ import { tw } from './tw.js';
|
|
|
39
39
|
/** Properties a frame ignores and a DOM element passes to its children. */
|
|
40
40
|
const TEXT_PROPS = ['fontSize', 'lineHeight', 'fontWeight', 'letterSpacing',
|
|
41
41
|
'textTransform', 'fontFamily', 'fontStyle', 'textAlign', 'color',
|
|
42
|
-
'textDecorationLine', 'whiteSpace'
|
|
42
|
+
'textDecorationLine', 'whiteSpace',
|
|
43
|
+
// `tabular-nums` is the one class on a checkout that MUST survive: it is what
|
|
44
|
+
// makes a column of figures line up. tw converts it to fontVariantNumeric,
|
|
45
|
+
// which a frame drops like the rest of these, and the loss shows as a money
|
|
46
|
+
// column going ragged — a 25px total measuring 27px, which no test asserting
|
|
47
|
+
// on text would notice.
|
|
48
|
+
'fontVariantNumeric'];
|
|
43
49
|
export const Box = forwardRef(function Box({ className, children, 'aria-hidden': hidden, tag, ...rest }, ref) {
|
|
44
50
|
const { props, rest: unread } = tw(className);
|
|
45
51
|
// A View pins `min-height: 0`; a div's is `auto`, and auto is what gives a
|
|
@@ -47,6 +53,10 @@ export const Box = forwardRef(function Box({ className, children, 'aria-hidden':
|
|
|
47
53
|
// a row of indefinite height measured 0px and its content vanished.
|
|
48
54
|
if (!('minHeight' in props))
|
|
49
55
|
props.minHeight = 'auto';
|
|
56
|
+
// The same fact on the other axis. A View pins `min-width: 0`, a div's is
|
|
57
|
+
// auto, and auto is what stops a flex child shrinking below its content.
|
|
58
|
+
if (!('minWidth' in props))
|
|
59
|
+
props.minWidth = 'auto';
|
|
50
60
|
// gui drops a text property set on a frame — `fontSize` is not a frame style
|
|
51
61
|
// prop, so it silently rendered at the inherited size and a page carrying
|
|
52
62
|
// `text-xs` on a box came out three pixels larger everywhere. A div DOES pass
|
package/dist/box.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"box.js","sourceRoot":"","sources":["../src/box.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,OAAO,EAAE,aAAa,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAA;AACjE,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACnC,OAAO,EAAE,EAAE,EAAmB,MAAM,MAAM,CAAA;AAE1C,2EAA2E;AAC3E,MAAM,UAAU,GAAG,CAAC,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,eAAe;IACzE,eAAe,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,OAAO;IAChE,oBAAoB,EAAE,YAAY,CAAU,CAAA;
|
|
1
|
+
{"version":3,"file":"box.js","sourceRoot":"","sources":["../src/box.tsx"],"names":[],"mappings":"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"}
|