@yahoo/uds 3.175.6 → 3.175.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/automated-config/dist/utils/getConfigVariantProperties.d.cts +2 -2
- package/dist/automated-config/dist/utils/getConfigVariantProperties.d.ts +2 -2
- package/dist/components/client/Input/Input.cjs +1 -2
- package/dist/components/client/Input/Input.js +1 -2
- package/dist/components/client/Select/SelectTrigger.cjs +1 -2
- package/dist/components/client/Select/SelectTrigger.js +1 -2
- package/dist/hooks/usePointerFocusTracker.cjs +35 -11
- package/dist/hooks/usePointerFocusTracker.d.cts +0 -1
- package/dist/hooks/usePointerFocusTracker.d.ts +0 -1
- package/dist/hooks/usePointerFocusTracker.js +36 -12
- package/dist/tailwind-internal/dist/utils/getShadowStyles.d.cts +2 -2
- package/dist/tailwind-internal/dist/utils/getShadowStyles.d.ts +2 -2
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/README.md +4 -2
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/container.d.ts +16 -20
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/declaration.d.ts +2 -2
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/lazy-result.js +23 -2
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/list.js +5 -2
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/map-generator.js +3 -2
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/node.d.ts +2 -2
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/parser.js +4 -1
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/postcss.js +1 -1
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/previous-map.js +18 -12
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/processor.js +1 -1
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/root.js +16 -1
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/stringifier.js +37 -7
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/lib/warning.js +10 -0
- package/dist/tailwind-internal/dist/vendor/node_modules/postcss/package.json +2 -2
- package/dist/uds/generated/componentData.cjs +2508 -2508
- package/dist/uds/generated/componentData.js +2508 -2508
- package/dist/uds/generated/tailwindPurge.cjs +6 -6
- package/dist/uds/generated/tailwindPurge.js +6 -6
- package/dist/uds/package.cjs +2 -2
- package/dist/uds/package.js +2 -2
- package/generated/componentData.json +3248 -3248
- package/generated/tailwindPurge.ts +1 -1
- package/package.json +3 -3
|
@@ -10,8 +10,8 @@ import { VariantConfig } from "../types/ComponentConfig.cjs";
|
|
|
10
10
|
* @returns A Record of layer names to their properties, or null if no properties are found
|
|
11
11
|
*/
|
|
12
12
|
declare function getConfigVariantProperties(variant?: VariantConfig): {
|
|
13
|
-
[x: string]: Readonly<Record<string, SelectedConfigurableProperty<"
|
|
14
|
-
root: Readonly<Record<string, SelectedConfigurableProperty<"
|
|
13
|
+
[x: string]: Readonly<Record<string, SelectedConfigurableProperty<"color" | "iconSize" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "opacity" | "fillOpacity" | "fontWeight" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar" | "controlHeight", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
|
|
14
|
+
root: Readonly<Record<string, SelectedConfigurableProperty<"color" | "iconSize" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "opacity" | "fillOpacity" | "fontWeight" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar" | "controlHeight", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
|
|
15
15
|
} | null;
|
|
16
16
|
//#endregion
|
|
17
17
|
export { getConfigVariantProperties };
|
|
@@ -10,8 +10,8 @@ import { VariantConfig } from "../types/ComponentConfig.js";
|
|
|
10
10
|
* @returns A Record of layer names to their properties, or null if no properties are found
|
|
11
11
|
*/
|
|
12
12
|
declare function getConfigVariantProperties(variant?: VariantConfig): {
|
|
13
|
-
[x: string]: Readonly<Record<string, SelectedConfigurableProperty<"
|
|
14
|
-
root: Readonly<Record<string, SelectedConfigurableProperty<"
|
|
13
|
+
[x: string]: Readonly<Record<string, SelectedConfigurableProperty<"color" | "iconSize" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "opacity" | "fillOpacity" | "fontWeight" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar" | "controlHeight", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
|
|
14
|
+
root: Readonly<Record<string, SelectedConfigurableProperty<"color" | "iconSize" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "opacity" | "fillOpacity" | "fontWeight" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "spacingTop" | "spacingBottom" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "bannerInnerShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity" | "paginationWidthVar" | "controlHeight", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "bannerInnerShadowOptions"[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
|
|
15
15
|
} | null;
|
|
16
16
|
//#endregion
|
|
17
17
|
export { getConfigVariantProperties };
|
|
@@ -94,7 +94,7 @@ const Input = (0, react.forwardRef)(function Input({ id, label, type = "text", s
|
|
|
94
94
|
const uid = id ?? `uds-input-${generatedId}`;
|
|
95
95
|
const helpTextId = `uds-input-${uid}-help-text`;
|
|
96
96
|
const { startIconSize, endIconSize } = require_components_client_Input_UDSInputConfigProvider.useInputConfig(size);
|
|
97
|
-
const { isPointerFocus,
|
|
97
|
+
const { isPointerFocus, onFocusChange } = require_hooks_usePointerFocusTracker.usePointerFocusTracker();
|
|
98
98
|
const { className: inputClassName, ...inputProps } = slotProps?.input ?? {};
|
|
99
99
|
const { className: inputWrapperClassName, ...inputWrapperProps } = slotProps?.inputWrapper ?? {};
|
|
100
100
|
const ref = (0, react.useRef)(null);
|
|
@@ -207,7 +207,6 @@ const Input = (0, react.forwardRef)(function Input({ id, label, type = "text", s
|
|
|
207
207
|
alignItems: "center",
|
|
208
208
|
style: { minWidth: `${minWidth}px` },
|
|
209
209
|
...inputWrapperProps,
|
|
210
|
-
onPointerDown,
|
|
211
210
|
className: classNames.inputWrapper,
|
|
212
211
|
children: [
|
|
213
212
|
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StartIcon, {
|
|
@@ -91,7 +91,7 @@ const Input = forwardRef(function Input({ id, label, type = "text", size = "md",
|
|
|
91
91
|
const uid = id ?? `uds-input-${generatedId}`;
|
|
92
92
|
const helpTextId = `uds-input-${uid}-help-text`;
|
|
93
93
|
const { startIconSize, endIconSize } = useInputConfig(size);
|
|
94
|
-
const { isPointerFocus,
|
|
94
|
+
const { isPointerFocus, onFocusChange } = usePointerFocusTracker();
|
|
95
95
|
const { className: inputClassName, ...inputProps } = slotProps?.input ?? {};
|
|
96
96
|
const { className: inputWrapperClassName, ...inputWrapperProps } = slotProps?.inputWrapper ?? {};
|
|
97
97
|
const ref = useRef(null);
|
|
@@ -204,7 +204,6 @@ const Input = forwardRef(function Input({ id, label, type = "text", size = "md",
|
|
|
204
204
|
alignItems: "center",
|
|
205
205
|
style: { minWidth: `${minWidth}px` },
|
|
206
206
|
...inputWrapperProps,
|
|
207
|
-
onPointerDown,
|
|
208
207
|
className: classNames.inputWrapper,
|
|
209
208
|
children: [
|
|
210
209
|
/* @__PURE__ */ jsx(StartIcon, {
|
|
@@ -42,7 +42,7 @@ const EndIcon = (0, react.memo)(function EndIcon({ icon, className, iconProps })
|
|
|
42
42
|
EndIcon.displayName = "EndIcon";
|
|
43
43
|
const SelectTrigger = (0, react.forwardRef)(function SelectTrigger({ placeholder, startIcon, endIcon, slotProps, className, disabled: disabledProp, name, onClick: triggerPassthroughOnClick, onPointerDown: triggerPassthroughOnPointerDown, ...triggerPassthroughProps }, ref) {
|
|
44
44
|
const { size, disabled, readOnly, required, hasError, uid, helpTextId, reduceMotion, minWidth, triggerWrapperRef } = require_components_client_Select_selectContext.useSelectFieldContext();
|
|
45
|
-
const { isPointerFocus,
|
|
45
|
+
const { isPointerFocus, onFocusChange } = require_hooks_usePointerFocusTracker.usePointerFocusTracker();
|
|
46
46
|
const select = (0, _ariakit_react.useSelectContext)();
|
|
47
47
|
const value = (0, _ariakit_react.useStoreState)(select, "value");
|
|
48
48
|
const open = (0, _ariakit_react.useStoreState)(select, "open");
|
|
@@ -52,7 +52,6 @@ const SelectTrigger = (0, react.forwardRef)(function SelectTrigger({ placeholder
|
|
|
52
52
|
const { className: triggerWrapperClassName, ...triggerWrapperProps } = slotProps?.triggerWrapper ?? {};
|
|
53
53
|
const { className: triggerClassName, onClick, ...triggerProps } = slotProps?.trigger ?? {};
|
|
54
54
|
const handlePointerDown = (event) => {
|
|
55
|
-
onPointerDownFocusTracker();
|
|
56
55
|
if (readOnly) {
|
|
57
56
|
event.preventDefault();
|
|
58
57
|
event.stopPropagation();
|
|
@@ -41,7 +41,7 @@ const EndIcon = memo(function EndIcon({ icon, className, iconProps }) {
|
|
|
41
41
|
EndIcon.displayName = "EndIcon";
|
|
42
42
|
const SelectTrigger = forwardRef(function SelectTrigger({ placeholder, startIcon, endIcon, slotProps, className, disabled: disabledProp, name, onClick: triggerPassthroughOnClick, onPointerDown: triggerPassthroughOnPointerDown, ...triggerPassthroughProps }, ref) {
|
|
43
43
|
const { size, disabled, readOnly, required, hasError, uid, helpTextId, reduceMotion, minWidth, triggerWrapperRef } = useSelectFieldContext();
|
|
44
|
-
const { isPointerFocus,
|
|
44
|
+
const { isPointerFocus, onFocusChange } = usePointerFocusTracker();
|
|
45
45
|
const select = useSelectContext();
|
|
46
46
|
const value = useStoreState(select, "value");
|
|
47
47
|
const open = useStoreState(select, "open");
|
|
@@ -51,7 +51,6 @@ const SelectTrigger = forwardRef(function SelectTrigger({ placeholder, startIcon
|
|
|
51
51
|
const { className: triggerWrapperClassName, ...triggerWrapperProps } = slotProps?.triggerWrapper ?? {};
|
|
52
52
|
const { className: triggerClassName, onClick, ...triggerProps } = slotProps?.trigger ?? {};
|
|
53
53
|
const handlePointerDown = (event) => {
|
|
54
|
-
onPointerDownFocusTracker();
|
|
55
54
|
if (readOnly) {
|
|
56
55
|
event.preventDefault();
|
|
57
56
|
event.stopPropagation();
|
|
@@ -2,22 +2,46 @@
|
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
let react = require("react");
|
|
4
4
|
//#region src/hooks/usePointerFocusTracker.ts
|
|
5
|
+
/**
|
|
6
|
+
* The most recent way the user interacted with the page, shared by every field on it. Focus that
|
|
7
|
+
* follows a pointer press hides the ring; focus that follows a key press, or arrives before any
|
|
8
|
+
* interaction, shows it. This is the `:focus-visible` heuristic browsers apply to buttons. Text
|
|
9
|
+
* inputs are exempt from it (one always matches `:focus-visible`), so without this the ring and the
|
|
10
|
+
* border would both paint on every click.
|
|
11
|
+
*
|
|
12
|
+
* Listening on the document rather than the field is what covers a click on the field's label and a
|
|
13
|
+
* `focus()` call: neither delivers a pointerdown to the field itself.
|
|
14
|
+
*/
|
|
15
|
+
let modality = "keyboard";
|
|
16
|
+
let subscribers = 0;
|
|
17
|
+
function handlePointerDown() {
|
|
18
|
+
modality = "pointer";
|
|
19
|
+
}
|
|
20
|
+
function handleKeyDown(event) {
|
|
21
|
+
if (event.metaKey || event.ctrlKey || event.altKey) return;
|
|
22
|
+
modality = "keyboard";
|
|
23
|
+
}
|
|
24
|
+
function subscribe() {
|
|
25
|
+
if (subscribers === 0) {
|
|
26
|
+
document.addEventListener("pointerdown", handlePointerDown, true);
|
|
27
|
+
document.addEventListener("keydown", handleKeyDown, true);
|
|
28
|
+
}
|
|
29
|
+
subscribers += 1;
|
|
30
|
+
return () => {
|
|
31
|
+
subscribers -= 1;
|
|
32
|
+
if (subscribers === 0) {
|
|
33
|
+
document.removeEventListener("pointerdown", handlePointerDown, true);
|
|
34
|
+
document.removeEventListener("keydown", handleKeyDown, true);
|
|
35
|
+
}
|
|
36
|
+
};
|
|
37
|
+
}
|
|
5
38
|
function usePointerFocusTracker() {
|
|
6
39
|
const [isPointerFocus, setIsPointerFocus] = (0, react.useState)(false);
|
|
7
|
-
|
|
40
|
+
(0, react.useEffect)(subscribe, []);
|
|
8
41
|
return {
|
|
9
42
|
isPointerFocus,
|
|
10
|
-
onPointerDown: (0, react.useCallback)(() => {
|
|
11
|
-
pointerDownRef.current = true;
|
|
12
|
-
}, []),
|
|
13
43
|
onFocusChange: (0, react.useCallback)((focused) => {
|
|
14
|
-
|
|
15
|
-
setIsPointerFocus(pointerDownRef.current);
|
|
16
|
-
pointerDownRef.current = false;
|
|
17
|
-
} else {
|
|
18
|
-
setIsPointerFocus(false);
|
|
19
|
-
pointerDownRef.current = false;
|
|
20
|
-
}
|
|
44
|
+
setIsPointerFocus(focused && modality === "pointer");
|
|
21
45
|
}, [])
|
|
22
46
|
};
|
|
23
47
|
}
|
|
@@ -1,22 +1,46 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
-
import { useCallback,
|
|
2
|
+
import { useCallback, useEffect, useState } from "react";
|
|
3
3
|
//#region src/hooks/usePointerFocusTracker.ts
|
|
4
|
+
/**
|
|
5
|
+
* The most recent way the user interacted with the page, shared by every field on it. Focus that
|
|
6
|
+
* follows a pointer press hides the ring; focus that follows a key press, or arrives before any
|
|
7
|
+
* interaction, shows it. This is the `:focus-visible` heuristic browsers apply to buttons. Text
|
|
8
|
+
* inputs are exempt from it (one always matches `:focus-visible`), so without this the ring and the
|
|
9
|
+
* border would both paint on every click.
|
|
10
|
+
*
|
|
11
|
+
* Listening on the document rather than the field is what covers a click on the field's label and a
|
|
12
|
+
* `focus()` call: neither delivers a pointerdown to the field itself.
|
|
13
|
+
*/
|
|
14
|
+
let modality = "keyboard";
|
|
15
|
+
let subscribers = 0;
|
|
16
|
+
function handlePointerDown() {
|
|
17
|
+
modality = "pointer";
|
|
18
|
+
}
|
|
19
|
+
function handleKeyDown(event) {
|
|
20
|
+
if (event.metaKey || event.ctrlKey || event.altKey) return;
|
|
21
|
+
modality = "keyboard";
|
|
22
|
+
}
|
|
23
|
+
function subscribe() {
|
|
24
|
+
if (subscribers === 0) {
|
|
25
|
+
document.addEventListener("pointerdown", handlePointerDown, true);
|
|
26
|
+
document.addEventListener("keydown", handleKeyDown, true);
|
|
27
|
+
}
|
|
28
|
+
subscribers += 1;
|
|
29
|
+
return () => {
|
|
30
|
+
subscribers -= 1;
|
|
31
|
+
if (subscribers === 0) {
|
|
32
|
+
document.removeEventListener("pointerdown", handlePointerDown, true);
|
|
33
|
+
document.removeEventListener("keydown", handleKeyDown, true);
|
|
34
|
+
}
|
|
35
|
+
};
|
|
36
|
+
}
|
|
4
37
|
function usePointerFocusTracker() {
|
|
5
38
|
const [isPointerFocus, setIsPointerFocus] = useState(false);
|
|
6
|
-
|
|
39
|
+
useEffect(subscribe, []);
|
|
7
40
|
return {
|
|
8
41
|
isPointerFocus,
|
|
9
|
-
onPointerDown: useCallback(() => {
|
|
10
|
-
pointerDownRef.current = true;
|
|
11
|
-
}, []),
|
|
12
42
|
onFocusChange: useCallback((focused) => {
|
|
13
|
-
|
|
14
|
-
setIsPointerFocus(pointerDownRef.current);
|
|
15
|
-
pointerDownRef.current = false;
|
|
16
|
-
} else {
|
|
17
|
-
setIsPointerFocus(false);
|
|
18
|
-
pointerDownRef.current = false;
|
|
19
|
-
}
|
|
43
|
+
setIsPointerFocus(focused && modality === "pointer");
|
|
20
44
|
}, [])
|
|
21
45
|
};
|
|
22
46
|
}
|
|
@@ -6,8 +6,8 @@ import { UniversalTokensConfig } from "../packages/config/dist/index.cjs";
|
|
|
6
6
|
declare function getShadowStyles({ config, shadowType }: {
|
|
7
7
|
config: UniversalTokensConfig;
|
|
8
8
|
shadowType: ShadowType;
|
|
9
|
-
}): Record<".uds-inset-shadow-
|
|
10
|
-
readonly [x: string]: "var(--uds-inset-shadow-
|
|
9
|
+
}): Record<".uds-inset-shadow-sm" | ".uds-inset-shadow-md" | ".uds-inset-shadow-lg" | ".uds-inset-shadow-xl" | ".uds-inset-shadow-2xl" | ".uds-inset-shadow-none" | ".uds-inset-shadow-xs" | ".uds-inset-shadow-elevation-0" | ".uds-inset-shadow-elevation-1" | ".uds-inset-shadow-elevation-2" | ".uds-inset-shadow-elevation-3" | ".uds-inset-shadow-elevation-4" | ".uds-inset-shadow-elevation-5" | ".uds-drop-shadow-sm" | ".uds-drop-shadow-md" | ".uds-drop-shadow-lg" | ".uds-drop-shadow-xl" | ".uds-drop-shadow-2xl" | ".uds-drop-shadow-none" | ".uds-drop-shadow-xs" | ".uds-drop-shadow-elevation-0" | ".uds-drop-shadow-elevation-1" | ".uds-drop-shadow-elevation-2" | ".uds-drop-shadow-elevation-3" | ".uds-drop-shadow-elevation-4" | ".uds-drop-shadow-elevation-5", {
|
|
10
|
+
readonly [x: string]: "var(--uds-inset-shadow-sm)" | "var(--uds-inset-shadow-md)" | "var(--uds-inset-shadow-lg)" | "var(--uds-inset-shadow-xl)" | "var(--uds-inset-shadow-2xl)" | "var(--uds-inset-shadow-none)" | "var(--uds-inset-shadow-xs)" | "var(--uds-inset-shadow-elevation-0)" | "var(--uds-inset-shadow-elevation-1)" | "var(--uds-inset-shadow-elevation-2)" | "var(--uds-inset-shadow-elevation-3)" | "var(--uds-inset-shadow-elevation-4)" | "var(--uds-inset-shadow-elevation-5)" | "var(--uds-drop-shadow-sm)" | "var(--uds-drop-shadow-md)" | "var(--uds-drop-shadow-lg)" | "var(--uds-drop-shadow-xl)" | "var(--uds-drop-shadow-2xl)" | "var(--uds-drop-shadow-none)" | "var(--uds-drop-shadow-xs)" | "var(--uds-drop-shadow-elevation-0)" | "var(--uds-drop-shadow-elevation-1)" | "var(--uds-drop-shadow-elevation-2)" | "var(--uds-drop-shadow-elevation-3)" | "var(--uds-drop-shadow-elevation-4)" | "var(--uds-drop-shadow-elevation-5)" | "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
|
|
11
11
|
readonly boxShadow: "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
|
|
12
12
|
}>;
|
|
13
13
|
//#endregion
|
|
@@ -6,8 +6,8 @@ import { UniversalTokensConfig } from "../packages/config/dist/index.js";
|
|
|
6
6
|
declare function getShadowStyles({ config, shadowType }: {
|
|
7
7
|
config: UniversalTokensConfig;
|
|
8
8
|
shadowType: ShadowType;
|
|
9
|
-
}): Record<".uds-inset-shadow-
|
|
10
|
-
readonly [x: string]: "var(--uds-inset-shadow-
|
|
9
|
+
}): Record<".uds-inset-shadow-sm" | ".uds-inset-shadow-md" | ".uds-inset-shadow-lg" | ".uds-inset-shadow-xl" | ".uds-inset-shadow-2xl" | ".uds-inset-shadow-none" | ".uds-inset-shadow-xs" | ".uds-inset-shadow-elevation-0" | ".uds-inset-shadow-elevation-1" | ".uds-inset-shadow-elevation-2" | ".uds-inset-shadow-elevation-3" | ".uds-inset-shadow-elevation-4" | ".uds-inset-shadow-elevation-5" | ".uds-drop-shadow-sm" | ".uds-drop-shadow-md" | ".uds-drop-shadow-lg" | ".uds-drop-shadow-xl" | ".uds-drop-shadow-2xl" | ".uds-drop-shadow-none" | ".uds-drop-shadow-xs" | ".uds-drop-shadow-elevation-0" | ".uds-drop-shadow-elevation-1" | ".uds-drop-shadow-elevation-2" | ".uds-drop-shadow-elevation-3" | ".uds-drop-shadow-elevation-4" | ".uds-drop-shadow-elevation-5", {
|
|
10
|
+
readonly [x: string]: "var(--uds-inset-shadow-sm)" | "var(--uds-inset-shadow-md)" | "var(--uds-inset-shadow-lg)" | "var(--uds-inset-shadow-xl)" | "var(--uds-inset-shadow-2xl)" | "var(--uds-inset-shadow-none)" | "var(--uds-inset-shadow-xs)" | "var(--uds-inset-shadow-elevation-0)" | "var(--uds-inset-shadow-elevation-1)" | "var(--uds-inset-shadow-elevation-2)" | "var(--uds-inset-shadow-elevation-3)" | "var(--uds-inset-shadow-elevation-4)" | "var(--uds-inset-shadow-elevation-5)" | "var(--uds-drop-shadow-sm)" | "var(--uds-drop-shadow-md)" | "var(--uds-drop-shadow-lg)" | "var(--uds-drop-shadow-xl)" | "var(--uds-drop-shadow-2xl)" | "var(--uds-drop-shadow-none)" | "var(--uds-drop-shadow-xs)" | "var(--uds-drop-shadow-elevation-0)" | "var(--uds-drop-shadow-elevation-1)" | "var(--uds-drop-shadow-elevation-2)" | "var(--uds-drop-shadow-elevation-3)" | "var(--uds-drop-shadow-elevation-4)" | "var(--uds-drop-shadow-elevation-5)" | "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
|
|
11
11
|
readonly boxShadow: "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
|
|
12
12
|
}>;
|
|
13
13
|
//#endregion
|
|
@@ -13,8 +13,7 @@ and JetBrains. The [Autoprefixer] and [Stylelint] PostCSS plugins are some o
|
|
|
13
13
|
|
|
14
14
|
---
|
|
15
15
|
|
|
16
|
-
<img src="https://cdn.evilmartians.com/badges/logo-no-label.svg" alt="" width="22" height="16" />
|
|
17
|
-
<b><a href="https://evilmartians.com/devtools?utm_source=postcss&utm_campaign=devtools-button&utm_medium=github">Evil Martians</a></b>, go-to agency for <b>developer tools</b>.
|
|
16
|
+
<img src="https://cdn.evilmartians.com/badges/logo-no-label.svg" alt="" width="22" height="16" /> PostCSS is built by <b><a href="https://evilmartians.com/">Evil Martians</a></b>, an American design and engineering consultancy for <b>developer tools, AI, and cybersecurity startups</b>.
|
|
18
17
|
|
|
19
18
|
---
|
|
20
19
|
|
|
@@ -23,3 +22,6 @@ and JetBrains. The [Autoprefixer] and [Stylelint] PostCSS plugins are some o
|
|
|
23
22
|
[Autoprefixer]: https://github.com/postcss/autoprefixer
|
|
24
23
|
[Stylelint]: https://stylelint.io/
|
|
25
24
|
[plugins]: https://github.com/postcss/postcss#plugins
|
|
25
|
+
|
|
26
|
+
## Docs
|
|
27
|
+
Read full docs **[here](https://postcss.org/)**.
|
|
@@ -178,23 +178,6 @@ declare abstract class Container_<Child extends Node = ChildNode> extends Node {
|
|
|
178
178
|
*/
|
|
179
179
|
insertAfter(oldNode: Child | number, newNode: Container.NewChild): this
|
|
180
180
|
|
|
181
|
-
/**
|
|
182
|
-
* Traverses the container’s descendant nodes, calling callback
|
|
183
|
-
* for each comment node.
|
|
184
|
-
*
|
|
185
|
-
* Like `Container#each`, this method is safe
|
|
186
|
-
* to use if you are mutating arrays during iteration.
|
|
187
|
-
*
|
|
188
|
-
* ```js
|
|
189
|
-
* root.walkComments(comment => {
|
|
190
|
-
* comment.remove()
|
|
191
|
-
* })
|
|
192
|
-
* ```
|
|
193
|
-
*
|
|
194
|
-
* @param callback Iterator receives each node and index.
|
|
195
|
-
* @return Returns `false` if iteration was broke.
|
|
196
|
-
*/
|
|
197
|
-
|
|
198
181
|
/**
|
|
199
182
|
* Insert new node before old node within the container.
|
|
200
183
|
*
|
|
@@ -378,9 +361,22 @@ declare abstract class Container_<Child extends Node = ChildNode> extends Node {
|
|
|
378
361
|
callback: (atRule: AtRule, index: number) => false | void
|
|
379
362
|
): false | undefined
|
|
380
363
|
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
364
|
+
/**
|
|
365
|
+
* Traverses the container’s descendant nodes, calling callback
|
|
366
|
+
* for each comment node.
|
|
367
|
+
*
|
|
368
|
+
* Like `Container#each`, this method is safe
|
|
369
|
+
* to use if you are mutating arrays during iteration.
|
|
370
|
+
*
|
|
371
|
+
* ```js
|
|
372
|
+
* root.walkComments(comment => {
|
|
373
|
+
* comment.remove()
|
|
374
|
+
* })
|
|
375
|
+
* ```
|
|
376
|
+
*
|
|
377
|
+
* @param callback Iterator receives each node and index.
|
|
378
|
+
* @return Returns `false` if iteration was broke.
|
|
379
|
+
*/
|
|
384
380
|
walkComments(
|
|
385
381
|
callback: (comment: Comment, indexed: number) => false | void
|
|
386
382
|
): false | undefined
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ContainerWithChildren } from './container.js'
|
|
2
|
-
import Node from './node.js'
|
|
2
|
+
import Node, { NodeProps } from './node.js'
|
|
3
3
|
|
|
4
4
|
declare namespace Declaration {
|
|
5
5
|
export interface DeclarationRaws extends Record<string, unknown> {
|
|
@@ -28,7 +28,7 @@ declare namespace Declaration {
|
|
|
28
28
|
}
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
-
export interface DeclarationProps {
|
|
31
|
+
export interface DeclarationProps extends NodeProps {
|
|
32
32
|
/** Whether the declaration has an `!important` annotation. */
|
|
33
33
|
important?: boolean
|
|
34
34
|
/** Name of the declaration. */
|
|
@@ -503,14 +503,24 @@ class LazyResult {
|
|
|
503
503
|
|
|
504
504
|
if (visit.iterator !== 0) {
|
|
505
505
|
let iterator = visit.iterator
|
|
506
|
+
// Advance past the child we just finished visiting. Like
|
|
507
|
+
// `Container#each`, the index is incremented only after a child has
|
|
508
|
+
// been fully processed, so a node inserted right after the current
|
|
509
|
+
// child is not skipped by the `existIndex < index` adjustment in
|
|
510
|
+
// `Container#insertAfter()` (which would fire exit events too early).
|
|
511
|
+
if (visit.descending) {
|
|
512
|
+
visit.descending = false
|
|
513
|
+
node.indexes[iterator] += 1
|
|
514
|
+
}
|
|
506
515
|
let child
|
|
507
516
|
while ((child = node.nodes[node.indexes[iterator]])) {
|
|
508
|
-
node.indexes[iterator] += 1
|
|
509
517
|
if (!child[isClean]) {
|
|
510
518
|
child[isClean] = true
|
|
519
|
+
visit.descending = true
|
|
511
520
|
stack.push(toStack(child))
|
|
512
521
|
return
|
|
513
522
|
}
|
|
523
|
+
node.indexes[iterator] += 1
|
|
514
524
|
}
|
|
515
525
|
visit.iterator = 0
|
|
516
526
|
delete node.indexes[iterator]
|
|
@@ -548,12 +558,22 @@ class LazyResult {
|
|
|
548
558
|
|
|
549
559
|
if (visit.iterator !== 0) {
|
|
550
560
|
let iterator = visit.iterator
|
|
561
|
+
// Advance past the child we just finished visiting. Like
|
|
562
|
+
// `Container#each`, the index is incremented only after a child has
|
|
563
|
+
// been fully processed. Incrementing before (as this loop used to)
|
|
564
|
+
// makes a node inserted right after the current child get skipped by
|
|
565
|
+
// the `existIndex < index` adjustment in `Container#insertAfter()`,
|
|
566
|
+
// which fires exit events before those new siblings are visited.
|
|
567
|
+
if (visit.descending) {
|
|
568
|
+
visit.descending = false
|
|
569
|
+
visitNode.indexes[iterator] += 1
|
|
570
|
+
}
|
|
551
571
|
let child
|
|
552
572
|
let descended = false
|
|
553
573
|
while ((child = visitNode.nodes[visitNode.indexes[iterator]])) {
|
|
554
|
-
visitNode.indexes[iterator] += 1
|
|
555
574
|
if (!child[isClean]) {
|
|
556
575
|
child[isClean] = true
|
|
576
|
+
visit.descending = true
|
|
557
577
|
stack.push({
|
|
558
578
|
eventIndex: 0,
|
|
559
579
|
events: getEvents(child),
|
|
@@ -563,6 +583,7 @@ class LazyResult {
|
|
|
563
583
|
descended = true
|
|
564
584
|
break
|
|
565
585
|
}
|
|
586
|
+
visitNode.indexes[iterator] += 1
|
|
566
587
|
}
|
|
567
588
|
if (descended) continue
|
|
568
589
|
visit.iterator = 0
|
|
@@ -11,6 +11,7 @@ let list = {
|
|
|
11
11
|
},
|
|
12
12
|
|
|
13
13
|
split(string, separators, last) {
|
|
14
|
+
if (typeof string !== 'string') return []
|
|
14
15
|
let array = []
|
|
15
16
|
let current = ''
|
|
16
17
|
let split = false
|
|
@@ -41,7 +42,8 @@ let list = {
|
|
|
41
42
|
}
|
|
42
43
|
|
|
43
44
|
if (split) {
|
|
44
|
-
|
|
45
|
+
let value = current.trim()
|
|
46
|
+
if (last || value !== '') array.push(value)
|
|
45
47
|
current = ''
|
|
46
48
|
split = false
|
|
47
49
|
} else {
|
|
@@ -49,7 +51,8 @@ let list = {
|
|
|
49
51
|
}
|
|
50
52
|
}
|
|
51
53
|
|
|
52
|
-
|
|
54
|
+
let value = current.trim()
|
|
55
|
+
if (last || value !== '') array.push(value)
|
|
53
56
|
return array
|
|
54
57
|
}
|
|
55
58
|
}
|
|
@@ -75,9 +75,10 @@ class MapGenerator {
|
|
|
75
75
|
}
|
|
76
76
|
}
|
|
77
77
|
} else if (this.css) {
|
|
78
|
+
let annotation = '/*# sourceMappingURL='
|
|
78
79
|
let startIndex
|
|
79
|
-
while ((startIndex = this.css.lastIndexOf(
|
|
80
|
-
let endIndex = this.css.indexOf('*/', startIndex +
|
|
80
|
+
while ((startIndex = this.css.lastIndexOf(annotation)) !== -1) {
|
|
81
|
+
let endIndex = this.css.indexOf('*/', startIndex + annotation.length)
|
|
81
82
|
if (endIndex === -1) break
|
|
82
83
|
while (startIndex > 0 && this.css[startIndex - 1] === '\n') {
|
|
83
84
|
startIndex--
|
|
@@ -31,12 +31,12 @@ declare namespace Node {
|
|
|
31
31
|
|
|
32
32
|
export interface Position {
|
|
33
33
|
/**
|
|
34
|
-
* Source
|
|
34
|
+
* Source column in file. It starts from 1.
|
|
35
35
|
*/
|
|
36
36
|
column: number
|
|
37
37
|
|
|
38
38
|
/**
|
|
39
|
-
* Source
|
|
39
|
+
* Source line in file. It starts from 1.
|
|
40
40
|
*/
|
|
41
41
|
line: number
|
|
42
42
|
|
|
@@ -354,8 +354,11 @@ class Parser {
|
|
|
354
354
|
if (prev && prev.type === 'rule' && !prev.raws.ownSemicolon) {
|
|
355
355
|
prev.raws.ownSemicolon = this.spaces
|
|
356
356
|
this.spaces = ''
|
|
357
|
+
// `ownSemicolon` also holds the spaces before the semicolon, but
|
|
358
|
+
// the position above is the semicolon itself, so the node ends
|
|
359
|
+
// right after it.
|
|
357
360
|
prev.source.end = this.getPosition(token[2])
|
|
358
|
-
prev.source.end.offset
|
|
361
|
+
prev.source.end.offset++
|
|
359
362
|
}
|
|
360
363
|
}
|
|
361
364
|
}
|
|
@@ -38,7 +38,7 @@ postcss.plugin = function plugin(name, initializer) {
|
|
|
38
38
|
': postcss.plugin was deprecated. Migration guide:\n' +
|
|
39
39
|
'https://evilmartians.com/chronicles/postcss-8-plugin-migration'
|
|
40
40
|
)
|
|
41
|
-
if (process.env.LANG && process.env.LANG.startsWith('
|
|
41
|
+
if (process.env.LANG && process.env.LANG.startsWith('zh')) {
|
|
42
42
|
/* c8 ignore next 7 */
|
|
43
43
|
// eslint-disable-next-line no-console
|
|
44
44
|
console.warn(
|
|
@@ -1,9 +1,19 @@
|
|
|
1
1
|
'use strict'
|
|
2
2
|
|
|
3
|
-
let { existsSync, readFileSync } = require('fs')
|
|
3
|
+
let { existsSync, readFileSync, realpathSync } = require('fs')
|
|
4
4
|
let { dirname, isAbsolute, join, relative, sep } = require('path')
|
|
5
5
|
let { SourceMapConsumer, SourceMapGenerator } = require('source-map-js')
|
|
6
6
|
|
|
7
|
+
function realPath(path) {
|
|
8
|
+
try {
|
|
9
|
+
return realpathSync(path)
|
|
10
|
+
} catch {
|
|
11
|
+
// Missing or dangling: keep the literal path. The existsSync() check below
|
|
12
|
+
// still gates the read, and a path that does not exist cannot escape.
|
|
13
|
+
return path
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
|
|
7
17
|
function fromBase64(str) {
|
|
8
18
|
if (Buffer) {
|
|
9
19
|
return Buffer.from(str, 'base64').toString()
|
|
@@ -86,19 +96,15 @@ class PreviousMap {
|
|
|
86
96
|
|
|
87
97
|
loadFile(path, cssFile, trusted) {
|
|
88
98
|
if (!trusted && !this.unsafeMap) {
|
|
89
|
-
if (!/\.map$/i.test(path))
|
|
99
|
+
if (!/\.map$/i.test(path)) return undefined
|
|
100
|
+
if (!cssFile) return undefined
|
|
101
|
+
|
|
102
|
+
// Compare *resolved* paths: relative() is textual, so without this a
|
|
103
|
+
// symlink at or below the CSS file's directory points the map outside it.
|
|
104
|
+
let rel = relative(realPath(dirname(cssFile)), realPath(path))
|
|
105
|
+
if (rel === '..' || rel.startsWith('..' + sep) || isAbsolute(rel)) {
|
|
90
106
|
return undefined
|
|
91
107
|
}
|
|
92
|
-
if (cssFile) {
|
|
93
|
-
let relativePath = relative(dirname(cssFile), path)
|
|
94
|
-
if (
|
|
95
|
-
relativePath === '..' ||
|
|
96
|
-
relativePath.startsWith('..' + sep) ||
|
|
97
|
-
isAbsolute(relativePath)
|
|
98
|
-
) {
|
|
99
|
-
return undefined
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
108
|
}
|
|
103
109
|
this.root = dirname(path)
|
|
104
110
|
if (existsSync(path)) {
|
|
@@ -12,6 +12,19 @@ class Root extends Container {
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
normalize(child, sample, type) {
|
|
15
|
+
let keepBefore = new Set()
|
|
16
|
+
for (let node of Array.isArray(child) ? child : [child]) {
|
|
17
|
+
if (
|
|
18
|
+
node &&
|
|
19
|
+
typeof node === 'object' &&
|
|
20
|
+
!node.parent &&
|
|
21
|
+
node.raws &&
|
|
22
|
+
typeof node.raws.before !== 'undefined'
|
|
23
|
+
) {
|
|
24
|
+
keepBefore.add(node.raws)
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
15
28
|
let nodes = super.normalize(child)
|
|
16
29
|
|
|
17
30
|
if (sample) {
|
|
@@ -23,7 +36,9 @@ class Root extends Container {
|
|
|
23
36
|
}
|
|
24
37
|
} else if (this.first !== sample) {
|
|
25
38
|
for (let node of nodes) {
|
|
26
|
-
node.raws
|
|
39
|
+
if (!keepBefore.has(node.raws)) {
|
|
40
|
+
node.raws.before = sample.raws.before
|
|
41
|
+
}
|
|
27
42
|
}
|
|
28
43
|
}
|
|
29
44
|
}
|