@wordpress/ui 0.5.1-next.v.0 → 0.6.0
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/CHANGELOG.md +5 -1
- package/build/box/box.cjs +2 -2
- package/build/box/box.cjs.map +2 -2
- package/build/button/button.cjs +18 -303
- package/build/button/button.cjs.map +3 -3
- package/build/form/primitives/constants.cjs +35 -0
- package/build/form/primitives/constants.cjs.map +7 -0
- package/build/form/primitives/field/description.cjs +6 -33
- package/build/form/primitives/field/description.cjs.map +2 -2
- package/build/form/primitives/field/details.cjs +6 -33
- package/build/form/primitives/field/details.cjs.map +2 -2
- package/build/form/primitives/field/label.cjs +6 -33
- package/build/form/primitives/field/label.cjs.map +2 -2
- package/build/form/primitives/field/root.cjs +6 -17
- package/build/form/primitives/field/root.cjs.map +2 -2
- package/build/form/primitives/fieldset/description.cjs +6 -33
- package/build/form/primitives/fieldset/description.cjs.map +2 -2
- package/build/form/primitives/fieldset/details.cjs +6 -33
- package/build/form/primitives/fieldset/details.cjs.map +2 -2
- package/build/form/primitives/fieldset/legend.cjs +6 -33
- package/build/form/primitives/fieldset/legend.cjs.map +2 -2
- package/build/form/primitives/fieldset/root.cjs +6 -16
- package/build/form/primitives/fieldset/root.cjs.map +2 -2
- package/build/form/primitives/index.cjs +8 -2
- package/build/form/primitives/index.cjs.map +2 -2
- package/build/form/primitives/input/index.cjs +31 -0
- package/build/form/primitives/input/index.cjs.map +7 -0
- package/build/form/primitives/input/input.cjs +82 -0
- package/build/form/primitives/input/input.cjs.map +7 -0
- package/build/form/primitives/input/types.cjs +19 -0
- package/build/form/primitives/input/types.cjs.map +7 -0
- package/build/form/primitives/input-layout/input-layout.cjs +12 -111
- package/build/form/primitives/input-layout/input-layout.cjs.map +3 -3
- package/build/form/primitives/input-layout/slot.cjs +6 -94
- package/build/form/primitives/input-layout/slot.cjs.map +2 -2
- package/build/form/primitives/select/index.cjs +40 -0
- package/build/form/primitives/select/index.cjs.map +7 -0
- package/build/form/primitives/select/item.cjs +98 -0
- package/build/form/primitives/select/item.cjs.map +7 -0
- package/build/form/primitives/select/popup.cjs +109 -0
- package/build/form/primitives/select/popup.cjs.map +7 -0
- package/build/form/primitives/select/root.cjs +35 -0
- package/build/form/primitives/select/root.cjs.map +7 -0
- package/build/form/primitives/select/trigger.cjs +116 -0
- package/build/form/primitives/select/trigger.cjs.map +7 -0
- package/build/form/primitives/select/types.cjs +19 -0
- package/build/form/primitives/select/types.cjs.map +7 -0
- package/build/index.cjs +19 -0
- package/build/index.cjs.map +2 -2
- package/build/lock-unlock.cjs +37 -0
- package/build/lock-unlock.cjs.map +7 -0
- package/build/stack/stack.cjs +6 -11
- package/build/stack/stack.cjs.map +2 -2
- package/build/tooltip/index.cjs +40 -0
- package/build/tooltip/index.cjs.map +7 -0
- package/build/tooltip/popup.cjs +100 -0
- package/build/tooltip/popup.cjs.map +7 -0
- package/build/tooltip/provider.cjs +35 -0
- package/build/tooltip/provider.cjs.map +7 -0
- package/build/tooltip/root.cjs +35 -0
- package/build/tooltip/root.cjs.map +7 -0
- package/build/tooltip/trigger.cjs +38 -0
- package/build/tooltip/trigger.cjs.map +7 -0
- package/build/tooltip/types.cjs +19 -0
- package/build/tooltip/types.cjs.map +7 -0
- package/build/utils/types.cjs.map +1 -1
- package/build/visually-hidden/visually-hidden.cjs +6 -19
- package/build/visually-hidden/visually-hidden.cjs.map +2 -2
- package/build-module/box/box.mjs +2 -2
- package/build-module/box/box.mjs.map +2 -2
- package/build-module/button/button.mjs +18 -303
- package/build-module/button/button.mjs.map +3 -3
- package/build-module/form/primitives/constants.mjs +10 -0
- package/build-module/form/primitives/constants.mjs.map +7 -0
- package/build-module/form/primitives/field/description.mjs +6 -33
- package/build-module/form/primitives/field/description.mjs.map +2 -2
- package/build-module/form/primitives/field/details.mjs +6 -33
- package/build-module/form/primitives/field/details.mjs.map +2 -2
- package/build-module/form/primitives/field/label.mjs +6 -33
- package/build-module/form/primitives/field/label.mjs.map +2 -2
- package/build-module/form/primitives/field/root.mjs +6 -17
- package/build-module/form/primitives/field/root.mjs.map +2 -2
- package/build-module/form/primitives/fieldset/description.mjs +6 -33
- package/build-module/form/primitives/fieldset/description.mjs.map +2 -2
- package/build-module/form/primitives/fieldset/details.mjs +6 -33
- package/build-module/form/primitives/fieldset/details.mjs.map +2 -2
- package/build-module/form/primitives/fieldset/legend.mjs +6 -33
- package/build-module/form/primitives/fieldset/legend.mjs.map +2 -2
- package/build-module/form/primitives/fieldset/root.mjs +6 -16
- package/build-module/form/primitives/fieldset/root.mjs.map +2 -2
- package/build-module/form/primitives/index.mjs +5 -1
- package/build-module/form/primitives/index.mjs.map +2 -2
- package/build-module/form/primitives/input/index.mjs +6 -0
- package/build-module/form/primitives/input/index.mjs.map +7 -0
- package/build-module/form/primitives/input/input.mjs +47 -0
- package/build-module/form/primitives/input/input.mjs.map +7 -0
- package/build-module/form/primitives/input/types.mjs +1 -0
- package/build-module/form/primitives/input/types.mjs.map +7 -0
- package/build-module/form/primitives/input-layout/input-layout.mjs +12 -111
- package/build-module/form/primitives/input-layout/input-layout.mjs.map +3 -3
- package/build-module/form/primitives/input-layout/slot.mjs +6 -94
- package/build-module/form/primitives/input-layout/slot.mjs.map +2 -2
- package/build-module/form/primitives/select/index.mjs +12 -0
- package/build-module/form/primitives/select/index.mjs.map +7 -0
- package/build-module/form/primitives/select/item.mjs +63 -0
- package/build-module/form/primitives/select/item.mjs.map +7 -0
- package/build-module/form/primitives/select/popup.mjs +76 -0
- package/build-module/form/primitives/select/popup.mjs.map +7 -0
- package/build-module/form/primitives/select/root.mjs +10 -0
- package/build-module/form/primitives/select/root.mjs.map +7 -0
- package/build-module/form/primitives/select/trigger.mjs +81 -0
- package/build-module/form/primitives/select/trigger.mjs.map +7 -0
- package/build-module/form/primitives/select/types.mjs +1 -0
- package/build-module/form/primitives/select/types.mjs.map +7 -0
- package/build-module/index.mjs +4 -0
- package/build-module/index.mjs.map +2 -2
- package/build-module/lock-unlock.mjs +11 -0
- package/build-module/lock-unlock.mjs.map +7 -0
- package/build-module/stack/stack.mjs +6 -11
- package/build-module/stack/stack.mjs.map +2 -2
- package/build-module/tooltip/index.mjs +12 -0
- package/build-module/tooltip/index.mjs.map +7 -0
- package/build-module/tooltip/popup.mjs +67 -0
- package/build-module/tooltip/popup.mjs.map +7 -0
- package/build-module/tooltip/provider.mjs +10 -0
- package/build-module/tooltip/provider.mjs.map +7 -0
- package/build-module/tooltip/root.mjs +10 -0
- package/build-module/tooltip/root.mjs.map +7 -0
- package/build-module/tooltip/trigger.mjs +13 -0
- package/build-module/tooltip/trigger.mjs.map +7 -0
- package/build-module/tooltip/types.mjs +1 -0
- package/build-module/tooltip/types.mjs.map +7 -0
- package/build-module/visually-hidden/visually-hidden.mjs +6 -19
- package/build-module/visually-hidden/visually-hidden.mjs.map +2 -2
- package/build-types/badge/stories/choosing-intent.story.d.ts +17 -0
- package/build-types/badge/stories/choosing-intent.story.d.ts.map +1 -0
- package/build-types/badge/stories/index.story.d.ts +1 -1
- package/build-types/badge/stories/index.story.d.ts.map +1 -1
- package/build-types/box/stories/index.story.d.ts +1 -1
- package/build-types/box/stories/index.story.d.ts.map +1 -1
- package/build-types/button/stories/index.story.d.ts +1 -1
- package/build-types/button/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/constants.d.ts +9 -0
- package/build-types/form/primitives/constants.d.ts.map +1 -0
- package/build-types/form/primitives/field/stories/index.story.d.ts +1 -1
- package/build-types/form/primitives/field/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/fieldset/stories/index.story.d.ts +1 -1
- package/build-types/form/primitives/fieldset/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/index.d.ts +2 -0
- package/build-types/form/primitives/index.d.ts.map +1 -1
- package/build-types/form/primitives/input/index.d.ts +2 -0
- package/build-types/form/primitives/input/index.d.ts.map +1 -0
- package/build-types/form/primitives/input/input.d.ts +10 -0
- package/build-types/form/primitives/input/input.d.ts.map +1 -0
- package/build-types/form/primitives/input/stories/index.story.d.ts +13 -0
- package/build-types/form/primitives/input/stories/index.story.d.ts.map +1 -0
- package/build-types/form/primitives/input/test/index.test.d.ts +2 -0
- package/build-types/form/primitives/input/test/index.test.d.ts.map +1 -0
- package/build-types/form/primitives/input/types.d.ts +27 -0
- package/build-types/form/primitives/input/types.d.ts.map +1 -0
- package/build-types/form/primitives/input-layout/stories/index.story.d.ts +1 -1
- package/build-types/form/primitives/input-layout/stories/index.story.d.ts.map +1 -1
- package/build-types/form/primitives/select/index.d.ts +5 -0
- package/build-types/form/primitives/select/index.d.ts.map +1 -0
- package/build-types/form/primitives/select/item.d.ts +7 -0
- package/build-types/form/primitives/select/item.d.ts.map +1 -0
- package/build-types/form/primitives/select/popup.d.ts +2 -0
- package/build-types/form/primitives/select/popup.d.ts.map +1 -0
- package/build-types/form/primitives/select/root.d.ts +3 -0
- package/build-types/form/primitives/select/root.d.ts.map +1 -0
- package/build-types/form/primitives/select/stories/index.story.d.ts +50 -0
- package/build-types/form/primitives/select/stories/index.story.d.ts.map +1 -0
- package/build-types/form/primitives/select/test/index.test.d.ts +2 -0
- package/build-types/form/primitives/select/test/index.test.d.ts.map +1 -0
- package/build-types/form/primitives/select/trigger.d.ts +7 -0
- package/build-types/form/primitives/select/trigger.d.ts.map +1 -0
- package/build-types/form/primitives/select/types.d.ts +42 -0
- package/build-types/form/primitives/select/types.d.ts.map +1 -0
- package/build-types/icon/stories/index.story.d.ts +1 -1
- package/build-types/icon/stories/index.story.d.ts.map +1 -1
- package/build-types/index.d.ts +1 -0
- package/build-types/index.d.ts.map +1 -1
- package/build-types/lock-unlock.d.ts +2 -0
- package/build-types/lock-unlock.d.ts.map +1 -0
- package/build-types/stack/stories/index.story.d.ts +1 -1
- package/build-types/stack/stories/index.story.d.ts.map +1 -1
- package/build-types/tooltip/index.d.ts +6 -0
- package/build-types/tooltip/index.d.ts.map +1 -0
- package/build-types/tooltip/popup.d.ts +4 -0
- package/build-types/tooltip/popup.d.ts.map +1 -0
- package/build-types/tooltip/provider.d.ts +4 -0
- package/build-types/tooltip/provider.d.ts.map +1 -0
- package/build-types/tooltip/root.d.ts +4 -0
- package/build-types/tooltip/root.d.ts.map +1 -0
- package/build-types/tooltip/stories/index.story.d.ts +23 -0
- package/build-types/tooltip/stories/index.story.d.ts.map +1 -0
- package/build-types/tooltip/test/index.test.d.ts +2 -0
- package/build-types/tooltip/test/index.test.d.ts.map +1 -0
- package/build-types/tooltip/trigger.d.ts +4 -0
- package/build-types/tooltip/trigger.d.ts.map +1 -0
- package/build-types/tooltip/types.d.ts +18 -0
- package/build-types/tooltip/types.d.ts.map +1 -0
- package/build-types/utils/types.d.ts +0 -3
- package/build-types/utils/types.d.ts.map +1 -1
- package/build-types/visually-hidden/stories/index.story.d.ts +1 -1
- package/build-types/visually-hidden/stories/index.story.d.ts.map +1 -1
- package/package.json +12 -10
- package/src/badge/stories/choosing-intent.mdx +29 -32
- package/src/badge/stories/choosing-intent.story.tsx +129 -0
- package/src/badge/stories/index.story.tsx +1 -1
- package/src/box/box.tsx +2 -2
- package/src/box/stories/index.story.tsx +1 -1
- package/src/box/test/box.test.tsx +0 -11
- package/src/button/stories/index.story.tsx +1 -6
- package/src/button/style.module.css +2 -2
- package/src/button/test/button.test.tsx +1 -16
- package/src/form/primitives/constants.ts +10 -0
- package/src/form/primitives/field/stories/index.story.tsx +1 -1
- package/src/form/primitives/fieldset/stories/index.story.tsx +1 -1
- package/src/form/primitives/index.ts +2 -0
- package/src/form/primitives/input/index.ts +1 -0
- package/src/form/primitives/input/input.tsx +28 -0
- package/src/form/primitives/input/stories/index.story.tsx +40 -0
- package/src/form/primitives/input/style.module.css +34 -0
- package/src/form/primitives/input/test/index.test.tsx +13 -0
- package/src/form/primitives/input/types.ts +31 -0
- package/src/form/primitives/input-layout/stories/index.story.tsx +1 -1
- package/src/form/primitives/input-layout/style.module.css +5 -4
- package/src/form/primitives/select/index.ts +4 -0
- package/src/form/primitives/select/item.tsx +39 -0
- package/src/form/primitives/select/popup.tsx +55 -0
- package/src/form/primitives/select/root.tsx +6 -0
- package/src/form/primitives/select/stories/index.story.tsx +276 -0
- package/src/form/primitives/select/style.module.css +7 -0
- package/src/form/primitives/select/test/index.test.tsx +35 -0
- package/src/form/primitives/select/trigger.tsx +58 -0
- package/src/form/primitives/select/types.ts +52 -0
- package/src/icon/stories/index.story.tsx +1 -1
- package/src/index.ts +1 -0
- package/src/lock-unlock.ts +7 -0
- package/src/stack/stories/index.story.tsx +1 -1
- package/src/stories/introduction.mdx +1 -1
- package/src/tooltip/index.ts +6 -0
- package/src/tooltip/popup.tsx +64 -0
- package/src/tooltip/provider.tsx +8 -0
- package/src/tooltip/root.tsx +8 -0
- package/src/tooltip/stories/index.story.tsx +97 -0
- package/src/tooltip/style.module.css +20 -0
- package/src/tooltip/test/index.test.tsx +87 -0
- package/src/tooltip/trigger.tsx +15 -0
- package/src/tooltip/types.ts +26 -0
- package/src/utils/css/dropdown-motion.module.css +47 -0
- package/src/utils/css/focus.module.css +1 -1
- package/src/utils/css/item-popup.module.css +127 -0
- package/src/utils/css/select-trigger.module.css +58 -0
- package/src/utils/types.ts +0 -3
- package/src/visually-hidden/stories/index.story.tsx +1 -1
|
@@ -4,40 +4,13 @@ import { Field as _Field } from "@base-ui/react/field";
|
|
|
4
4
|
import { forwardRef } from "@wordpress/element";
|
|
5
5
|
|
|
6
6
|
// packages/ui/src/utils/css/field.module.css
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
font-family: var(--wpds-font-family-body);
|
|
14
|
-
font-size: var(--wpds-font-size-xs);
|
|
15
|
-
line-height: var(--wp-ui-field-label-line-height);
|
|
16
|
-
font-weight: var(--wpds-font-weight-medium);
|
|
17
|
-
text-transform: uppercase;
|
|
18
|
-
color: var(--wpds-color-fg-content-neutral);
|
|
19
|
-
|
|
20
|
-
&.field-module__is-plain__F8QhR {
|
|
21
|
-
font-size: var(--wpds-font-size-md);
|
|
22
|
-
text-transform: none;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.field-module__description__CKN1B {
|
|
27
|
-
margin: 0;
|
|
28
|
-
font-family: var(--wpds-font-family-body);
|
|
29
|
-
font-size: var(--wpds-font-size-sm);
|
|
30
|
-
line-height: var(--wpds-font-line-height-xs);
|
|
31
|
-
color: var(--wpds-color-fg-content-neutral-weak);
|
|
32
|
-
}
|
|
7
|
+
if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='04c8f253c6']")) {
|
|
8
|
+
const style = document.createElement("style");
|
|
9
|
+
style.setAttribute("data-wp-hash", "04c8f253c6");
|
|
10
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._2d5ad850b2f90964__label{--wp-ui-field-label-line-height:var(--wpds-font-line-height-xs);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-xs);font-weight:var(--wpds-font-weight-medium);line-height:var(--wp-ui-field-label-line-height);text-transform:uppercase;&._17c4214649230bea__is-plain{font-size:var(--wpds-font-size-md);text-transform:none}}._08a3750500e0233f__description{color:var(--wpds-color-fg-content-neutral-weak);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:var(--wpds-font-line-height-xs);margin:0}}"));
|
|
11
|
+
document.head.appendChild(style);
|
|
33
12
|
}
|
|
34
|
-
|
|
35
|
-
document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css));
|
|
36
|
-
var field_default = {
|
|
37
|
-
"label": "field-module__label__LVrYU",
|
|
38
|
-
"is-plain": "field-module__is-plain__F8QhR",
|
|
39
|
-
"description": "field-module__description__CKN1B"
|
|
40
|
-
};
|
|
13
|
+
var field_default = { "label": "_2d5ad850b2f90964__label", "is-plain": "_17c4214649230bea__is-plain", "description": "_08a3750500e0233f__description" };
|
|
41
14
|
|
|
42
15
|
// packages/ui/src/form/primitives/field/label.tsx
|
|
43
16
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/form/primitives/field/label.tsx", "../../../../src/utils/css/field.module.css"],
|
|
4
|
-
"sourcesContent": ["import clsx from 'clsx';\nimport { Field as _Field } from '@base-ui/react/field';\nimport { forwardRef } from '@wordpress/element';\nimport fieldStyles from '../../../utils/css/field.module.css';\nimport type { FieldLabelProps } from './types';\n\nexport const Label = forwardRef< HTMLLabelElement, FieldLabelProps >(\n\tfunction Label( { className, variant, ...restProps }, ref ) {\n\t\treturn (\n\t\t\t<_Field.Label\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tfieldStyles.label,\n\t\t\t\t\tvariant && fieldStyles[ `is-${ variant }` ],\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t);\n\t}\n);\n", "
|
|
5
|
-
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,SAAS,cAAc;AAChC,SAAS,kBAAkB;;;ACF3B,
|
|
4
|
+
"sourcesContent": ["import clsx from 'clsx';\nimport { Field as _Field } from '@base-ui/react/field';\nimport { forwardRef } from '@wordpress/element';\nimport fieldStyles from '../../../utils/css/field.module.css';\nimport type { FieldLabelProps } from './types';\n\nexport const Label = forwardRef< HTMLLabelElement, FieldLabelProps >(\n\tfunction Label( { className, variant, ...restProps }, ref ) {\n\t\treturn (\n\t\t\t<_Field.Label\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tfieldStyles.label,\n\t\t\t\t\tvariant && fieldStyles[ `is-${ variant }` ],\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='04c8f253c6']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"04c8f253c6\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._2d5ad850b2f90964__label{--wp-ui-field-label-line-height:var(--wpds-font-line-height-xs);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-xs);font-weight:var(--wpds-font-weight-medium);line-height:var(--wp-ui-field-label-line-height);text-transform:uppercase;&._17c4214649230bea__is-plain{font-size:var(--wpds-font-size-md);text-transform:none}}._08a3750500e0233f__description{color:var(--wpds-color-fg-content-neutral-weak);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:var(--wpds-font-line-height-xs);margin:0}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"label\":\"_2d5ad850b2f90964__label\",\"is-plain\":\"_17c4214649230bea__is-plain\",\"description\":\"_08a3750500e0233f__description\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,SAAS,cAAc;AAChC,SAAS,kBAAkB;;;ACF3B,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,qtBAAqtB,CAAC;AAChwB,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,SAAQ,4BAA2B,YAAW,+BAA8B,eAAc,iCAAgC;;;ADGvI;AAHI,IAAM,QAAQ;AAAA,EACpB,SAASA,OAAO,EAAE,WAAW,SAAS,GAAG,UAAU,GAAG,KAAM;AAC3D,WACC;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACA;AAAA,QACA,WAAY;AAAA,UACX,cAAY;AAAA,UACZ,WAAW,cAAa,MAAO,OAAQ,EAAG;AAAA,UAC1C;AAAA,QACD;AAAA,QACE,GAAG;AAAA;AAAA,IACN;AAAA,EAEF;AACD;",
|
|
6
6
|
"names": ["Label"]
|
|
7
7
|
}
|
|
@@ -4,24 +4,13 @@ import { Field as _Field } from "@base-ui/react/field";
|
|
|
4
4
|
import { forwardRef } from "@wordpress/element";
|
|
5
5
|
|
|
6
6
|
// packages/ui/src/utils/css/resets.module.css
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
*,
|
|
14
|
-
*::before,
|
|
15
|
-
*::after {
|
|
16
|
-
box-sizing: inherit;
|
|
17
|
-
}
|
|
18
|
-
}
|
|
7
|
+
if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='671ebfc62d']")) {
|
|
8
|
+
const style = document.createElement("style");
|
|
9
|
+
style.setAttribute("data-wp-hash", "671ebfc62d");
|
|
10
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._336cd3e4e743482f__box-sizing{box-sizing:border-box;*,:after,:before{box-sizing:inherit}}}"));
|
|
11
|
+
document.head.appendChild(style);
|
|
19
12
|
}
|
|
20
|
-
|
|
21
|
-
document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css));
|
|
22
|
-
var resets_default = {
|
|
23
|
-
"box-sizing": "resets-module__box-sizing__M2zT5"
|
|
24
|
-
};
|
|
13
|
+
var resets_default = { "box-sizing": "_336cd3e4e743482f__box-sizing" };
|
|
25
14
|
|
|
26
15
|
// packages/ui/src/form/primitives/field/root.tsx
|
|
27
16
|
import { Stack } from "../../../stack/index.mjs";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/form/primitives/field/root.tsx", "../../../../src/utils/css/resets.module.css"],
|
|
4
|
-
"sourcesContent": ["import clsx from 'clsx';\nimport { Field as _Field } from '@base-ui/react/field';\nimport { forwardRef } from '@wordpress/element';\nimport resetStyles from '../../../utils/css/resets.module.css';\nimport type { FieldRootProps } from './types';\nimport { Stack } from '../../../stack';\n\nconst DEFAULT_RENDER = ( props: React.ComponentProps< typeof Stack > ) => (\n\t<Stack { ...props } direction=\"column\" gap=\"xs\" />\n);\n\n/**\n * A low-level component that associates an accessible label and description\n * with a single form control element.\n *\n * To label a group of multiple form control elements, use the `Fieldset` component instead.\n *\n * Simply wrapping a control with this component does not guarantee\n * accessible labeling. See examples for how to associate the label in different cases.\n */\nexport const Root = forwardRef< HTMLDivElement, FieldRootProps >( function Root(\n\t{ className, render = DEFAULT_RENDER, ...restProps },\n\tref\n) {\n\treturn (\n\t\t<_Field.Root\n\t\t\tref={ ref }\n\t\t\tclassName={ clsx( resetStyles[ 'box-sizing' ], className ) }\n\t\t\trender={ render }\n\t\t\t{ ...restProps }\n\t\t/>\n\t);\n} );\n", "
|
|
5
|
-
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,SAAS,cAAc;AAChC,SAAS,kBAAkB;;;ACF3B,
|
|
4
|
+
"sourcesContent": ["import clsx from 'clsx';\nimport { Field as _Field } from '@base-ui/react/field';\nimport { forwardRef } from '@wordpress/element';\nimport resetStyles from '../../../utils/css/resets.module.css';\nimport type { FieldRootProps } from './types';\nimport { Stack } from '../../../stack';\n\nconst DEFAULT_RENDER = ( props: React.ComponentProps< typeof Stack > ) => (\n\t<Stack { ...props } direction=\"column\" gap=\"xs\" />\n);\n\n/**\n * A low-level component that associates an accessible label and description\n * with a single form control element.\n *\n * To label a group of multiple form control elements, use the `Fieldset` component instead.\n *\n * Simply wrapping a control with this component does not guarantee\n * accessible labeling. See examples for how to associate the label in different cases.\n */\nexport const Root = forwardRef< HTMLDivElement, FieldRootProps >( function Root(\n\t{ className, render = DEFAULT_RENDER, ...restProps },\n\tref\n) {\n\treturn (\n\t\t<_Field.Root\n\t\t\tref={ ref }\n\t\t\tclassName={ clsx( resetStyles[ 'box-sizing' ], className ) }\n\t\t\trender={ render }\n\t\t\t{ ...restProps }\n\t\t/>\n\t);\n} );\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='671ebfc62d']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"671ebfc62d\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._336cd3e4e743482f__box-sizing{box-sizing:border-box;*,:after,:before{box-sizing:inherit}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"box-sizing\":\"_336cd3e4e743482f__box-sizing\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,SAAS,cAAc;AAChC,SAAS,kBAAkB;;;ACF3B,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,kMAAkM,CAAC;AAC7O,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,iBAAQ,EAAC,cAAa,gCAA+B;;;ADD5D,SAAS,aAAa;AAGrB;AADD,IAAM,iBAAiB,CAAE,UACxB,oBAAC,SAAQ,GAAG,OAAQ,WAAU,UAAS,KAAI,MAAK;AAY1C,IAAM,OAAO,WAA8C,SAASA,MAC1E,EAAE,WAAW,SAAS,gBAAgB,GAAG,UAAU,GACnD,KACC;AACD,SACC;AAAA,IAAC,OAAO;AAAA,IAAP;AAAA,MACA;AAAA,MACA,WAAY,KAAM,eAAa,YAAa,GAAG,SAAU;AAAA,MACzD;AAAA,MACE,GAAG;AAAA;AAAA,EACN;AAEF,CAAE;",
|
|
6
6
|
"names": ["Root"]
|
|
7
7
|
}
|
|
@@ -4,40 +4,13 @@ import { mergeProps, useRender } from "@base-ui/react";
|
|
|
4
4
|
import { forwardRef, useEffect, useId } from "@wordpress/element";
|
|
5
5
|
|
|
6
6
|
// packages/ui/src/utils/css/field.module.css
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
font-family: var(--wpds-font-family-body);
|
|
14
|
-
font-size: var(--wpds-font-size-xs);
|
|
15
|
-
line-height: var(--wp-ui-field-label-line-height);
|
|
16
|
-
font-weight: var(--wpds-font-weight-medium);
|
|
17
|
-
text-transform: uppercase;
|
|
18
|
-
color: var(--wpds-color-fg-content-neutral);
|
|
19
|
-
|
|
20
|
-
&.field-module__is-plain__F8QhR {
|
|
21
|
-
font-size: var(--wpds-font-size-md);
|
|
22
|
-
text-transform: none;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.field-module__description__CKN1B {
|
|
27
|
-
margin: 0;
|
|
28
|
-
font-family: var(--wpds-font-family-body);
|
|
29
|
-
font-size: var(--wpds-font-size-sm);
|
|
30
|
-
line-height: var(--wpds-font-line-height-xs);
|
|
31
|
-
color: var(--wpds-color-fg-content-neutral-weak);
|
|
32
|
-
}
|
|
7
|
+
if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='04c8f253c6']")) {
|
|
8
|
+
const style = document.createElement("style");
|
|
9
|
+
style.setAttribute("data-wp-hash", "04c8f253c6");
|
|
10
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._2d5ad850b2f90964__label{--wp-ui-field-label-line-height:var(--wpds-font-line-height-xs);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-xs);font-weight:var(--wpds-font-weight-medium);line-height:var(--wp-ui-field-label-line-height);text-transform:uppercase;&._17c4214649230bea__is-plain{font-size:var(--wpds-font-size-md);text-transform:none}}._08a3750500e0233f__description{color:var(--wpds-color-fg-content-neutral-weak);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:var(--wpds-font-line-height-xs);margin:0}}"));
|
|
11
|
+
document.head.appendChild(style);
|
|
33
12
|
}
|
|
34
|
-
|
|
35
|
-
document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css));
|
|
36
|
-
var field_default = {
|
|
37
|
-
"label": "field-module__label__LVrYU",
|
|
38
|
-
"is-plain": "field-module__is-plain__F8QhR",
|
|
39
|
-
"description": "field-module__description__CKN1B"
|
|
40
|
-
};
|
|
13
|
+
var field_default = { "label": "_2d5ad850b2f90964__label", "is-plain": "_17c4214649230bea__is-plain", "description": "_08a3750500e0233f__description" };
|
|
41
14
|
|
|
42
15
|
// packages/ui/src/form/primitives/fieldset/description.tsx
|
|
43
16
|
import { useFieldsetContext } from "./context.mjs";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/form/primitives/fieldset/description.tsx", "../../../../src/utils/css/field.module.css"],
|
|
4
|
-
"sourcesContent": ["import clsx from 'clsx';\nimport { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef, useEffect, useId } from '@wordpress/element';\nimport fieldStyles from '../../../utils/css/field.module.css';\nimport { useFieldsetContext } from './context';\nimport type { FieldsetDescriptionProps } from './types';\n\nexport const FieldsetDescription = forwardRef<\n\tHTMLParagraphElement,\n\tFieldsetDescriptionProps\n>( function FieldsetDescription(\n\t{ className, id: idProp, render, ...restProps },\n\tref\n) {\n\tconst generatedId = useId();\n\tconst id = idProp ?? generatedId;\n\tconst { registerDescriptionId, unregisterDescriptionId } =\n\t\tuseFieldsetContext();\n\n\tuseEffect( () => {\n\t\tregisterDescriptionId( id );\n\t\treturn unregisterDescriptionId;\n\t}, [ registerDescriptionId, unregisterDescriptionId, id ] );\n\n\tconst element = useRender( {\n\t\tdefaultTagName: 'p',\n\t\trender,\n\t\tref,\n\t\tprops: mergeProps< 'p' >(\n\t\t\t{ className: clsx( fieldStyles.description, className ), id },\n\t\t\trestProps\n\t\t),\n\t} );\n\n\treturn element;\n} );\n", "
|
|
5
|
-
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,YAAY,iBAAiB;AACtC,SAAS,YAAY,WAAW,aAAa;;;ACF7C,
|
|
4
|
+
"sourcesContent": ["import clsx from 'clsx';\nimport { mergeProps, useRender } from '@base-ui/react';\nimport { forwardRef, useEffect, useId } from '@wordpress/element';\nimport fieldStyles from '../../../utils/css/field.module.css';\nimport { useFieldsetContext } from './context';\nimport type { FieldsetDescriptionProps } from './types';\n\nexport const FieldsetDescription = forwardRef<\n\tHTMLParagraphElement,\n\tFieldsetDescriptionProps\n>( function FieldsetDescription(\n\t{ className, id: idProp, render, ...restProps },\n\tref\n) {\n\tconst generatedId = useId();\n\tconst id = idProp ?? generatedId;\n\tconst { registerDescriptionId, unregisterDescriptionId } =\n\t\tuseFieldsetContext();\n\n\tuseEffect( () => {\n\t\tregisterDescriptionId( id );\n\t\treturn unregisterDescriptionId;\n\t}, [ registerDescriptionId, unregisterDescriptionId, id ] );\n\n\tconst element = useRender( {\n\t\tdefaultTagName: 'p',\n\t\trender,\n\t\tref,\n\t\tprops: mergeProps< 'p' >(\n\t\t\t{ className: clsx( fieldStyles.description, className ), id },\n\t\t\trestProps\n\t\t),\n\t} );\n\n\treturn element;\n} );\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='04c8f253c6']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"04c8f253c6\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._2d5ad850b2f90964__label{--wp-ui-field-label-line-height:var(--wpds-font-line-height-xs);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-xs);font-weight:var(--wpds-font-weight-medium);line-height:var(--wp-ui-field-label-line-height);text-transform:uppercase;&._17c4214649230bea__is-plain{font-size:var(--wpds-font-size-md);text-transform:none}}._08a3750500e0233f__description{color:var(--wpds-color-fg-content-neutral-weak);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:var(--wpds-font-line-height-xs);margin:0}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"label\":\"_2d5ad850b2f90964__label\",\"is-plain\":\"_17c4214649230bea__is-plain\",\"description\":\"_08a3750500e0233f__description\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,YAAY,iBAAiB;AACtC,SAAS,YAAY,WAAW,aAAa;;;ACF7C,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,qtBAAqtB,CAAC;AAChwB,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,SAAQ,4BAA2B,YAAW,+BAA8B,eAAc,iCAAgC;;;ADF1I,SAAS,0BAA0B;AAG5B,IAAM,sBAAsB,WAGhC,SAASA,qBACX,EAAE,WAAW,IAAI,QAAQ,QAAQ,GAAG,UAAU,GAC9C,KACC;AACD,QAAM,cAAc,MAAM;AAC1B,QAAM,KAAK,UAAU;AACrB,QAAM,EAAE,uBAAuB,wBAAwB,IACtD,mBAAmB;AAEpB,YAAW,MAAM;AAChB,0BAAuB,EAAG;AAC1B,WAAO;AAAA,EACR,GAAG,CAAE,uBAAuB,yBAAyB,EAAG,CAAE;AAE1D,QAAM,UAAU,UAAW;AAAA,IAC1B,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA,OAAO;AAAA,MACN,EAAE,WAAW,KAAM,cAAY,aAAa,SAAU,GAAG,GAAG;AAAA,MAC5D;AAAA,IACD;AAAA,EACD,CAAE;AAEF,SAAO;AACR,CAAE;",
|
|
6
6
|
"names": ["FieldsetDescription"]
|
|
7
7
|
}
|
|
@@ -4,40 +4,13 @@ import { forwardRef, useEffect, useId } from "@wordpress/element";
|
|
|
4
4
|
import { __ } from "@wordpress/i18n";
|
|
5
5
|
|
|
6
6
|
// packages/ui/src/utils/css/field.module.css
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
font-family: var(--wpds-font-family-body);
|
|
14
|
-
font-size: var(--wpds-font-size-xs);
|
|
15
|
-
line-height: var(--wp-ui-field-label-line-height);
|
|
16
|
-
font-weight: var(--wpds-font-weight-medium);
|
|
17
|
-
text-transform: uppercase;
|
|
18
|
-
color: var(--wpds-color-fg-content-neutral);
|
|
19
|
-
|
|
20
|
-
&.field-module__is-plain__F8QhR {
|
|
21
|
-
font-size: var(--wpds-font-size-md);
|
|
22
|
-
text-transform: none;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.field-module__description__CKN1B {
|
|
27
|
-
margin: 0;
|
|
28
|
-
font-family: var(--wpds-font-family-body);
|
|
29
|
-
font-size: var(--wpds-font-size-sm);
|
|
30
|
-
line-height: var(--wpds-font-line-height-xs);
|
|
31
|
-
color: var(--wpds-color-fg-content-neutral-weak);
|
|
32
|
-
}
|
|
7
|
+
if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='04c8f253c6']")) {
|
|
8
|
+
const style = document.createElement("style");
|
|
9
|
+
style.setAttribute("data-wp-hash", "04c8f253c6");
|
|
10
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._2d5ad850b2f90964__label{--wp-ui-field-label-line-height:var(--wpds-font-line-height-xs);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-xs);font-weight:var(--wpds-font-weight-medium);line-height:var(--wp-ui-field-label-line-height);text-transform:uppercase;&._17c4214649230bea__is-plain{font-size:var(--wpds-font-size-md);text-transform:none}}._08a3750500e0233f__description{color:var(--wpds-color-fg-content-neutral-weak);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:var(--wpds-font-line-height-xs);margin:0}}"));
|
|
11
|
+
document.head.appendChild(style);
|
|
33
12
|
}
|
|
34
|
-
|
|
35
|
-
document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css));
|
|
36
|
-
var field_default = {
|
|
37
|
-
"label": "field-module__label__LVrYU",
|
|
38
|
-
"is-plain": "field-module__is-plain__F8QhR",
|
|
39
|
-
"description": "field-module__description__CKN1B"
|
|
40
|
-
};
|
|
13
|
+
var field_default = { "label": "_2d5ad850b2f90964__label", "is-plain": "_17c4214649230bea__is-plain", "description": "_08a3750500e0233f__description" };
|
|
41
14
|
|
|
42
15
|
// packages/ui/src/form/primitives/fieldset/details.tsx
|
|
43
16
|
import { useFieldsetContext } from "./context.mjs";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/form/primitives/fieldset/details.tsx", "../../../../src/utils/css/field.module.css"],
|
|
4
|
-
"sourcesContent": ["import clsx from 'clsx';\nimport { forwardRef, useEffect, useId } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport fieldStyles from '../../../utils/css/field.module.css';\nimport { useFieldsetContext } from './context';\nimport { VisuallyHidden } from '../../../visually-hidden';\nimport type { FieldsetDetailsProps } from './types';\n\n/**\n * A component for showing additional information about the fieldset,\n * styled similarly to a normal `Fieldset.Description`.\n * Unlike a normal description, it can include links and other semantic elements.\n *\n * Although this content is not associated with the fieldset using direct semantics,\n * it is made discoverable to screen reader users via a visually hidden description,\n * alerting them to the presence of additional information below.\n *\n * If the content only includes plain text, use `Fieldset.Description` instead,\n * so the readout is not unnecessarily verbose for screen reader users.\n */\nexport const FieldsetDetails = forwardRef<\n\tHTMLDivElement,\n\tFieldsetDetailsProps\n>( function FieldsetDetails( { className, ...restProps }, ref ) {\n\tconst id = useId();\n\tconst { registerDescriptionId, unregisterDescriptionId } =\n\t\tuseFieldsetContext();\n\n\tuseEffect( () => {\n\t\tregisterDescriptionId( id );\n\t\treturn unregisterDescriptionId;\n\t}, [ registerDescriptionId, unregisterDescriptionId, id ] );\n\n\treturn (\n\t\t<>\n\t\t\t<VisuallyHidden id={ id }>\n\t\t\t\t{ __( 'More details follow.' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t<div\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx( fieldStyles.description, className ) }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t</>\n\t);\n} );\n", "
|
|
5
|
-
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,YAAY,WAAW,aAAa;AAC7C,SAAS,UAAU;;;ACFnB,
|
|
4
|
+
"sourcesContent": ["import clsx from 'clsx';\nimport { forwardRef, useEffect, useId } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport fieldStyles from '../../../utils/css/field.module.css';\nimport { useFieldsetContext } from './context';\nimport { VisuallyHidden } from '../../../visually-hidden';\nimport type { FieldsetDetailsProps } from './types';\n\n/**\n * A component for showing additional information about the fieldset,\n * styled similarly to a normal `Fieldset.Description`.\n * Unlike a normal description, it can include links and other semantic elements.\n *\n * Although this content is not associated with the fieldset using direct semantics,\n * it is made discoverable to screen reader users via a visually hidden description,\n * alerting them to the presence of additional information below.\n *\n * If the content only includes plain text, use `Fieldset.Description` instead,\n * so the readout is not unnecessarily verbose for screen reader users.\n */\nexport const FieldsetDetails = forwardRef<\n\tHTMLDivElement,\n\tFieldsetDetailsProps\n>( function FieldsetDetails( { className, ...restProps }, ref ) {\n\tconst id = useId();\n\tconst { registerDescriptionId, unregisterDescriptionId } =\n\t\tuseFieldsetContext();\n\n\tuseEffect( () => {\n\t\tregisterDescriptionId( id );\n\t\treturn unregisterDescriptionId;\n\t}, [ registerDescriptionId, unregisterDescriptionId, id ] );\n\n\treturn (\n\t\t<>\n\t\t\t<VisuallyHidden id={ id }>\n\t\t\t\t{ __( 'More details follow.' ) }\n\t\t\t</VisuallyHidden>\n\t\t\t<div\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx( fieldStyles.description, className ) }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t</>\n\t);\n} );\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='04c8f253c6']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"04c8f253c6\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._2d5ad850b2f90964__label{--wp-ui-field-label-line-height:var(--wpds-font-line-height-xs);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-xs);font-weight:var(--wpds-font-weight-medium);line-height:var(--wp-ui-field-label-line-height);text-transform:uppercase;&._17c4214649230bea__is-plain{font-size:var(--wpds-font-size-md);text-transform:none}}._08a3750500e0233f__description{color:var(--wpds-color-fg-content-neutral-weak);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:var(--wpds-font-line-height-xs);margin:0}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"label\":\"_2d5ad850b2f90964__label\",\"is-plain\":\"_17c4214649230bea__is-plain\",\"description\":\"_08a3750500e0233f__description\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,YAAY,WAAW,aAAa;AAC7C,SAAS,UAAU;;;ACFnB,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,qtBAAqtB,CAAC;AAChwB,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,SAAQ,4BAA2B,YAAW,+BAA8B,eAAc,iCAAgC;;;ADF1I,SAAS,0BAA0B;AACnC,SAAS,sBAAsB;AA6B7B,mBACC,KADD;AAdK,IAAM,kBAAkB,WAG5B,SAASA,iBAAiB,EAAE,WAAW,GAAG,UAAU,GAAG,KAAM;AAC/D,QAAM,KAAK,MAAM;AACjB,QAAM,EAAE,uBAAuB,wBAAwB,IACtD,mBAAmB;AAEpB,YAAW,MAAM;AAChB,0BAAuB,EAAG;AAC1B,WAAO;AAAA,EACR,GAAG,CAAE,uBAAuB,yBAAyB,EAAG,CAAE;AAE1D,SACC,iCACC;AAAA,wBAAC,kBAAe,IACb,aAAI,sBAAuB,GAC9B;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,WAAY,KAAM,cAAY,aAAa,SAAU;AAAA,QACnD,GAAG;AAAA;AAAA,IACN;AAAA,KACD;AAEF,CAAE;",
|
|
6
6
|
"names": ["FieldsetDetails"]
|
|
7
7
|
}
|
|
@@ -4,40 +4,13 @@ import { Fieldset as _Fieldset } from "@base-ui/react/fieldset";
|
|
|
4
4
|
import { forwardRef } from "@wordpress/element";
|
|
5
5
|
|
|
6
6
|
// packages/ui/src/utils/css/field.module.css
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
font-family: var(--wpds-font-family-body);
|
|
14
|
-
font-size: var(--wpds-font-size-xs);
|
|
15
|
-
line-height: var(--wp-ui-field-label-line-height);
|
|
16
|
-
font-weight: var(--wpds-font-weight-medium);
|
|
17
|
-
text-transform: uppercase;
|
|
18
|
-
color: var(--wpds-color-fg-content-neutral);
|
|
19
|
-
|
|
20
|
-
&.field-module__is-plain__F8QhR {
|
|
21
|
-
font-size: var(--wpds-font-size-md);
|
|
22
|
-
text-transform: none;
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.field-module__description__CKN1B {
|
|
27
|
-
margin: 0;
|
|
28
|
-
font-family: var(--wpds-font-family-body);
|
|
29
|
-
font-size: var(--wpds-font-size-sm);
|
|
30
|
-
line-height: var(--wpds-font-line-height-xs);
|
|
31
|
-
color: var(--wpds-color-fg-content-neutral-weak);
|
|
32
|
-
}
|
|
7
|
+
if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='04c8f253c6']")) {
|
|
8
|
+
const style = document.createElement("style");
|
|
9
|
+
style.setAttribute("data-wp-hash", "04c8f253c6");
|
|
10
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._2d5ad850b2f90964__label{--wp-ui-field-label-line-height:var(--wpds-font-line-height-xs);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-xs);font-weight:var(--wpds-font-weight-medium);line-height:var(--wp-ui-field-label-line-height);text-transform:uppercase;&._17c4214649230bea__is-plain{font-size:var(--wpds-font-size-md);text-transform:none}}._08a3750500e0233f__description{color:var(--wpds-color-fg-content-neutral-weak);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:var(--wpds-font-line-height-xs);margin:0}}"));
|
|
11
|
+
document.head.appendChild(style);
|
|
33
12
|
}
|
|
34
|
-
|
|
35
|
-
document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css));
|
|
36
|
-
var field_default = {
|
|
37
|
-
"label": "field-module__label__LVrYU",
|
|
38
|
-
"is-plain": "field-module__is-plain__F8QhR",
|
|
39
|
-
"description": "field-module__description__CKN1B"
|
|
40
|
-
};
|
|
13
|
+
var field_default = { "label": "_2d5ad850b2f90964__label", "is-plain": "_17c4214649230bea__is-plain", "description": "_08a3750500e0233f__description" };
|
|
41
14
|
|
|
42
15
|
// packages/ui/src/form/primitives/fieldset/legend.tsx
|
|
43
16
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/form/primitives/fieldset/legend.tsx", "../../../../src/utils/css/field.module.css"],
|
|
4
|
-
"sourcesContent": ["import clsx from 'clsx';\nimport { Fieldset as _Fieldset } from '@base-ui/react/fieldset';\nimport { forwardRef } from '@wordpress/element';\nimport fieldStyles from '../../../utils/css/field.module.css';\nimport type { FieldsetLegendProps } from './types';\n\nexport const FieldsetLegend = forwardRef< HTMLDivElement, FieldsetLegendProps >(\n\tfunction FieldsetLegend( { className, ...restProps }, ref ) {\n\t\treturn (\n\t\t\t<_Fieldset.Legend\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx( fieldStyles.label, className ) }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t);\n\t}\n);\n", "
|
|
5
|
-
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,YAAY,iBAAiB;AACtC,SAAS,kBAAkB;;;ACF3B,
|
|
4
|
+
"sourcesContent": ["import clsx from 'clsx';\nimport { Fieldset as _Fieldset } from '@base-ui/react/fieldset';\nimport { forwardRef } from '@wordpress/element';\nimport fieldStyles from '../../../utils/css/field.module.css';\nimport type { FieldsetLegendProps } from './types';\n\nexport const FieldsetLegend = forwardRef< HTMLDivElement, FieldsetLegendProps >(\n\tfunction FieldsetLegend( { className, ...restProps }, ref ) {\n\t\treturn (\n\t\t\t<_Fieldset.Legend\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx( fieldStyles.label, className ) }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t);\n\t}\n);\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='04c8f253c6']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"04c8f253c6\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._2d5ad850b2f90964__label{--wp-ui-field-label-line-height:var(--wpds-font-line-height-xs);color:var(--wpds-color-fg-content-neutral);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-xs);font-weight:var(--wpds-font-weight-medium);line-height:var(--wp-ui-field-label-line-height);text-transform:uppercase;&._17c4214649230bea__is-plain{font-size:var(--wpds-font-size-md);text-transform:none}}._08a3750500e0233f__description{color:var(--wpds-color-fg-content-neutral-weak);font-family:var(--wpds-font-family-body);font-size:var(--wpds-font-size-sm);line-height:var(--wpds-font-line-height-xs);margin:0}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"label\":\"_2d5ad850b2f90964__label\",\"is-plain\":\"_17c4214649230bea__is-plain\",\"description\":\"_08a3750500e0233f__description\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,YAAY,iBAAiB;AACtC,SAAS,kBAAkB;;;ACF3B,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,qtBAAqtB,CAAC;AAChwB,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,SAAQ,4BAA2B,YAAW,+BAA8B,eAAc,iCAAgC;;;ADGvI;AAHI,IAAM,iBAAiB;AAAA,EAC7B,SAASA,gBAAgB,EAAE,WAAW,GAAG,UAAU,GAAG,KAAM;AAC3D,WACC;AAAA,MAAC,UAAU;AAAA,MAAV;AAAA,QACA;AAAA,QACA,WAAY,KAAM,cAAY,OAAO,SAAU;AAAA,QAC7C,GAAG;AAAA;AAAA,IACN;AAAA,EAEF;AACD;",
|
|
6
6
|
"names": ["FieldsetLegend"]
|
|
7
7
|
}
|
|
@@ -4,23 +4,13 @@ import { Fieldset as _Fieldset } from "@base-ui/react/fieldset";
|
|
|
4
4
|
import { forwardRef, useState, useMemo } from "@wordpress/element";
|
|
5
5
|
|
|
6
6
|
// packages/ui/src/form/primitives/fieldset/style.module.css
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
flex-direction: column;
|
|
13
|
-
gap: var(--wpds-dimension-gap-2xs);
|
|
14
|
-
border: 0;
|
|
15
|
-
margin: 0;
|
|
16
|
-
padding: 0;
|
|
17
|
-
}
|
|
7
|
+
if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='645ae380ba']")) {
|
|
8
|
+
const style = document.createElement("style");
|
|
9
|
+
style.setAttribute("data-wp-hash", "645ae380ba");
|
|
10
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.a946d12d3d763c87__root{border:0;display:flex;flex-direction:column;gap:var(--wpds-dimension-gap-2xs);margin:0;padding:0}}"));
|
|
11
|
+
document.head.appendChild(style);
|
|
18
12
|
}
|
|
19
|
-
|
|
20
|
-
document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css));
|
|
21
|
-
var style_default = {
|
|
22
|
-
"root": "style-module__root__qUbRL"
|
|
23
|
-
};
|
|
13
|
+
var style_default = { "root": "a946d12d3d763c87__root" };
|
|
24
14
|
|
|
25
15
|
// packages/ui/src/form/primitives/fieldset/root.tsx
|
|
26
16
|
import { FieldsetContext } from "./context.mjs";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/form/primitives/fieldset/root.tsx", "../../../../src/form/primitives/fieldset/style.module.css"],
|
|
4
|
-
"sourcesContent": ["import clsx from 'clsx';\nimport { Fieldset as _Fieldset } from '@base-ui/react/fieldset';\nimport { forwardRef, useState, useMemo } from '@wordpress/element';\nimport styles from './style.module.css';\nimport { FieldsetContext } from './context';\nimport type { FieldsetRootProps } from './types';\n\n/**\n * A low-level component that associates an accessible legend and description with\n * a group of multiple form control elements.\n *\n * To label a single form control element, use the `Field` component instead.\n */\nexport const FieldsetRoot = forwardRef<\n\tHTMLFieldSetElement,\n\tFieldsetRootProps\n>( function FieldsetRoot( { className, children, ...restProps }, ref ) {\n\tconst [ descriptionId, setDescriptionId ] = useState< string >();\n\n\tconst contextValue = useMemo(\n\t\t() => ( {\n\t\t\tregisterDescriptionId: ( id: string ) => setDescriptionId( id ),\n\t\t\tunregisterDescriptionId: () => setDescriptionId( undefined ),\n\t\t} ),\n\t\t[]\n\t);\n\n\treturn (\n\t\t<FieldsetContext.Provider value={ contextValue }>\n\t\t\t<_Fieldset.Root\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx( styles.root, className ) }\n\t\t\t\t// Certain screen readers may not read a fieldset's description\n\t\t\t\t// https://w3c.github.io/using-aria/#label-support\n\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\t{ ...restProps }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</_Fieldset.Root>\n\t\t</FieldsetContext.Provider>\n\t);\n} );\n", "
|
|
5
|
-
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,YAAY,iBAAiB;AACtC,SAAS,YAAY,UAAU,eAAe;;;ACF9C,
|
|
4
|
+
"sourcesContent": ["import clsx from 'clsx';\nimport { Fieldset as _Fieldset } from '@base-ui/react/fieldset';\nimport { forwardRef, useState, useMemo } from '@wordpress/element';\nimport styles from './style.module.css';\nimport { FieldsetContext } from './context';\nimport type { FieldsetRootProps } from './types';\n\n/**\n * A low-level component that associates an accessible legend and description with\n * a group of multiple form control elements.\n *\n * To label a single form control element, use the `Field` component instead.\n */\nexport const FieldsetRoot = forwardRef<\n\tHTMLFieldSetElement,\n\tFieldsetRootProps\n>( function FieldsetRoot( { className, children, ...restProps }, ref ) {\n\tconst [ descriptionId, setDescriptionId ] = useState< string >();\n\n\tconst contextValue = useMemo(\n\t\t() => ( {\n\t\t\tregisterDescriptionId: ( id: string ) => setDescriptionId( id ),\n\t\t\tunregisterDescriptionId: () => setDescriptionId( undefined ),\n\t\t} ),\n\t\t[]\n\t);\n\n\treturn (\n\t\t<FieldsetContext.Provider value={ contextValue }>\n\t\t\t<_Fieldset.Root\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx( styles.root, className ) }\n\t\t\t\t// Certain screen readers may not read a fieldset's description\n\t\t\t\t// https://w3c.github.io/using-aria/#label-support\n\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\t{ ...restProps }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</_Fieldset.Root>\n\t\t</FieldsetContext.Provider>\n\t);\n} );\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='645ae380ba']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"645ae380ba\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{.a946d12d3d763c87__root{border:0;display:flex;flex-direction:column;gap:var(--wpds-dimension-gap-2xs);margin:0;padding:0}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"root\":\"a946d12d3d763c87__root\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,YAAY,iBAAiB;AACtC,SAAS,YAAY,UAAU,eAAe;;;ACF9C,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,kOAAkO,CAAC;AAC7Q,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,QAAO,yBAAwB;;;ADF/C,SAAS,uBAAuB;AAyB7B;AAhBI,IAAM,eAAe,WAGzB,SAASA,cAAc,EAAE,WAAW,UAAU,GAAG,UAAU,GAAG,KAAM;AACtE,QAAM,CAAE,eAAe,gBAAiB,IAAI,SAAmB;AAE/D,QAAM,eAAe;AAAA,IACpB,OAAQ;AAAA,MACP,uBAAuB,CAAE,OAAgB,iBAAkB,EAAG;AAAA,MAC9D,yBAAyB,MAAM,iBAAkB,MAAU;AAAA,IAC5D;AAAA,IACA,CAAC;AAAA,EACF;AAEA,SACC,oBAAC,gBAAgB,UAAhB,EAAyB,OAAQ,cACjC;AAAA,IAAC,UAAU;AAAA,IAAV;AAAA,MACA;AAAA,MACA,WAAY,KAAM,cAAO,MAAM,SAAU;AAAA,MAGzC,oBAAmB;AAAA,MACjB,GAAG;AAAA,MAEH;AAAA;AAAA,EACH,GACD;AAEF,CAAE;",
|
|
6
6
|
"names": ["FieldsetRoot"]
|
|
7
7
|
}
|
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
// packages/ui/src/form/primitives/index.ts
|
|
2
2
|
import * as Field from "./field/index.mjs";
|
|
3
3
|
import * as Fieldset from "./fieldset/index.mjs";
|
|
4
|
+
import { Input } from "./input/index.mjs";
|
|
4
5
|
import { InputLayout } from "./input-layout/index.mjs";
|
|
6
|
+
import * as Select from "./select/index.mjs";
|
|
5
7
|
export {
|
|
6
8
|
Field,
|
|
7
9
|
Fieldset,
|
|
8
|
-
|
|
10
|
+
Input,
|
|
11
|
+
InputLayout,
|
|
12
|
+
Select
|
|
9
13
|
};
|
|
10
14
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/form/primitives/index.ts"],
|
|
4
|
-
"sourcesContent": ["export * as Field from './field';\nexport * as Fieldset from './fieldset';\nexport { InputLayout } from './input-layout';\n"],
|
|
5
|
-
"mappings": ";AAAA,YAAY,WAAW;AACvB,YAAY,cAAc;AAC1B,SAAS,mBAAmB;",
|
|
4
|
+
"sourcesContent": ["export * as Field from './field';\nexport * as Fieldset from './fieldset';\nexport { Input } from './input';\nexport { InputLayout } from './input-layout';\nexport * as Select from './select';\n"],
|
|
5
|
+
"mappings": ";AAAA,YAAY,WAAW;AACvB,YAAY,cAAc;AAC1B,SAAS,aAAa;AACtB,SAAS,mBAAmB;AAC5B,YAAY,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
// packages/ui/src/form/primitives/input/input.tsx
|
|
2
|
+
import { Input as _Input } from "@base-ui/react/input";
|
|
3
|
+
import clsx from "clsx";
|
|
4
|
+
import { forwardRef } from "@wordpress/element";
|
|
5
|
+
|
|
6
|
+
// packages/ui/src/utils/css/focus.module.css
|
|
7
|
+
if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='28ad59e2e3']")) {
|
|
8
|
+
const style = document.createElement("style");
|
|
9
|
+
style.setAttribute("data-wp-hash", "28ad59e2e3");
|
|
10
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._08e8a2e44959f892__outset-ring--focus,._970d04df7376df67__outset-ring--focus-within-except-active,.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible,.cd83dfc2126a0846__outset-ring--focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active{@media not (prefers-reduced-motion){transition:outline .1s ease-out}outline-color:#0000;outline-offset:1px;outline-style:solid;outline-width:0}._08e8a2e44959f892__outset-ring--focus:focus,._970d04df7376df67__outset-ring--focus-within-except-active:focus-within:not(:has(:active)),.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible:focus-within:has(:focus-visible),.cd83dfc2126a0846__outset-ring--focus-within:focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible:focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active:focus:not(:active){outline-color:var(--wpds-color-stroke-focus-brand);outline-width:var(--wpds-border-width-focus)}}"));
|
|
11
|
+
document.head.appendChild(style);
|
|
12
|
+
}
|
|
13
|
+
var focus_default = { "outset-ring--focus": "_08e8a2e44959f892__outset-ring--focus", "outset-ring--focus-except-active": "e25b2bdd7aa21721__outset-ring--focus-except-active", "outset-ring--focus-visible": "d0541bc9dd9dc7b6__outset-ring--focus-visible", "outset-ring--focus-within": "cd83dfc2126a0846__outset-ring--focus-within", "outset-ring--focus-within-except-active": "_970d04df7376df67__outset-ring--focus-within-except-active", "outset-ring--focus-within-visible": "c5cb3ee4bddaa8e4__outset-ring--focus-within-visible" };
|
|
14
|
+
|
|
15
|
+
// packages/ui/src/form/primitives/input/style.module.css
|
|
16
|
+
if (typeof document !== "undefined" && !document.head.querySelector("style[data-wp-hash='03d76ef49c']")) {
|
|
17
|
+
const style = document.createElement("style");
|
|
18
|
+
style.setAttribute("data-wp-hash", "03d76ef49c");
|
|
19
|
+
style.appendChild(document.createTextNode("@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._2ae7be2fc1bb17a3__input{background:#0000;border:none;color:var(--wpds-color-fg-interactive-neutral);font-family:inherit;font-size:inherit;line-height:inherit;outline:none;padding-block:var(--wp-ui-input-padding-block,0);padding-inline:var(--wp-ui-input-layout-padding-inline,0);width:100%;&::placeholder{color:var(--wpds-color-fg-interactive-neutral-disabled)}&:disabled,&[aria-disabled=true]{color:var(--wpds-color-fg-interactive-neutral-disabled);@media (forced-colors:active){color:GrayText}}&[type=email],&[type=url]{direction:ltr}}}"));
|
|
20
|
+
document.head.appendChild(style);
|
|
21
|
+
}
|
|
22
|
+
var style_default = { "input": "_2ae7be2fc1bb17a3__input" };
|
|
23
|
+
|
|
24
|
+
// packages/ui/src/form/primitives/input/input.tsx
|
|
25
|
+
import { InputLayout } from "../input-layout/index.mjs";
|
|
26
|
+
import { jsx } from "react/jsx-runtime";
|
|
27
|
+
var Input = forwardRef(function Input2({ className, size = "default", prefix, suffix, style, ...restProps }, ref) {
|
|
28
|
+
return /* @__PURE__ */ jsx(
|
|
29
|
+
InputLayout,
|
|
30
|
+
{
|
|
31
|
+
className: clsx(
|
|
32
|
+
focus_default["outset-ring--focus-within"],
|
|
33
|
+
className
|
|
34
|
+
),
|
|
35
|
+
style,
|
|
36
|
+
size,
|
|
37
|
+
visuallyDisabled: restProps.disabled,
|
|
38
|
+
prefix,
|
|
39
|
+
suffix,
|
|
40
|
+
children: /* @__PURE__ */ jsx(_Input, { ref, className: style_default.input, ...restProps })
|
|
41
|
+
}
|
|
42
|
+
);
|
|
43
|
+
});
|
|
44
|
+
export {
|
|
45
|
+
Input
|
|
46
|
+
};
|
|
47
|
+
//# sourceMappingURL=input.mjs.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/form/primitives/input/input.tsx", "../../../../src/utils/css/focus.module.css", "../../../../src/form/primitives/input/style.module.css"],
|
|
4
|
+
"sourcesContent": ["import { Input as _Input } from '@base-ui/react/input';\nimport clsx from 'clsx';\nimport { forwardRef } from '@wordpress/element';\nimport focusStyles from '../../../utils/css/focus.module.css';\nimport styles from './style.module.css';\nimport type { InputProps } from './types';\nimport { InputLayout } from '../input-layout';\n\nexport const Input = forwardRef< HTMLInputElement, InputProps >( function Input(\n\t{ className, size = 'default', prefix, suffix, style, ...restProps },\n\tref\n) {\n\treturn (\n\t\t<InputLayout\n\t\t\tclassName={ clsx(\n\t\t\t\tfocusStyles[ 'outset-ring--focus-within' ],\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tstyle={ style }\n\t\t\tsize={ size }\n\t\t\tvisuallyDisabled={ restProps.disabled }\n\t\t\tprefix={ prefix }\n\t\t\tsuffix={ suffix }\n\t\t>\n\t\t\t<_Input ref={ ref } className={ styles.input } { ...restProps } />\n\t\t</InputLayout>\n\t);\n} );\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='28ad59e2e3']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"28ad59e2e3\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-utilities{._08e8a2e44959f892__outset-ring--focus,._970d04df7376df67__outset-ring--focus-within-except-active,.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible,.cd83dfc2126a0846__outset-ring--focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active{@media not (prefers-reduced-motion){transition:outline .1s ease-out}outline-color:#0000;outline-offset:1px;outline-style:solid;outline-width:0}._08e8a2e44959f892__outset-ring--focus:focus,._970d04df7376df67__outset-ring--focus-within-except-active:focus-within:not(:has(:active)),.c5cb3ee4bddaa8e4__outset-ring--focus-within-visible:focus-within:has(:focus-visible),.cd83dfc2126a0846__outset-ring--focus-within:focus-within,.d0541bc9dd9dc7b6__outset-ring--focus-visible:focus-visible,.e25b2bdd7aa21721__outset-ring--focus-except-active:focus:not(:active){outline-color:var(--wpds-color-stroke-focus-brand);outline-width:var(--wpds-border-width-focus)}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"outset-ring--focus\":\"_08e8a2e44959f892__outset-ring--focus\",\"outset-ring--focus-except-active\":\"e25b2bdd7aa21721__outset-ring--focus-except-active\",\"outset-ring--focus-visible\":\"d0541bc9dd9dc7b6__outset-ring--focus-visible\",\"outset-ring--focus-within\":\"cd83dfc2126a0846__outset-ring--focus-within\",\"outset-ring--focus-within-except-active\":\"_970d04df7376df67__outset-ring--focus-within-except-active\",\"outset-ring--focus-within-visible\":\"c5cb3ee4bddaa8e4__outset-ring--focus-within-visible\"};\n", "if (typeof document !== 'undefined' && !document.head.querySelector(\"style[data-wp-hash='03d76ef49c']\")) {\n\tconst style = document.createElement(\"style\");\n\tstyle.setAttribute(\"data-wp-hash\", \"03d76ef49c\");\n\tstyle.appendChild(document.createTextNode(\"@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;@layer wp-ui-components{._2ae7be2fc1bb17a3__input{background:#0000;border:none;color:var(--wpds-color-fg-interactive-neutral);font-family:inherit;font-size:inherit;line-height:inherit;outline:none;padding-block:var(--wp-ui-input-padding-block,0);padding-inline:var(--wp-ui-input-layout-padding-inline,0);width:100%;&::placeholder{color:var(--wpds-color-fg-interactive-neutral-disabled)}&:disabled,&[aria-disabled=true]{color:var(--wpds-color-fg-interactive-neutral-disabled);@media (forced-colors:active){color:GrayText}}&[type=email],&[type=url]{direction:ltr}}}\"));\n\tdocument.head.appendChild(style);\n}\nexport default {\"input\":\"_2ae7be2fc1bb17a3__input\"};\n"],
|
|
5
|
+
"mappings": ";AAAA,SAAS,SAAS,cAAc;AAChC,OAAO,UAAU;AACjB,SAAS,kBAAkB;;;ACF3B,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,0hCAA0hC,CAAC;AACrkC,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,sBAAqB,yCAAwC,oCAAmC,sDAAqD,8BAA6B,gDAA+C,6BAA4B,+CAA8C,2CAA0C,8DAA6D,qCAAoC,sDAAqD;;;ACN3f,IAAI,OAAO,aAAa,eAAe,CAAC,SAAS,KAAK,cAAc,kCAAkC,GAAG;AACxG,QAAM,QAAQ,SAAS,cAAc,OAAO;AAC5C,QAAM,aAAa,gBAAgB,YAAY;AAC/C,QAAM,YAAY,SAAS,eAAe,moBAAmoB,CAAC;AAC9qB,WAAS,KAAK,YAAY,KAAK;AAChC;AACA,IAAO,gBAAQ,EAAC,SAAQ,2BAA0B;;;AFAlD,SAAS,mBAAmB;AAkBzB;AAhBI,IAAM,QAAQ,WAA4C,SAASA,OACzE,EAAE,WAAW,OAAO,WAAW,QAAQ,QAAQ,OAAO,GAAG,UAAU,GACnE,KACC;AACD,SACC;AAAA,IAAC;AAAA;AAAA,MACA,WAAY;AAAA,QACX,cAAa,2BAA4B;AAAA,QACzC;AAAA,MACD;AAAA,MACA;AAAA,MACA;AAAA,MACA,kBAAmB,UAAU;AAAA,MAC7B;AAAA,MACA;AAAA,MAEA,8BAAC,UAAO,KAAY,WAAY,cAAO,OAAU,GAAG,WAAY;AAAA;AAAA,EACjE;AAEF,CAAE;",
|
|
6
|
+
"names": ["Input"]
|
|
7
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=types.mjs.map
|