@pickle-ui/react 1.0.0-beta.7 → 1.0.0-beta.9
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/README.md +13 -10
- package/dist/components/Alert.d.ts +4 -6
- package/dist/components/Alert.d.ts.map +1 -1
- package/dist/components/Alert.js +4 -6
- package/dist/components/Alert.js.map +1 -1
- package/dist/components/_internal/VisuallyHiddenInput.d.ts.map +1 -1
- package/dist/components/_internal/VisuallyHiddenInput.js +24 -42
- package/dist/components/_internal/VisuallyHiddenInput.js.map +1 -1
- package/dist/components/form/Form.context.d.ts.map +1 -1
- package/dist/components/form/Form.context.js +2 -3
- package/dist/components/form/Form.context.js.map +1 -1
- package/dist/components/form/FormField.js +2 -2
- package/dist/components/form/FormField.js.map +1 -1
- package/dist/components/form/Input.d.ts.map +1 -1
- package/dist/components/form/Input.js +22 -7
- package/dist/components/form/Input.js.map +1 -1
- package/dist/components/form/Slider.d.ts +1 -1
- package/dist/components/form/Slider.d.ts.map +1 -1
- package/dist/entries/theme.d.ts +2 -2
- package/dist/entries/theme.d.ts.map +1 -1
- package/dist/entries/theme.js +1 -1
- package/dist/entries/theme.js.map +1 -1
- package/dist/hooks/use-lazy-ref.d.ts.map +1 -1
- package/dist/hooks/use-lazy-ref.js +3 -4
- package/dist/hooks/use-lazy-ref.js.map +1 -1
- package/dist/lib/compose-refs.d.ts +0 -8
- package/dist/lib/compose-refs.d.ts.map +1 -1
- package/dist/lib/compose-refs.js +6 -19
- package/dist/lib/compose-refs.js.map +1 -1
- package/package.json +3 -3
- package/src/base.css +7 -25
- package/src/components/Alert.tsx +4 -6
- package/src/components/_internal/VisuallyHiddenInput.tsx +33 -51
- package/src/components/form/ColorPickerPrimitive.tsx +1 -1
- package/src/components/form/Form.context.ts +2 -3
- package/src/components/form/FormField.tsx +2 -2
- package/src/components/form/Input.tsx +65 -28
- package/src/components/form/RadioGroup.test.tsx +1 -3
- package/src/components/form/Slider.tsx +1 -1
- package/src/entries/theme.ts +2 -2
- package/src/hooks/use-lazy-ref.ts +3 -5
- package/src/lib/color.test.ts +1 -3
- package/src/lib/compose-refs.ts +7 -19
- package/dist/lib/theme.d.ts +0 -40
- package/dist/lib/theme.d.ts.map +0 -1
- package/dist/lib/theme.js +0 -82
- package/dist/lib/theme.js.map +0 -1
- package/src/lib/theme.test.ts +0 -64
- package/src/lib/theme.ts +0 -143
package/README.md
CHANGED
|
@@ -125,6 +125,7 @@ the element they render, for example
|
|
|
125
125
|
`Text` and the layout primitives take `as` to change their tag. Parts are
|
|
126
126
|
reached through their component (`Popover.Title`), never imported under their
|
|
127
127
|
own names.
|
|
128
|
+
|
|
128
129
|
Icons are plain SVG children: any icon library works, and buttons, badges and
|
|
129
130
|
input addons size and space the SVG for you.
|
|
130
131
|
|
|
@@ -230,9 +231,10 @@ own:
|
|
|
230
231
|
the light and dark values. Import it to share Pickle's palette in a project
|
|
231
232
|
that does not use the components. It re-exports `@pickle-ui/tokens/theme.css`,
|
|
232
233
|
which `@pickle-ui/react` installs as a dependency.
|
|
233
|
-
- `@pickle-ui/react/base.css` holds everything else: animation and variant
|
|
234
|
-
the `.dark` variant, the `Text` type scale
|
|
235
|
-
|
|
234
|
+
- `@pickle-ui/react/base.css` holds everything else: animation and variant
|
|
235
|
+
plugins, the `.dark` variant, the `Text` type scale (from
|
|
236
|
+
`@pickle-ui/tokens/typography.css`), shared utilities, and element resets.
|
|
237
|
+
Import it with a token set of your own instead of `theme.css`.
|
|
236
238
|
|
|
237
239
|
Tokens follow one naming rule: `--x` is a fill and `--x-foreground` is the text
|
|
238
240
|
placed on that fill. Status colors (`destructive`, `info`, `success`,
|
|
@@ -273,6 +275,8 @@ and `Card.Description` keeps `text-sm`.
|
|
|
273
275
|
`--primary-foreground`, `--ring`, and their sidebar counterparts) for both
|
|
274
276
|
schemes from one color, picking a readable foreground automatically. Radius
|
|
275
277
|
and fonts pass through. Everything else keeps the defaults from `theme.css`.
|
|
278
|
+
It comes from `@pickle-ui/tokens/theme`, so React Native apps derive the same
|
|
279
|
+
theme from the same color.
|
|
276
280
|
|
|
277
281
|
```ts
|
|
278
282
|
import { createTheme, themeToCss } from '@pickle-ui/react/theme';
|
|
@@ -443,8 +447,8 @@ breaking change.
|
|
|
443
447
|
|
|
444
448
|
## Upgrading from 0.x
|
|
445
449
|
|
|
446
|
-
|
|
447
|
-
|
|
450
|
+
Version 1.0 renames a few styling APIs. Search your code for these and update
|
|
451
|
+
them:
|
|
448
452
|
|
|
449
453
|
- **Package name.** `pickle-ui` is now published as `@pickle-ui/react`.
|
|
450
454
|
Replace the dependency and every import, stylesheets included:
|
|
@@ -483,11 +487,10 @@ pnpm run lint
|
|
|
483
487
|
|
|
484
488
|
## Releasing
|
|
485
489
|
|
|
486
|
-
Releases use [Changesets](https://changesets.dev)
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
new `@pickle-ui/tokens` release always comes with a new `@pickle-ui/react`.
|
|
490
|
+
Releases use [Changesets](https://changesets.dev): every pull request that
|
|
491
|
+
changes a package adds one (`pnpm changeset`), and merging the "Version
|
|
492
|
+
Packages" pull request on `main` publishes. The repository's
|
|
493
|
+
`.changeset/README.md` has the rules.
|
|
491
494
|
|
|
492
495
|
## License
|
|
493
496
|
|
|
@@ -18,12 +18,10 @@ declare function AlertDescription({ className, ...props }: AlertDescriptionProps
|
|
|
18
18
|
*/
|
|
19
19
|
declare function AlertIcon({ className, ...props }: AlertIconProps): React.JSX.Element;
|
|
20
20
|
/**
|
|
21
|
-
*
|
|
22
|
-
*
|
|
23
|
-
*
|
|
24
|
-
*
|
|
25
|
-
* pass `role="alert"` for urgent messages (failures) or `role="status"` for
|
|
26
|
-
* polite ones (confirmations, info).
|
|
21
|
+
* No live-region role by default, so static notices are not announced on page
|
|
22
|
+
* load. When the alert appears in response to a user action, pass
|
|
23
|
+
* `role="alert"` for urgent messages (failures) or `role="status"` for polite
|
|
24
|
+
* ones (confirmations, info).
|
|
27
25
|
*/
|
|
28
26
|
declare function AlertRoot({ className, variant, ...props }: AlertProps): React.JSX.Element;
|
|
29
27
|
declare function AlertTitle({ className, ...props }: AlertTitleProps): React.JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../src/components/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAE9C,QAAA,MAAM,aAAa;;8EAoBlB,CAAC;AAEF,KAAK,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AACpD,KAAK,qBAAqB,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;AACxE,KAAK,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAClD,KAAK,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAC3C,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC;AACrC,KAAK,eAAe,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;AAElE,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,qBAW7D;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,qBAcvE;AAED;;;;GAIG;AACH,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,qBAYzD;AAED
|
|
1
|
+
{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../src/components/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAE9C,QAAA,MAAM,aAAa;;8EAoBlB,CAAC;AAEF,KAAK,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AACpD,KAAK,qBAAqB,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;AACxE,KAAK,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAClD,KAAK,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAC3C,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC;AACrC,KAAK,eAAe,GAAG,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;AAElE,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,qBAW7D;AAED,iBAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,qBAAqB,qBAcvE;AAED;;;;GAIG;AACH,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,qBAYzD;AAED;;;;;GAKG;AACH,iBAAS,SAAS,CAAC,EAAE,SAAS,EAAE,OAAmB,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,qBAS1E;AAED,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,qBAa3D;AAED,QAAA,MAAM,KAAK;;;;;CAKT,CAAC;AAEH,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,gBAAgB,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC;AACvE,YAAY,EACV,gBAAgB,EAChB,qBAAqB,EACrB,cAAc,EACd,UAAU,EACV,eAAe,GAChB,CAAC"}
|
package/dist/components/Alert.js
CHANGED
|
@@ -31,12 +31,10 @@ function AlertIcon({ className, ...props }) {
|
|
|
31
31
|
return (_jsx("div", { "aria-hidden": true, className: cn("col-start-1 row-start-1 flex h-5 items-center [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), "data-slot": "alert-icon", ...props }));
|
|
32
32
|
}
|
|
33
33
|
/**
|
|
34
|
-
*
|
|
35
|
-
*
|
|
36
|
-
*
|
|
37
|
-
*
|
|
38
|
-
* pass `role="alert"` for urgent messages (failures) or `role="status"` for
|
|
39
|
-
* polite ones (confirmations, info).
|
|
34
|
+
* No live-region role by default, so static notices are not announced on page
|
|
35
|
+
* load. When the alert appears in response to a user action, pass
|
|
36
|
+
* `role="alert"` for urgent messages (failures) or `role="status"` for polite
|
|
37
|
+
* ones (confirmations, info).
|
|
40
38
|
*/
|
|
41
39
|
function AlertRoot({ className, variant = 'default', ...props }) {
|
|
42
40
|
return (_jsx("div", { className: cn(alertVariants({ variant }), className), "data-slot": "alert", "data-variant": variant, ...props }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../src/components/Alert.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,IAAI,EAAkB,MAAM,QAAQ,CAAC;AAE9C,MAAM,aAAa,GAAG,GAAG,CACvB,0SAA0S,EAC1S;IACE,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;IACD,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EACL,6EAA6E;YAC/E,WAAW,EACT,uGAAuG;YACzG,IAAI,EAAE,kFAAkF;YACxF,OAAO,EACL,2FAA2F;YAC7F,OAAO,EACL,2FAA2F;SAC9F;KACF;CACF,CACF,CAAC;AASF,SAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoB;IAC5D,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CACX,iHAAiH,EACjH,SAAS,CACV,eACS,cAAc,KACpB,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAyB;IACtE,OAAO,CACL,KAAC,IAAI,IACH,EAAE,EAAC,KAAK,EACR,SAAS,EAAE,EAAE,CACX,gFAAgF,EAChF,SAAS,CACV,eACS,mBAAmB,EAC7B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,MAAM,KACV,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,SAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB;IACxD,OAAO,CACL,mCAEE,SAAS,EAAE,EAAE,CACX,iIAAiI,EACjI,SAAS,CACV,eACS,YAAY,KAClB,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED
|
|
1
|
+
{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../src/components/Alert.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,IAAI,EAAkB,MAAM,QAAQ,CAAC;AAE9C,MAAM,aAAa,GAAG,GAAG,CACvB,0SAA0S,EAC1S;IACE,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;IACD,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EACL,6EAA6E;YAC/E,WAAW,EACT,uGAAuG;YACzG,IAAI,EAAE,kFAAkF;YACxF,OAAO,EACL,2FAA2F;YAC7F,OAAO,EACL,2FAA2F;SAC9F;KACF;CACF,CACF,CAAC;AASF,SAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoB;IAC5D,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CACX,iHAAiH,EACjH,SAAS,CACV,eACS,cAAc,KACpB,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAyB;IACtE,OAAO,CACL,KAAC,IAAI,IACH,EAAE,EAAC,KAAK,EACR,SAAS,EAAE,EAAE,CACX,gFAAgF,EAChF,SAAS,CACV,eACS,mBAAmB,EAC7B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,MAAM,KACV,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,SAAS,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkB;IACxD,OAAO,CACL,mCAEE,SAAS,EAAE,EAAE,CACX,iIAAiI,EACjI,SAAS,CACV,eACS,YAAY,KAClB,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,SAAS,SAAS,CAAC,EAAE,SAAS,EAAE,OAAO,GAAG,SAAS,EAAE,GAAG,KAAK,EAAc;IACzE,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,CAAC,eAC1C,OAAO,kBACH,OAAO,KACjB,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,SAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAmB;IAC1D,OAAO,CACL,KAAC,IAAI,IACH,EAAE,EAAC,KAAK,EACR,SAAS,EAAE,EAAE,CACX,kFAAkF,EAClF,SAAS,CACV,eACS,aAAa,EACvB,OAAO,EAAC,MAAM,KACV,KAAK,GACT,CACH,CAAC;AACJ,CAAC;AAED,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE;IACrC,MAAM,EAAE,WAAW;IACnB,WAAW,EAAE,gBAAgB;IAC7B,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,UAAU;CAClB,CAAC,CAAC;AAEH,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,gBAAgB,EAAE,SAAS,EAAE,UAAU,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VisuallyHiddenInput.d.ts","sourceRoot":"","sources":["../../../src/components/_internal/VisuallyHiddenInput.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,UAAU,GAAG,MAAM,GAAG,MAAM,EAAE,CAAC;AAEpC,UAAU,wBAAwB,CAAC,CAAC,GAAG,UAAU,CAAE,SAAQ,IAAI,CAC7D,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,SAAS,GAAG,SAAS,GAAG,OAAO,CAChC;IACC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,KAAK,CAAC,EAAE,CAAC,CAAC;CACX;
|
|
1
|
+
{"version":3,"file":"VisuallyHiddenInput.d.ts","sourceRoot":"","sources":["../../../src/components/_internal/VisuallyHiddenInput.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,UAAU,GAAG,MAAM,GAAG,MAAM,EAAE,CAAC;AAEpC,UAAU,wBAAwB,CAAC,CAAC,GAAG,UAAU,CAAE,SAAQ,IAAI,CAC7D,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,SAAS,GAAG,SAAS,GAAG,OAAO,CAChC;IACC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B,KAAK,CAAC,EAAE,CAAC,CAAC;CACX;AAgCD,iBAAS,mBAAmB,CAAC,CAAC,GAAG,UAAU,EACzC,KAAK,EAAE,wBAAwB,CAAC,CAAC,CAAC,qBA8FnC;AAED,OAAO,EAAE,mBAAmB,EAAE,CAAC"}
|
|
@@ -1,9 +1,31 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import * as React from 'react';
|
|
4
|
+
const noSize = {};
|
|
5
|
+
// The snapshot is a string so React can compare it by value; an object would be
|
|
6
|
+
// a new snapshot on every read and re-render forever.
|
|
7
|
+
function useElementSize(element) {
|
|
8
|
+
const subscribe = React.useCallback((onChange) => {
|
|
9
|
+
if (!element)
|
|
10
|
+
return () => { };
|
|
11
|
+
const resizeObserver = new ResizeObserver(onChange);
|
|
12
|
+
resizeObserver.observe(element, { box: 'border-box' });
|
|
13
|
+
return () => {
|
|
14
|
+
resizeObserver.disconnect();
|
|
15
|
+
};
|
|
16
|
+
}, [element]);
|
|
17
|
+
const getSnapshot = () => element ? `${element.offsetWidth}x${element.offsetHeight}` : '';
|
|
18
|
+
const snapshot = React.useSyncExternalStore(subscribe, getSnapshot, () => '');
|
|
19
|
+
return React.useMemo(() => {
|
|
20
|
+
if (!snapshot)
|
|
21
|
+
return noSize;
|
|
22
|
+
const [width, height] = snapshot.split('x').map(Number);
|
|
23
|
+
return { height, width };
|
|
24
|
+
}, [snapshot]);
|
|
25
|
+
}
|
|
4
26
|
function VisuallyHiddenInput(props) {
|
|
5
27
|
const { bubbles = true, checked, control, style, type = 'hidden', value, ...inputProps
|
|
6
|
-
// react-doctor-disable-next-line react-doctor/no-event-handler --
|
|
28
|
+
// react-doctor-disable-next-line react-doctor/no-event-handler -- an effect mirrors value/checked into the native input and dispatches its event: prop changes drive it, not a user event
|
|
7
29
|
} = props;
|
|
8
30
|
const isCheckInput = React.useMemo(() => type === 'checkbox' || type === 'radio' || type === 'switch', [type]);
|
|
9
31
|
const inputRef = React.useRef(null);
|
|
@@ -19,47 +41,7 @@ function VisuallyHiddenInput(props) {
|
|
|
19
41
|
}
|
|
20
42
|
return prevValueRef.current.previous;
|
|
21
43
|
}, [isCheckInput, value, checked]);
|
|
22
|
-
const
|
|
23
|
-
// react-doctor-disable-next-line react-doctor/no-cascading-set-state -- this effect measures the control element and only calls setControlSize in mutually exclusive branches (or inside an async ResizeObserver callback), not as a synchronous render cascade
|
|
24
|
-
React.useLayoutEffect(() => {
|
|
25
|
-
if (!control) {
|
|
26
|
-
// eslint-disable-next-line react-hooks/set-state-in-effect -- reset measured size synchronously when the control is removed so the hidden input does not retain a stale size
|
|
27
|
-
setControlSize({});
|
|
28
|
-
return;
|
|
29
|
-
}
|
|
30
|
-
setControlSize({
|
|
31
|
-
height: control.offsetHeight,
|
|
32
|
-
width: control.offsetWidth,
|
|
33
|
-
});
|
|
34
|
-
if (typeof window === 'undefined')
|
|
35
|
-
return;
|
|
36
|
-
const resizeObserver = new ResizeObserver((entries) => {
|
|
37
|
-
if (!Array.isArray(entries) || !entries.length)
|
|
38
|
-
return;
|
|
39
|
-
const entry = entries[0];
|
|
40
|
-
if (!entry)
|
|
41
|
-
return;
|
|
42
|
-
let width;
|
|
43
|
-
let height;
|
|
44
|
-
if ('borderBoxSize' in entry) {
|
|
45
|
-
const borderSizeEntry = entry.borderBoxSize;
|
|
46
|
-
const borderSize = Array.isArray(borderSizeEntry)
|
|
47
|
-
? borderSizeEntry[0]
|
|
48
|
-
: borderSizeEntry;
|
|
49
|
-
width = borderSize.inlineSize;
|
|
50
|
-
height = borderSize.blockSize;
|
|
51
|
-
}
|
|
52
|
-
else {
|
|
53
|
-
width = control.offsetWidth;
|
|
54
|
-
height = control.offsetHeight;
|
|
55
|
-
}
|
|
56
|
-
setControlSize({ height, width });
|
|
57
|
-
});
|
|
58
|
-
resizeObserver.observe(control, { box: 'border-box' });
|
|
59
|
-
return () => {
|
|
60
|
-
resizeObserver.disconnect();
|
|
61
|
-
};
|
|
62
|
-
}, [control]);
|
|
44
|
+
const controlSize = useElementSize(control);
|
|
63
45
|
React.useEffect(() => {
|
|
64
46
|
const input = inputRef.current;
|
|
65
47
|
if (!input)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VisuallyHiddenInput.js","sourceRoot":"","sources":["../../../src/components/_internal/VisuallyHiddenInput.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgB/B,
|
|
1
|
+
{"version":3,"file":"VisuallyHiddenInput.js","sourceRoot":"","sources":["../../../src/components/_internal/VisuallyHiddenInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form.context.d.ts","sourceRoot":"","sources":["../../../src/components/form/Form.context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAEL,KAAK,aAAa,EAEnB,MAAM,iBAAiB,CAAC;AAEzB,KAAK,gBAAgB,GAAG;IACtB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AACF,KAAK,qBAAqB,GAAG;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AACF,KAAK,0BAA0B,GAAG;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AACF,KAAK,kBAAkB,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG;IAC7D,cAAc,CAAC,EAAE,KAAK,CAAC;CACxB,CAAC;AAEF,QAAA,MAAM,gBAAgB,6CAErB,CAAC;AACF,QAAA,MAAM,qBAAqB,wBAA6B,CAAC;AAEzD,iBAAS,eAAe,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,CAAC,SAAS,CAgBxD;AAED,iBAAS,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,sBAI7C;
|
|
1
|
+
{"version":3,"file":"Form.context.d.ts","sourceRoot":"","sources":["../../../src/components/form/Form.context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAEL,KAAK,aAAa,EAEnB,MAAM,iBAAiB,CAAC;AAEzB,KAAK,gBAAgB,GAAG;IACtB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AACF,KAAK,qBAAqB,GAAG;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AACF,KAAK,0BAA0B,GAAG;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AACF,KAAK,kBAAkB,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG;IAC7D,cAAc,CAAC,EAAE,KAAK,CAAC;CACxB,CAAC;AAEF,QAAA,MAAM,gBAAgB,6CAErB,CAAC;AACF,QAAA,MAAM,qBAAqB,wBAA6B,CAAC;AAEzD,iBAAS,eAAe,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,CAAC,SAAS,CAgBxD;AAED,iBAAS,YAAY,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,sBAI7C;AAID,iBAAS,mBAAmB,CAC1B,KAAK,GAAE,gBAAqB,EAC5B,EAAE,OAAc,EAAE,GAAE,0BAA+B;;;EAkBpD;AAED,iBAAS,cAAc,kBAUtB;AAED,iBAAS,oBAAoB,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,EAAE,aAAa,EAAE,MAAM,UAU5E;AAED,OAAO,EACL,gBAAgB,EAChB,qBAAqB,EACrB,eAAe,EACf,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACd,oBAAoB,GACrB,CAAC;AACF,YAAY,EACV,gBAAgB,EAChB,qBAAqB,EACrB,0BAA0B,EAC1B,kBAAkB,GACnB,CAAC"}
|
|
@@ -18,9 +18,8 @@ function useFieldName(name) {
|
|
|
18
18
|
const field = React.useContext(FormFieldContext);
|
|
19
19
|
return name ?? field?.name;
|
|
20
20
|
}
|
|
21
|
-
// React Hook Form
|
|
22
|
-
//
|
|
23
|
-
// visible control.
|
|
21
|
+
// React Hook Form tracks field state but attaches no aria or id props to
|
|
22
|
+
// custom controls: this maps the current Form.Field onto its visible control.
|
|
24
23
|
function useFormControlProps(props = {}, { enabled = true } = {}) {
|
|
25
24
|
const field = React.useContext(FormFieldContext);
|
|
26
25
|
const { control, getFieldState } = useFormMethods();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Form.context.js","sourceRoot":"","sources":["../../../src/components/form/Form.context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,cAAc,EAEd,YAAY,GACb,MAAM,iBAAiB,CAAC;AAgBzB,MAAM,gBAAgB,GAAG,KAAK,CAAC,aAAa,CAC1C,IAAI,CACL,CAAC;AACF,MAAM,qBAAqB,GAAG,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;AAEzD,SAAS,eAAe,CAAC,KAAc;IACrC,IAAI,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;QACxC,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,MAAM,OAAO,GAAI,KAA+B,CAAC,OAAO,CAAC;IAEzD,IACE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC;QAC7B,OAAO,OAAO,KAAK,QAAQ;QAC3B,OAAO,OAAO,KAAK,QAAQ,EAC3B,CAAC;QACD,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,SAAS,YAAY,CAAC,IAAwB;IAC5C,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC;IAEjD,OAAO,IAAI,IAAI,KAAK,EAAE,IAAI,CAAC;AAC7B,CAAC;AAED,
|
|
1
|
+
{"version":3,"file":"Form.context.js","sourceRoot":"","sources":["../../../src/components/form/Form.context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,cAAc,EAEd,YAAY,GACb,MAAM,iBAAiB,CAAC;AAgBzB,MAAM,gBAAgB,GAAG,KAAK,CAAC,aAAa,CAC1C,IAAI,CACL,CAAC;AACF,MAAM,qBAAqB,GAAG,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;AAEzD,SAAS,eAAe,CAAC,KAAc;IACrC,IAAI,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;QACxC,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,MAAM,OAAO,GAAI,KAA+B,CAAC,OAAO,CAAC;IAEzD,IACE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC;QAC7B,OAAO,OAAO,KAAK,QAAQ;QAC3B,OAAO,OAAO,KAAK,QAAQ,EAC3B,CAAC;QACD,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,SAAS,YAAY,CAAC,IAAwB;IAC5C,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC;IAEjD,OAAO,IAAI,IAAI,KAAK,EAAE,IAAI,CAAC;AAC7B,CAAC;AAED,yEAAyE;AACzE,8EAA8E;AAC9E,SAAS,mBAAmB,CAC1B,QAA0B,EAAE,EAC5B,EAAE,OAAO,GAAG,IAAI,KAAiC,EAAE;IAEnD,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC;IACjD,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,GAAG,cAAc,EAAE,CAAC;IACpD,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;IAC/C,MAAM,SAAS,GAAG,YAAY,CAAC;QAC7B,OAAO;QACP,QAAQ,EAAE,CAAC,IAAI;QACf,KAAK,EAAE,IAAI;QACX,IAAI;KACL,CAAC,CAAC;IACH,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IACzD,MAAM,OAAO,GAAG,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC;IAEtE,OAAO;QACL,cAAc,EAAE,SAAS,IAAI,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS;QACvD,EAAE,EAAE,SAAS,IAAI,KAAK,CAAC,EAAE;KAC1B,CAAC;AACJ,CAAC;AAED,SAAS,cAAc;IACrB,MAAM,OAAO,GAAG,cAAc,EAA0B,CAAC;IAEzD,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CACb,6DAA6D,CAC9D,CAAC;IACJ,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,SAAS,oBAAoB,CAAC,IAAwB,EAAE,aAAqB;IAC3E,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAErC,IAAI,CAAC,SAAS,EAAE,CAAC;QACf,MAAM,IAAI,KAAK,CACb,GAAG,aAAa,4DAA4D,CAC7E,CAAC;IACJ,CAAC;IAED,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,OAAO,EACL,gBAAgB,EAChB,qBAAqB,EACrB,eAAe,EACf,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACd,oBAAoB,GACrB,CAAC"}
|
|
@@ -21,8 +21,8 @@ function FormField({ children, className, controlId: controlIdProp, description,
|
|
|
21
21
|
});
|
|
22
22
|
const fieldError = name ? getFieldState(name, formState).error : undefined;
|
|
23
23
|
const errorMessage = error ?? getErrorMessage(fieldError);
|
|
24
|
-
// The
|
|
25
|
-
//
|
|
24
|
+
// The label focuses the control by this id; `useId` keeps it unique across
|
|
25
|
+
// forms and rows.
|
|
26
26
|
const generatedControlId = React.useId();
|
|
27
27
|
const controlId = controlIdProp ?? generatedControlId;
|
|
28
28
|
const nativeLabel = shouldUseNativeFieldLabel(children);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/form/FormField.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAC7C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EACL,gBAAgB,EAChB,eAAe,EACf,cAAc,GACf,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAA4B,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAChF,OAAO,EAAwB,cAAc,EAAE,MAAM,cAAc,CAAC;AAapE,SAAS,SAAS,CAAC,EACjB,QAAQ,EACR,SAAS,EACT,SAAS,EAAE,aAAa,EACxB,WAAW,EACX,KAAK,EACL,KAAK,EACL,GAAG,KAAK,EACO;IACf,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,GAAG,cAAc,EAAE,CAAC;IACpD,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC;IACxB,MAAM,SAAS,GAAG,YAAY,CAAC;QAC7B,OAAO;QACP,QAAQ,EAAE,CAAC,IAAI;QACf,KAAK,EAAE,IAAI;QACX,IAAI;KACL,CAAC,CAAC;IACH,MAAM,UAAU,GAAG,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;IAC3E,MAAM,YAAY,GAAG,KAAK,IAAI,eAAe,CAAC,UAAU,CAAC,CAAC;IAC1D,
|
|
1
|
+
{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/form/FormField.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAC7C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EACL,gBAAgB,EAChB,eAAe,EACf,cAAc,GACf,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAA4B,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAChF,OAAO,EAAwB,cAAc,EAAE,MAAM,cAAc,CAAC;AAapE,SAAS,SAAS,CAAC,EACjB,QAAQ,EACR,SAAS,EACT,SAAS,EAAE,aAAa,EACxB,WAAW,EACX,KAAK,EACL,KAAK,EACL,GAAG,KAAK,EACO;IACf,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,GAAG,cAAc,EAAE,CAAC;IACpD,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC;IACxB,MAAM,SAAS,GAAG,YAAY,CAAC;QAC7B,OAAO;QACP,QAAQ,EAAE,CAAC,IAAI;QACf,KAAK,EAAE,IAAI;QACX,IAAI;KACL,CAAC,CAAC;IACH,MAAM,UAAU,GAAG,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;IAC3E,MAAM,YAAY,GAAG,KAAK,IAAI,eAAe,CAAC,UAAU,CAAC,CAAC;IAC1D,2EAA2E;IAC3E,kBAAkB;IAClB,MAAM,kBAAkB,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC;IACzC,MAAM,SAAS,GAAG,aAAa,IAAI,kBAAkB,CAAC;IACtD,MAAM,WAAW,GAAG,yBAAyB,CAAC,QAAQ,CAAC,CAAC;IACxD,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAChC,GAAG,EAAE,CAAC,CAAC;QACL,SAAS;QACT,IAAI;KACL,CAAC,EACF,CAAC,SAAS,EAAE,IAAI,CAAC,CAClB,CAAC;IAEF,OAAO,CACL,MAAC,KAAK,CAAC,IAAI,IACT,SAAS,EAAE,EAAE,CAAC,cAAc,EAAE,SAAS,CAAC,eAC9B,OAAO,KACb,KAAK,aAIR,KAAK,IAAI,WAAW,CAAC,CAAC,CAAC,CACtB,KAAC,SAAS,IAAC,OAAO,EAAE,SAAS,YAAG,KAAK,GAAa,CACnD,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CACV,KAAC,SAAS,IAAC,WAAW,EAAE,KAAK,EAAE,MAAM,EAAE,gBAAQ,YAC5C,KAAK,GACI,CACb,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,YAC3C,QAAQ,GACiB,EAC3B,YAAY,CAAC,CAAC,CAAC,CACd,KAAC,SAAS,IAAC,KAAK,kBAAE,YAAY,GAAa,CAC5C,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAChB,KAAC,eAAe,cAAE,WAAW,GAAmB,CACjD,CAAC,CAAC,CAAC,IAAI,IACG,CACd,CAAC;AACJ,CAAC;AAED,SAAS,uBAAuB,CAC9B,KAAsB;IAEtB,OAAO,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,KAAK,kBAAkB,CAAC;AAC1E,CAAC;AAED,SAAS,mBAAmB,CAC1B,KAAsB;IAEtB,OAAO,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,KAAK,cAAc,CAAC;AACtE,CAAC;AAED,SAAS,yBAAyB,CAAC,QAAyB;IAC1D,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,IAAI,CAC3C,CAAC,KAAK,EAAE,EAAE,CAAC,uBAAuB,CAAC,KAAK,CAAC,IAAI,mBAAmB,CAAC,KAAK,CAAC,CACxE,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/form/Input.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC/D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAM,KAAK,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAS1D,KAAK,UAAU,GAAG,IAAI,CACpB,cAAc,CAAC,KAAK,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAC5D,MAAM,CACP,GAAG;IACF,qFAAqF;IACrF,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IACrC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;
|
|
1
|
+
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/form/Input.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC/D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAM,KAAK,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAS1D,KAAK,UAAU,GAAG,IAAI,CACpB,cAAc,CAAC,KAAK,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,EAC5D,MAAM,CACP,GAAG;IACF,qFAAqF;IACrF,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IACrC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAyDF,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,UAAU,EACV,WAAmB,EACnB,IAAW,EACX,KAAK,EACL,QAAgB,EAChB,GAAG,KAAK,EACT,EAAE,UAAU,qBAsCZ;AAED,OAAO,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC;AACjC,YAAY,EAAE,UAAU,EAAE,CAAC"}
|
|
@@ -8,15 +8,30 @@ const inputControlHeights = {
|
|
|
8
8
|
md: 'h-8',
|
|
9
9
|
sm: 'h-7',
|
|
10
10
|
};
|
|
11
|
+
function getControlClassName({ className, size, unstyled, }) {
|
|
12
|
+
return (cn(!unstyled &&
|
|
13
|
+
cn(inputControlHeights[size], 'border-input bg-background text-foreground ring-ring/24 has-focus-visible:has-aria-invalid:border-destructive/64 has-focus-visible:has-aria-invalid:ring-destructive/16 has-aria-invalid:border-destructive/36 has-focus-visible:border-ring has-autofill:bg-foreground/4 dark:bg-input/32 dark:has-autofill:bg-foreground/8 dark:has-aria-invalid:ring-destructive/24 relative inline-flex w-full rounded-lg border text-base shadow-xs/5 transition-shadow not-dark:bg-clip-padding before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-lg)-1px)] not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_1px_--theme(--color-black/4%)] has-focus-visible:ring-[3px] has-disabled:opacity-64 has-[:disabled,:focus-visible,[aria-invalid]]:shadow-none sm:text-sm dark:not-has-disabled:not-has-focus-visible:not-has-aria-invalid:before:shadow-[0_-1px_--theme(--color-white/6%)]'), className) || undefined);
|
|
14
|
+
}
|
|
15
|
+
function getInputClassName({ inputClassNames, size, type, unstyled, }) {
|
|
16
|
+
return cn(unstyled
|
|
17
|
+
? cn('w-full min-w-0 rounded-[inherit] px-[calc(--spacing(3)-1px)] leading-none outline-none [transition:background-color_5000000s_ease-in-out_0s] placeholder:text-muted-foreground/72', inputControlHeights[size], size === 'sm' && 'px-[calc(--spacing(2.5)-1px)]', size === 'lg' && 'px-[calc(--spacing(3.5)-1px)]')
|
|
18
|
+
: cn('h-full min-h-0 w-full rounded-[inherit] px-[calc(--spacing(3)-1px)] leading-none outline-none [transition:background-color_5000000s_ease-in-out_0s] placeholder:text-muted-foreground/72', size === 'sm' && 'px-[calc(--spacing(2.5)-1px)]', size === 'lg' && 'px-[calc(--spacing(3.5)-1px)]'), type === 'search' &&
|
|
19
|
+
'[&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none [&::-webkit-search-results-button]:appearance-none [&::-webkit-search-results-decoration]:appearance-none', type === 'file' &&
|
|
20
|
+
'text-muted-foreground file:me-3 file:bg-transparent file:font-medium file:text-foreground file:text-sm', inputClassNames);
|
|
21
|
+
}
|
|
11
22
|
function Input({ className, classNames, nativeInput = false, size = 'md', style, unstyled = false, ...props }) {
|
|
12
23
|
const resolvedSize = typeof size === 'number' ? 'md' : size;
|
|
13
|
-
const inputClassName =
|
|
14
|
-
|
|
15
|
-
:
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
24
|
+
const inputClassName = getInputClassName({
|
|
25
|
+
inputClassNames: classNames?.input,
|
|
26
|
+
size: resolvedSize,
|
|
27
|
+
type: props.type,
|
|
28
|
+
unstyled,
|
|
29
|
+
});
|
|
30
|
+
return (_jsx("span", { className: getControlClassName({
|
|
31
|
+
className,
|
|
32
|
+
size: resolvedSize,
|
|
33
|
+
unstyled,
|
|
34
|
+
}), "data-size": resolvedSize, "data-slot": "input-control", children: nativeInput ? (_jsx("input", { className: inputClassName, "data-slot": "input", size: typeof size === 'number' ? size : undefined, style: typeof style === 'function' ? undefined : style, ...props })) : (_jsx(InputPrimitive, { className: inputClassName, "data-slot": "input", size: typeof size === 'number' ? size : undefined, style: style, ...props })) }));
|
|
20
35
|
}
|
|
21
36
|
export { Input, InputPrimitive };
|
|
22
37
|
//# sourceMappingURL=Input.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../src/components/form/Input.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,KAAK,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAG/D,OAAO,EAAE,EAAE,EAAuB,MAAM,iBAAiB,CAAC;AAE1D,+EAA+E;AAC/E,MAAM,mBAAmB,GAAG;IAC1B,EAAE,EAAE,KAAK;IACT,EAAE,EAAE,KAAK;IACT,EAAE,EAAE,KAAK;CACD,CAAC;
|
|
1
|
+
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../src/components/form/Input.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,KAAK,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAG/D,OAAO,EAAE,EAAE,EAAuB,MAAM,iBAAiB,CAAC;AAE1D,+EAA+E;AAC/E,MAAM,mBAAmB,GAAG;IAC1B,EAAE,EAAE,KAAK;IACT,EAAE,EAAE,KAAK;IACT,EAAE,EAAE,KAAK;CACD,CAAC;AAeX,SAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,IAAI,EACJ,QAAQ,GAKT;IACC,OAAO,CACL,EAAE,CACA,CAAC,QAAQ;QACP,EAAE,CACA,mBAAmB,CAAC,IAAI,CAAC,EACzB,q5BAAq5B,CACt5B,EACH,SAAS,CACV,IAAI,SAAS,CACf,CAAC;AACJ,CAAC;AAED,SAAS,iBAAiB,CAAC,EACzB,eAAe,EACf,IAAI,EACJ,IAAI,EACJ,QAAQ,GAMT;IACC,OAAO,EAAE,CACP,QAAQ;QACN,CAAC,CAAC,EAAE,CACA,mLAAmL,EACnL,mBAAmB,CAAC,IAAI,CAAC,EACzB,IAAI,KAAK,IAAI,IAAI,+BAA+B,EAChD,IAAI,KAAK,IAAI,IAAI,+BAA+B,CACjD;QACH,CAAC,CAAC,EAAE,CACA,0LAA0L,EAC1L,IAAI,KAAK,IAAI,IAAI,+BAA+B,EAChD,IAAI,KAAK,IAAI,IAAI,+BAA+B,CACjD,EACL,IAAI,KAAK,QAAQ;QACf,4MAA4M,EAC9M,IAAI,KAAK,MAAM;QACb,wGAAwG,EAC1G,eAAe,CAChB,CAAC;AACJ,CAAC;AAED,SAAS,KAAK,CAAC,EACb,SAAS,EACT,UAAU,EACV,WAAW,GAAG,KAAK,EACnB,IAAI,GAAG,IAAI,EACX,KAAK,EACL,QAAQ,GAAG,KAAK,EAChB,GAAG,KAAK,EACG;IACX,MAAM,YAAY,GAAG,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IAC5D,MAAM,cAAc,GAAG,iBAAiB,CAAC;QACvC,eAAe,EAAE,UAAU,EAAE,KAAK;QAClC,IAAI,EAAE,YAAY;QAClB,IAAI,EAAE,KAAK,CAAC,IAAI;QAChB,QAAQ;KACT,CAAC,CAAC;IAEH,OAAO,CACL,eACE,SAAS,EAAE,mBAAmB,CAAC;YAC7B,SAAS;YACT,IAAI,EAAE,YAAY;YAClB,QAAQ;SACT,CAAC,eACS,YAAY,eACb,eAAe,YAExB,WAAW,CAAC,CAAC,CAAC,CACb,gBACE,SAAS,EAAE,cAAc,eACf,OAAO,EACjB,IAAI,EAAE,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACjD,KAAK,EAAE,OAAO,KAAK,KAAK,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,KAClD,KAAK,GACT,CACH,CAAC,CAAC,CAAC,CACF,KAAC,cAAc,IACb,SAAS,EAAE,cAAc,eACf,OAAO,EACjB,IAAI,EAAE,OAAO,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EACjD,KAAK,EAAE,KAAK,KACR,KAAK,GACT,CACH,GACI,CACR,CAAC;AACJ,CAAC;AAED,OAAO,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC"}
|
|
@@ -15,7 +15,7 @@ type SliderProps = SliderPrimitive.Root.Props & {
|
|
|
15
15
|
classNames?: SlotClassNames<'control' | 'indicator' | 'thumb' | 'track'>;
|
|
16
16
|
getAriaLabel?: SliderPrimitive.Thumb.Props['getAriaLabel'];
|
|
17
17
|
getAriaValueText?: SliderPrimitive.Thumb.Props['getAriaValueText'];
|
|
18
|
-
/**
|
|
18
|
+
/** Draws the filled track. `false` for a custom track, as in the color picker. Defaults to `true`. */
|
|
19
19
|
indicator?: boolean;
|
|
20
20
|
ref?: Ref<HTMLDivElement>;
|
|
21
21
|
trackStyle?: CSSProperties;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/components/form/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAElE,OAAO,EAAM,KAAK,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAE1D,KAAK,gBAAgB,GAAG,eAAe,CAAC,KAAK,CAAC,KAAK,GAAG;IACpD,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,WAAW,GAAG,eAAe,CAAC,IAAI,CAAC,KAAK,GAAG;IAC9C,UAAU,CAAC,EAAE,cAAc,CAAC,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,OAAO,CAAC,CAAC;IACzE,YAAY,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;IAC3D,gBAAgB,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC;IACnE,
|
|
1
|
+
{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../../src/components/form/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAElE,OAAO,EAAM,KAAK,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAE1D,KAAK,gBAAgB,GAAG,eAAe,CAAC,KAAK,CAAC,KAAK,GAAG;IACpD,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,WAAW,GAAG,eAAe,CAAC,IAAI,CAAC,KAAK,GAAG;IAC9C,UAAU,CAAC,EAAE,cAAc,CAAC,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,OAAO,CAAC,CAAC;IACzE,YAAY,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;IAC3D,gBAAgB,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC;IACnE,sGAAsG;IACtG,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,UAAU,CAAC,EAAE,aAAa,CAAC;CAC5B,CAAC;AAEF,KAAK,gBAAgB,GAAG,eAAe,CAAC,KAAK,CAAC,KAAK,GAAG;IACpD,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B,CAAC;AAEF,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,+BASlE;AAED,iBAAS,WAAW,CAAC,EACnB,SAAS,EACT,aAAiB,EACjB,GAAS,EACT,GAAO,EACP,IAAQ,GACT,EAAE,gBAAgB,+BAoClB;AAED,iBAAS,UAAU,CAAC,EAClB,kBAAkB,EAAE,eAAe,EACnC,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,QAAQ,EACR,SAAS,EACT,UAAU,EACV,YAAY,EACZ,YAAY,EACZ,gBAAgB,EAChB,SAAgB,EAChB,GAAS,EACT,GAAO,EACP,GAAG,EACH,UAAU,EACV,KAAK,EACL,GAAG,KAAK,EACT,EAAE,WAAW,+BAsEb;AAED,iBAAS,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,+BASlE;AAED,QAAA,MAAM,MAAM;;;;CAIV,CAAC;AAEH,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,CAAC;AACnC,YAAY,EACV,gBAAgB,EAChB,gBAAgB,EAChB,WAAW,EACX,gBAAgB,GACjB,CAAC"}
|
package/dist/entries/theme.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { createTheme, themeToCss } from '
|
|
2
|
-
export type { Theme, ThemeCssOptions, ThemeFonts, ThemeOptions, ThemeVariables, } from '
|
|
1
|
+
export { createTheme, themeToCss } from '@pickle-ui/tokens/theme';
|
|
2
|
+
export type { Theme, ThemeCssOptions, ThemeFonts, ThemeOptions, ThemeVariables, } from '@pickle-ui/tokens/theme';
|
|
3
3
|
//# sourceMappingURL=theme.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/entries/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/entries/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAClE,YAAY,EACV,KAAK,EACL,eAAe,EACf,UAAU,EACV,YAAY,EACZ,cAAc,GACf,MAAM,yBAAyB,CAAC"}
|
package/dist/entries/theme.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { createTheme, themeToCss } from '
|
|
1
|
+
export { createTheme, themeToCss } from '@pickle-ui/tokens/theme';
|
|
2
2
|
//# sourceMappingURL=theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.js","sourceRoot":"","sources":["../../src/entries/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"theme.js","sourceRoot":"","sources":["../../src/entries/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-lazy-ref.d.ts","sourceRoot":"","sources":["../../src/hooks/use-lazy-ref.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,iBAAS,UAAU,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,CAAC,
|
|
1
|
+
{"version":3,"file":"use-lazy-ref.d.ts","sourceRoot":"","sources":["../../src/hooks/use-lazy-ref.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,iBAAS,UAAU,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,CAAC,GAKlB,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CACjC;AAED,OAAO,EAAE,UAAU,EAAE,CAAC"}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
function useLazyRef(fn) {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
}
|
|
3
|
+
// `useState` runs its initializer once, so `fn` is never called again and the
|
|
4
|
+
// `{ current }` box stays stable; render itself never writes to a ref.
|
|
5
|
+
const [ref] = React.useState(() => ({ current: fn() }));
|
|
7
6
|
return ref;
|
|
8
7
|
}
|
|
9
8
|
export { useLazyRef };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-lazy-ref.js","sourceRoot":"","sources":["../../src/hooks/use-lazy-ref.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,SAAS,UAAU,CAAI,EAAW;IAChC,
|
|
1
|
+
{"version":3,"file":"use-lazy-ref.js","sourceRoot":"","sources":["../../src/hooks/use-lazy-ref.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,SAAS,UAAU,CAAI,EAAW;IAChC,8EAA8E;IAC9E,uEAAuE;IACvE,MAAM,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;IAExD,OAAO,GAAyB,CAAC;AACnC,CAAC;AAED,OAAO,EAAE,UAAU,EAAE,CAAC"}
|
|
@@ -1,14 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
type PossibleRef<T> = React.Ref<T> | undefined;
|
|
3
|
-
/**
|
|
4
|
-
* A utility to compose multiple refs together
|
|
5
|
-
* Accepts callback refs and RefObject(s)
|
|
6
|
-
*/
|
|
7
3
|
declare function composeRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T>;
|
|
8
|
-
/**
|
|
9
|
-
* A custom hook that composes multiple refs
|
|
10
|
-
* Accepts callback refs and RefObject(s)
|
|
11
|
-
*/
|
|
12
4
|
declare function useComposedRefs<T>(...refs: PossibleRef<T>[]): React.RefCallback<T>;
|
|
13
5
|
export { composeRefs, useComposedRefs };
|
|
14
6
|
//# sourceMappingURL=compose-refs.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compose-refs.d.ts","sourceRoot":"","sources":["../../src/lib/compose-refs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,KAAK,WAAW,CAAC,CAAC,IAAI,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"compose-refs.d.ts","sourceRoot":"","sources":["../../src/lib/compose-refs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,KAAK,WAAW,CAAC,CAAC,IAAI,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;AAK/C,iBAAS,WAAW,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,CA0BvE;AAYD,iBAAS,eAAe,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,CAG3E;AAED,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,CAAC"}
|
package/dist/lib/compose-refs.js
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
* Accepts callback refs and RefObject(s)
|
|
5
|
-
*/
|
|
2
|
+
// Radix UI's compose-refs (MIT): callback refs and ref objects merged into one
|
|
3
|
+
// callback ref, with React 19 ref cleanups.
|
|
6
4
|
function composeRefs(...refs) {
|
|
7
5
|
return (node) => {
|
|
8
6
|
let hasCleanup = false;
|
|
@@ -13,10 +11,8 @@ function composeRefs(...refs) {
|
|
|
13
11
|
}
|
|
14
12
|
return cleanup;
|
|
15
13
|
});
|
|
16
|
-
//
|
|
17
|
-
//
|
|
18
|
-
// user's ref callback returns a value, which we only expect if they are
|
|
19
|
-
// using the cleanup functionality added in React 19.
|
|
14
|
+
// Only return a cleanup when a ref returned one: React 18 logs an error
|
|
15
|
+
// for a callback ref that returns a value.
|
|
20
16
|
if (hasCleanup) {
|
|
21
17
|
return () => {
|
|
22
18
|
for (let i = 0; i < cleanups.length; i++) {
|
|
@@ -32,10 +28,6 @@ function composeRefs(...refs) {
|
|
|
32
28
|
}
|
|
33
29
|
};
|
|
34
30
|
}
|
|
35
|
-
/**
|
|
36
|
-
* Set a given ref to a given value
|
|
37
|
-
* This utility takes care of different types of refs: callback refs and RefObject(s)
|
|
38
|
-
*/
|
|
39
31
|
function setRef(ref, value) {
|
|
40
32
|
if (typeof ref === 'function') {
|
|
41
33
|
return ref(value);
|
|
@@ -44,14 +36,9 @@ function setRef(ref, value) {
|
|
|
44
36
|
ref.current = value;
|
|
45
37
|
}
|
|
46
38
|
}
|
|
47
|
-
/**
|
|
48
|
-
* A custom hook that composes multiple refs
|
|
49
|
-
* Accepts callback refs and RefObject(s)
|
|
50
|
-
*/
|
|
51
39
|
function useComposedRefs(...refs) {
|
|
52
|
-
//
|
|
53
|
-
//
|
|
54
|
-
return React.useCallback(composeRefs(...refs), refs); // react-doctor-disable-line react-doctor/exhaustive-deps -- same intentional memo: the dependency list is the spread `refs` array on purpose
|
|
40
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps, react-hooks/use-memo -- memoized by every ref: the spread `refs` is the dependency list
|
|
41
|
+
return React.useCallback(composeRefs(...refs), refs); // react-doctor-disable-line react-doctor/exhaustive-deps -- memoized by every ref: the spread `refs` is the dependency list
|
|
55
42
|
}
|
|
56
43
|
export { composeRefs, useComposedRefs };
|
|
57
44
|
//# sourceMappingURL=compose-refs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compose-refs.js","sourceRoot":"","sources":["../../src/lib/compose-refs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B
|
|
1
|
+
{"version":3,"file":"compose-refs.js","sourceRoot":"","sources":["../../src/lib/compose-refs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,+EAA+E;AAC/E,4CAA4C;AAE5C,SAAS,WAAW,CAAI,GAAG,IAAsB;IAC/C,OAAO,CAAC,IAAI,EAAE,EAAE;QACd,IAAI,UAAU,GAAG,KAAK,CAAC;QACvB,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE;YAChC,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;YAClC,IAAI,CAAC,UAAU,IAAI,OAAO,OAAO,KAAK,UAAU,EAAE,CAAC;gBACjD,UAAU,GAAG,IAAI,CAAC;YACpB,CAAC;YACD,OAAO,OAAO,CAAC;QACjB,CAAC,CAAC,CAAC;QAEH,wEAAwE;QACxE,2CAA2C;QAC3C,IAAI,UAAU,EAAE,CAAC;YACf,OAAO,GAAG,EAAE;gBACV,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;oBACzC,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;oBAC5B,IAAI,OAAO,OAAO,KAAK,UAAU,EAAE,CAAC;wBAClC,OAAO,EAAE,CAAC;oBACZ,CAAC;yBAAM,CAAC;wBACN,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;oBACxB,CAAC;gBACH,CAAC;YACH,CAAC,CAAC;QACJ,CAAC;IACH,CAAC,CAAC;AACJ,CAAC;AAED,SAAS,MAAM,CAAI,GAAmB,EAAE,KAAQ;IAC9C,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE,CAAC;QAC9B,OAAO,GAAG,CAAC,KAAK,CAAC,CAAC;IACpB,CAAC;IAED,IAAI,GAAG,KAAK,IAAI,IAAI,GAAG,KAAK,SAAS,EAAE,CAAC;QACtC,GAAG,CAAC,OAAO,GAAG,KAAK,CAAC;IACtB,CAAC;AACH,CAAC;AAED,SAAS,eAAe,CAAI,GAAG,IAAsB;IACnD,gJAAgJ;IAChJ,OAAO,KAAK,CAAC,WAAW,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,4HAA4H;AACpL,CAAC;AAED,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pickle-ui/react",
|
|
3
|
-
"version": "1.0.0-beta.
|
|
3
|
+
"version": "1.0.0-beta.9",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "React component library built with Base UI, shadcn/ui, Tailwind CSS, and reui.",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
"culori": "^4.0.2",
|
|
57
57
|
"tailwind-merge": "^3.6.0",
|
|
58
58
|
"tw-animate-css": "^1.4.0",
|
|
59
|
-
"@pickle-ui/tokens": "1.0.0-beta.
|
|
59
|
+
"@pickle-ui/tokens": "1.0.0-beta.7"
|
|
60
60
|
},
|
|
61
61
|
"devDependencies": {
|
|
62
62
|
"@fontsource-variable/geist": "5.2.9",
|
|
@@ -78,7 +78,7 @@
|
|
|
78
78
|
"jsdom": "^29.1.1",
|
|
79
79
|
"postcss": "^8.5.15",
|
|
80
80
|
"react": "^19.2.7",
|
|
81
|
-
"react-doctor": "^0.
|
|
81
|
+
"react-doctor": "^0.9.18",
|
|
82
82
|
"react-dom": "^19.2.7",
|
|
83
83
|
"react-hook-form": "^7.79.0",
|
|
84
84
|
"storybook": "^10.6.3",
|
package/src/base.css
CHANGED
|
@@ -6,6 +6,13 @@
|
|
|
6
6
|
|
|
7
7
|
@import 'tw-animate-css';
|
|
8
8
|
|
|
9
|
+
/**
|
|
10
|
+
* Type scale behind `Text`'s variants and the `text-<variant>` utilities,
|
|
11
|
+
* shared with React Native. It comes from here rather than `theme.css`
|
|
12
|
+
* because the components need it whatever token set an app brings.
|
|
13
|
+
*/
|
|
14
|
+
@import '@pickle-ui/tokens/typography.css';
|
|
15
|
+
|
|
9
16
|
@source './components/**/*.{ts,tsx}';
|
|
10
17
|
|
|
11
18
|
/**
|
|
@@ -52,31 +59,6 @@
|
|
|
52
59
|
|
|
53
60
|
@custom-variant dark (&:where(.dark, .dark *));
|
|
54
61
|
|
|
55
|
-
/**
|
|
56
|
-
* Type scale behind `Text`'s variants and the `text-<variant>` utilities.
|
|
57
|
-
* It lives here rather than in `theme.css` because the components need it
|
|
58
|
-
* whatever token set an app brings. Not inlined, so each size stays a CSS
|
|
59
|
-
* variable an app can override from `:root` or its own `@theme`.
|
|
60
|
-
*/
|
|
61
|
-
@theme {
|
|
62
|
-
--text-h1: 1.875rem;
|
|
63
|
-
--text-h1--line-height: calc(2.25 / 1.875);
|
|
64
|
-
--text-h2: 1.5rem;
|
|
65
|
-
--text-h2--line-height: calc(2 / 1.5);
|
|
66
|
-
--text-h3: 1.25rem;
|
|
67
|
-
--text-h3--line-height: calc(1.75 / 1.25);
|
|
68
|
-
--text-h4: 1.125rem;
|
|
69
|
-
--text-h4--line-height: calc(1.75 / 1.125);
|
|
70
|
-
--text-lead: 1rem;
|
|
71
|
-
--text-lead--line-height: 1.5;
|
|
72
|
-
--text-body: 0.875rem;
|
|
73
|
-
--text-body--line-height: 1.5;
|
|
74
|
-
--text-small: 0.75rem;
|
|
75
|
-
--text-small--line-height: 1;
|
|
76
|
-
--text-code: 0.75rem;
|
|
77
|
-
--text-code--line-height: calc(1 / 0.75);
|
|
78
|
-
}
|
|
79
|
-
|
|
80
62
|
/**
|
|
81
63
|
* Shared focus-visible ring for components that opt into focus-ring.
|
|
82
64
|
*/
|