@yahoo/uds 3.116.0-beta.3 → 3.116.0-beta.4
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/generated/autoVariants.cjs +1 -0
- package/dist/automated-config/dist/generated/autoVariants.d.cts +1 -0
- package/dist/automated-config/dist/generated/autoVariants.d.ts +1 -0
- package/dist/automated-config/dist/generated/autoVariants.js +1 -0
- package/dist/automated-config/dist/generated/generatedConfigs.cjs +48 -0
- package/dist/automated-config/dist/generated/generatedConfigs.d.cts +14 -0
- package/dist/automated-config/dist/generated/generatedConfigs.d.ts +14 -0
- package/dist/automated-config/dist/generated/generatedConfigs.js +48 -0
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.cjs +5 -0
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.js +5 -0
- 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/Menu/Menu.ItemCheckbox.d.cts +1 -1
- package/dist/components/client/Menu/Menu.ItemCheckbox.d.ts +1 -1
- package/dist/components/client/Popover/PopoverContent.cjs +4 -3
- package/dist/components/client/Popover/PopoverContent.js +4 -3
- package/dist/config/dist/index.cjs +5 -0
- package/dist/config/dist/index.js +5 -0
- package/dist/runtime/popoverConfig.cjs +6 -11
- package/dist/runtime/popoverConfig.d.cts +2 -1
- package/dist/runtime/popoverConfig.d.ts +2 -1
- package/dist/runtime/popoverConfig.js +6 -11
- package/dist/styles/styler.d.cts +70 -69
- package/dist/styles/styler.d.ts +70 -69
- package/dist/styles/variants.d.cts +3 -0
- package/dist/styles/variants.d.ts +3 -0
- package/dist/tailwind/dist/commands/generateComponentData.cjs +2 -0
- package/dist/tailwind/dist/commands/generateComponentData.js +3 -1
- package/dist/tailwind/dist/commands/generatePurgeCSSData.cjs +3 -8
- package/dist/tailwind/dist/commands/generatePurgeCSSData.js +3 -8
- package/dist/tailwind/dist/purger/optimized/purgeFromCode.cjs +22 -2
- package/dist/tailwind/dist/purger/optimized/purgeFromCode.js +22 -2
- package/dist/tailwind/dist/tailwind/plugins/getTailwindAsUdsColors.cjs +294 -10
- package/dist/tailwind/dist/tailwind/plugins/getTailwindAsUdsColors.js +294 -9
- package/dist/tailwind/dist/tailwind/utils/getFontStyles.d.cts +1 -1
- package/dist/tailwind/dist/tailwind/utils/getFontStyles.d.ts +1 -1
- package/dist/uds/generated/componentData.cjs +226 -225
- package/dist/uds/generated/componentData.js +226 -225
- package/dist/uds/generated/tailwindPurge.cjs +219 -218
- package/dist/uds/generated/tailwindPurge.js +219 -218
- package/dist/uds/package.cjs +1 -1
- package/dist/uds/package.js +1 -1
- package/generated/componentData.json +306 -305
- package/generated/tailwindPurge.ts +5 -4604
- package/package.json +2 -2
- package/dist/tailwind/dist/.prettierrc.cjs +0 -13
- package/dist/tailwind/dist/.prettierrc.js +0 -12
|
@@ -490,6 +490,7 @@ const autoVariants = {
|
|
|
490
490
|
menuitemSizeRoot: { default: "uds-menuitem-size-default-root" },
|
|
491
491
|
menuitemSizeStartIcon: { default: "uds-menuitem-size-default-starticon" },
|
|
492
492
|
popoverSizeCloseIcon: { default: "uds-popover-size-default-closeicon" },
|
|
493
|
+
popoverSizeCloseIconContainer: { default: "uds-popover-size-default-closeiconcontainer" },
|
|
493
494
|
popoverSizeContentWrapper: { default: "uds-popover-size-default-contentwrapper" },
|
|
494
495
|
popoverSizeRoot: { default: "uds-popover-size-default-root" },
|
|
495
496
|
popoverSizeSvgBase: { default: "uds-popover-size-default-svgbase" },
|
|
@@ -95,6 +95,7 @@ interface StylePropsVariantsAuto<T> {
|
|
|
95
95
|
menuitemSizeRoot: Record<'default', T>;
|
|
96
96
|
menuitemSizeStartIcon: Record<'default', T>;
|
|
97
97
|
popoverSizeCloseIcon: Record<'default', T>;
|
|
98
|
+
popoverSizeCloseIconContainer: Record<'default', T>;
|
|
98
99
|
popoverSizeContentWrapper: Record<'default', T>;
|
|
99
100
|
popoverSizeRoot: Record<'default', T>;
|
|
100
101
|
popoverSizeSvgBase: Record<'default', T>;
|
|
@@ -95,6 +95,7 @@ interface StylePropsVariantsAuto<T> {
|
|
|
95
95
|
menuitemSizeRoot: Record<'default', T>;
|
|
96
96
|
menuitemSizeStartIcon: Record<'default', T>;
|
|
97
97
|
popoverSizeCloseIcon: Record<'default', T>;
|
|
98
|
+
popoverSizeCloseIconContainer: Record<'default', T>;
|
|
98
99
|
popoverSizeContentWrapper: Record<'default', T>;
|
|
99
100
|
popoverSizeRoot: Record<'default', T>;
|
|
100
101
|
popoverSizeSvgBase: Record<'default', T>;
|
|
@@ -489,6 +489,7 @@ const autoVariants = {
|
|
|
489
489
|
menuitemSizeRoot: { default: "uds-menuitem-size-default-root" },
|
|
490
490
|
menuitemSizeStartIcon: { default: "uds-menuitem-size-default-starticon" },
|
|
491
491
|
popoverSizeCloseIcon: { default: "uds-popover-size-default-closeicon" },
|
|
492
|
+
popoverSizeCloseIconContainer: { default: "uds-popover-size-default-closeiconcontainer" },
|
|
492
493
|
popoverSizeContentWrapper: { default: "uds-popover-size-default-contentwrapper" },
|
|
493
494
|
popoverSizeRoot: { default: "uds-popover-size-default-root" },
|
|
494
495
|
popoverSizeSvgBase: { default: "uds-popover-size-default-svgbase" },
|
|
@@ -25734,6 +25734,54 @@ const PopoverConfig = {
|
|
|
25734
25734
|
]]
|
|
25735
25735
|
} }
|
|
25736
25736
|
},
|
|
25737
|
+
closeIconContainer: {
|
|
25738
|
+
label: "closeIconContainer",
|
|
25739
|
+
properties: { spacing: {
|
|
25740
|
+
defaults: { default: "2" },
|
|
25741
|
+
label: "Dismiss button spacing",
|
|
25742
|
+
name: "spacing",
|
|
25743
|
+
typeOfFixture: ["spacingAliases"],
|
|
25744
|
+
values: [[
|
|
25745
|
+
"0",
|
|
25746
|
+
"px",
|
|
25747
|
+
"0.5",
|
|
25748
|
+
"1",
|
|
25749
|
+
"1.5",
|
|
25750
|
+
"2",
|
|
25751
|
+
"2.5",
|
|
25752
|
+
"3",
|
|
25753
|
+
"3.5",
|
|
25754
|
+
"4",
|
|
25755
|
+
"4.5",
|
|
25756
|
+
"5",
|
|
25757
|
+
"5.5",
|
|
25758
|
+
"6",
|
|
25759
|
+
"7",
|
|
25760
|
+
"8",
|
|
25761
|
+
"9",
|
|
25762
|
+
"10",
|
|
25763
|
+
"11",
|
|
25764
|
+
"12",
|
|
25765
|
+
"14",
|
|
25766
|
+
"16",
|
|
25767
|
+
"20",
|
|
25768
|
+
"24",
|
|
25769
|
+
"28",
|
|
25770
|
+
"32",
|
|
25771
|
+
"36",
|
|
25772
|
+
"40",
|
|
25773
|
+
"44",
|
|
25774
|
+
"48",
|
|
25775
|
+
"52",
|
|
25776
|
+
"56",
|
|
25777
|
+
"60",
|
|
25778
|
+
"64",
|
|
25779
|
+
"72",
|
|
25780
|
+
"80",
|
|
25781
|
+
"96"
|
|
25782
|
+
]]
|
|
25783
|
+
} }
|
|
25784
|
+
},
|
|
25737
25785
|
contentWrapper: {
|
|
25738
25786
|
label: "contentWrapper",
|
|
25739
25787
|
properties: {
|
|
@@ -2725,6 +2725,20 @@ declare const PopoverConfig: {
|
|
|
2725
2725
|
};
|
|
2726
2726
|
};
|
|
2727
2727
|
};
|
|
2728
|
+
readonly closeIconContainer: {
|
|
2729
|
+
readonly label: "closeIconContainer";
|
|
2730
|
+
readonly properties: {
|
|
2731
|
+
readonly spacing: {
|
|
2732
|
+
readonly defaults: {
|
|
2733
|
+
readonly default: "2";
|
|
2734
|
+
};
|
|
2735
|
+
readonly label: "Dismiss button spacing";
|
|
2736
|
+
readonly name: "spacing";
|
|
2737
|
+
readonly typeOfFixture: readonly ["spacingAliases"];
|
|
2738
|
+
readonly values: readonly [readonly ["0", "px", "0.5", "1", "1.5", "2", "2.5", "3", "3.5", "4", "4.5", "5", "5.5", "6", "7", "8", "9", "10", "11", "12", "14", "16", "20", "24", "28", "32", "36", "40", "44", "48", "52", "56", "60", "64", "72", "80", "96"]];
|
|
2739
|
+
};
|
|
2740
|
+
};
|
|
2741
|
+
};
|
|
2728
2742
|
readonly contentWrapper: {
|
|
2729
2743
|
readonly label: "contentWrapper";
|
|
2730
2744
|
readonly properties: {
|
|
@@ -2725,6 +2725,20 @@ declare const PopoverConfig: {
|
|
|
2725
2725
|
};
|
|
2726
2726
|
};
|
|
2727
2727
|
};
|
|
2728
|
+
readonly closeIconContainer: {
|
|
2729
|
+
readonly label: "closeIconContainer";
|
|
2730
|
+
readonly properties: {
|
|
2731
|
+
readonly spacing: {
|
|
2732
|
+
readonly defaults: {
|
|
2733
|
+
readonly default: "2";
|
|
2734
|
+
};
|
|
2735
|
+
readonly label: "Dismiss button spacing";
|
|
2736
|
+
readonly name: "spacing";
|
|
2737
|
+
readonly typeOfFixture: readonly ["spacingAliases"];
|
|
2738
|
+
readonly values: readonly [readonly ["0", "px", "0.5", "1", "1.5", "2", "2.5", "3", "3.5", "4", "4.5", "5", "5.5", "6", "7", "8", "9", "10", "11", "12", "14", "16", "20", "24", "28", "32", "36", "40", "44", "48", "52", "56", "60", "64", "72", "80", "96"]];
|
|
2739
|
+
};
|
|
2740
|
+
};
|
|
2741
|
+
};
|
|
2728
2742
|
readonly contentWrapper: {
|
|
2729
2743
|
readonly label: "contentWrapper";
|
|
2730
2744
|
readonly properties: {
|
|
@@ -25733,6 +25733,54 @@ const PopoverConfig = {
|
|
|
25733
25733
|
]]
|
|
25734
25734
|
} }
|
|
25735
25735
|
},
|
|
25736
|
+
closeIconContainer: {
|
|
25737
|
+
label: "closeIconContainer",
|
|
25738
|
+
properties: { spacing: {
|
|
25739
|
+
defaults: { default: "2" },
|
|
25740
|
+
label: "Dismiss button spacing",
|
|
25741
|
+
name: "spacing",
|
|
25742
|
+
typeOfFixture: ["spacingAliases"],
|
|
25743
|
+
values: [[
|
|
25744
|
+
"0",
|
|
25745
|
+
"px",
|
|
25746
|
+
"0.5",
|
|
25747
|
+
"1",
|
|
25748
|
+
"1.5",
|
|
25749
|
+
"2",
|
|
25750
|
+
"2.5",
|
|
25751
|
+
"3",
|
|
25752
|
+
"3.5",
|
|
25753
|
+
"4",
|
|
25754
|
+
"4.5",
|
|
25755
|
+
"5",
|
|
25756
|
+
"5.5",
|
|
25757
|
+
"6",
|
|
25758
|
+
"7",
|
|
25759
|
+
"8",
|
|
25760
|
+
"9",
|
|
25761
|
+
"10",
|
|
25762
|
+
"11",
|
|
25763
|
+
"12",
|
|
25764
|
+
"14",
|
|
25765
|
+
"16",
|
|
25766
|
+
"20",
|
|
25767
|
+
"24",
|
|
25768
|
+
"28",
|
|
25769
|
+
"32",
|
|
25770
|
+
"36",
|
|
25771
|
+
"40",
|
|
25772
|
+
"44",
|
|
25773
|
+
"48",
|
|
25774
|
+
"52",
|
|
25775
|
+
"56",
|
|
25776
|
+
"60",
|
|
25777
|
+
"64",
|
|
25778
|
+
"72",
|
|
25779
|
+
"80",
|
|
25780
|
+
"96"
|
|
25781
|
+
]]
|
|
25782
|
+
} }
|
|
25783
|
+
},
|
|
25736
25784
|
contentWrapper: {
|
|
25737
25785
|
label: "contentWrapper",
|
|
25738
25786
|
properties: {
|
|
@@ -11075,6 +11075,11 @@ const defaultUniversalTokensConfigAuto = {
|
|
|
11075
11075
|
value: "sm",
|
|
11076
11076
|
valueType: "alias"
|
|
11077
11077
|
} } },
|
|
11078
|
+
"size/default/closeIconContainer": { spacing: { rest: {
|
|
11079
|
+
type: "spacingAliases",
|
|
11080
|
+
value: "2",
|
|
11081
|
+
valueType: "alias"
|
|
11082
|
+
} } },
|
|
11078
11083
|
"size/default/contentWrapper": {
|
|
11079
11084
|
gap: { rest: {
|
|
11080
11085
|
type: "spacingAliases",
|
|
@@ -11074,6 +11074,11 @@ const defaultUniversalTokensConfigAuto = {
|
|
|
11074
11074
|
value: "sm",
|
|
11075
11075
|
valueType: "alias"
|
|
11076
11076
|
} } },
|
|
11077
|
+
"size/default/closeIconContainer": { spacing: { rest: {
|
|
11078
|
+
type: "spacingAliases",
|
|
11079
|
+
value: "2",
|
|
11080
|
+
valueType: "alias"
|
|
11081
|
+
} } },
|
|
11077
11082
|
"size/default/contentWrapper": {
|
|
11078
11083
|
gap: { rest: {
|
|
11079
11084
|
type: "spacingAliases",
|
|
@@ -11,8 +11,8 @@ import { SelectedConfigurableProperty } from "../properties.cjs";
|
|
|
11
11
|
* @returns A Record of layer names to their properties, or null if no properties are found
|
|
12
12
|
*/
|
|
13
13
|
declare function getConfigVariantProperties(variant?: VariantConfig): {
|
|
14
|
-
[x: string]: Readonly<Record<string, SelectedConfigurableProperty<"
|
|
15
|
-
root: Readonly<Record<string, SelectedConfigurableProperty<"
|
|
14
|
+
[x: string]: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
|
|
15
|
+
root: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
|
|
16
16
|
} | null; //#endregion
|
|
17
17
|
//#endregion
|
|
18
18
|
export { getConfigVariantProperties };
|
|
@@ -11,8 +11,8 @@ import { SelectedConfigurableProperty } from "../properties.js";
|
|
|
11
11
|
* @returns A Record of layer names to their properties, or null if no properties are found
|
|
12
12
|
*/
|
|
13
13
|
declare function getConfigVariantProperties(variant?: VariantConfig): {
|
|
14
|
-
[x: string]: Readonly<Record<string, SelectedConfigurableProperty<"
|
|
15
|
-
root: Readonly<Record<string, SelectedConfigurableProperty<"
|
|
14
|
+
[x: string]: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
|
|
15
|
+
root: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 "scaleEffects"[] | readonly "positiveIntegers"[] | readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
|
|
16
16
|
} | null; //#endregion
|
|
17
17
|
//#endregion
|
|
18
18
|
export { getConfigVariantProperties };
|
|
@@ -88,6 +88,6 @@ interface MenuItemCheckboxProps extends Omit<PressableProps, 'asChild'>, HtmlBut
|
|
|
88
88
|
*
|
|
89
89
|
* @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item)
|
|
90
90
|
**/
|
|
91
|
-
declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "
|
|
91
|
+
declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "active" | "hideEndIcon" | "rootProps"> & react.RefAttributes<HTMLDivElement>>;
|
|
92
92
|
//#endregion
|
|
93
93
|
export { MenuItemCheckbox, type MenuItemCheckboxProps };
|
|
@@ -88,6 +88,6 @@ interface MenuItemCheckboxProps extends Omit<PressableProps, 'asChild'>, HtmlBut
|
|
|
88
88
|
*
|
|
89
89
|
* @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item)
|
|
90
90
|
**/
|
|
91
|
-
declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "
|
|
91
|
+
declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "active" | "hideEndIcon" | "rootProps"> & react.RefAttributes<HTMLDivElement>>;
|
|
92
92
|
//#endregion
|
|
93
93
|
export { MenuItemCheckbox, type MenuItemCheckboxProps };
|
|
@@ -32,12 +32,13 @@ const PopoverContent = (0, react.forwardRef)(function PopoverContent({ children,
|
|
|
32
32
|
const currentPlacement = (0, _ariakit_react.useStoreState)(store, "currentPlacement");
|
|
33
33
|
const placement = (0, _ariakit_react.useStoreState)(store, "placement");
|
|
34
34
|
const effectivePlacement = currentPlacement ?? placement ?? "top";
|
|
35
|
-
const { borderRadius, gap, spacingHorizontal, spacingVertical,
|
|
35
|
+
const { borderRadius, gap, spacingHorizontal, spacingVertical, dismissButtonSpacing, dismissIconSize } = require_components_client_Popover_UDSPopoverConfigProvider.usePopoverConfig();
|
|
36
36
|
const defaultBorderRadius = borderRadius["default"];
|
|
37
37
|
const defaultGap = gap["default"];
|
|
38
38
|
const defaultSpacingHorizontal = spacingHorizontal["default"];
|
|
39
39
|
const defaultSpacingVertical = spacingVertical["default"];
|
|
40
|
-
const
|
|
40
|
+
const defaultDismissButtonSpacing = require_index.spacingMap[dismissButtonSpacing["default"]];
|
|
41
|
+
const defaultDismissButtonSize = dismissIconSize["default"] + 2 * defaultDismissButtonSpacing;
|
|
41
42
|
const arrowRef = (0, react.useRef)(null);
|
|
42
43
|
const reducedMotion = internalContext ? internalContext.reducedMotion : false;
|
|
43
44
|
const animationDuration = reducedMotion || !internalContext ? 0 : internalContext.animationDuration;
|
|
@@ -92,7 +93,7 @@ const PopoverContent = (0, react.forwardRef)(function PopoverContent({ children,
|
|
|
92
93
|
alignItems: "center",
|
|
93
94
|
justifyContent: "center",
|
|
94
95
|
display: "flex",
|
|
95
|
-
className: require_styles_styler.cx(reducedMotion ? "duration-0" : "duration-120", "transition-[background-color]", "bg-carbon-15/0", "hover:bg-carbon-15/10", "active:bg-carbon-15/15")
|
|
96
|
+
className: require_styles_styler.cx(reducedMotion ? "duration-0" : "duration-120", "transition-[background-color]", "bg-carbon-15/0", "hover:bg-carbon-15/10", "active:bg-carbon-15/15", "uds-ring")
|
|
96
97
|
}),
|
|
97
98
|
closeIcon: require_styles_styler.getStyles({
|
|
98
99
|
popoverVariantCloseIcon: "default",
|
|
@@ -30,12 +30,13 @@ const PopoverContent = forwardRef(function PopoverContent({ children, className,
|
|
|
30
30
|
const currentPlacement = useStoreState(store, "currentPlacement");
|
|
31
31
|
const placement = useStoreState(store, "placement");
|
|
32
32
|
const effectivePlacement = currentPlacement ?? placement ?? "top";
|
|
33
|
-
const { borderRadius, gap, spacingHorizontal, spacingVertical,
|
|
33
|
+
const { borderRadius, gap, spacingHorizontal, spacingVertical, dismissButtonSpacing, dismissIconSize } = usePopoverConfig();
|
|
34
34
|
const defaultBorderRadius = borderRadius["default"];
|
|
35
35
|
const defaultGap = gap["default"];
|
|
36
36
|
const defaultSpacingHorizontal = spacingHorizontal["default"];
|
|
37
37
|
const defaultSpacingVertical = spacingVertical["default"];
|
|
38
|
-
const
|
|
38
|
+
const defaultDismissButtonSpacing = spacingMap[dismissButtonSpacing["default"]];
|
|
39
|
+
const defaultDismissButtonSize = dismissIconSize["default"] + 2 * defaultDismissButtonSpacing;
|
|
39
40
|
const arrowRef = useRef(null);
|
|
40
41
|
const reducedMotion = internalContext ? internalContext.reducedMotion : false;
|
|
41
42
|
const animationDuration = reducedMotion || !internalContext ? 0 : internalContext.animationDuration;
|
|
@@ -90,7 +91,7 @@ const PopoverContent = forwardRef(function PopoverContent({ children, className,
|
|
|
90
91
|
alignItems: "center",
|
|
91
92
|
justifyContent: "center",
|
|
92
93
|
display: "flex",
|
|
93
|
-
className: cx(reducedMotion ? "duration-0" : "duration-120", "transition-[background-color]", "bg-carbon-15/0", "hover:bg-carbon-15/10", "active:bg-carbon-15/15")
|
|
94
|
+
className: cx(reducedMotion ? "duration-0" : "duration-120", "transition-[background-color]", "bg-carbon-15/0", "hover:bg-carbon-15/10", "active:bg-carbon-15/15", "uds-ring")
|
|
94
95
|
}),
|
|
95
96
|
closeIcon: getStyles({
|
|
96
97
|
popoverVariantCloseIcon: "default",
|
|
@@ -16451,6 +16451,11 @@ const defaultTokensConfig = {
|
|
|
16451
16451
|
value: "sm",
|
|
16452
16452
|
valueType: "alias"
|
|
16453
16453
|
} } },
|
|
16454
|
+
"size/default/closeIconContainer": { spacing: { rest: {
|
|
16455
|
+
type: "spacingAliases",
|
|
16456
|
+
value: "2",
|
|
16457
|
+
valueType: "alias"
|
|
16458
|
+
} } },
|
|
16454
16459
|
"size/default/contentWrapper": {
|
|
16455
16460
|
gap: { rest: {
|
|
16456
16461
|
type: "spacingAliases",
|
|
@@ -16450,6 +16450,11 @@ const defaultTokensConfig = {
|
|
|
16450
16450
|
value: "sm",
|
|
16451
16451
|
valueType: "alias"
|
|
16452
16452
|
} } },
|
|
16453
|
+
"size/default/closeIconContainer": { spacing: { rest: {
|
|
16454
|
+
type: "spacingAliases",
|
|
16455
|
+
value: "2",
|
|
16456
|
+
valueType: "alias"
|
|
16457
|
+
} } },
|
|
16453
16458
|
"size/default/contentWrapper": {
|
|
16454
16459
|
gap: { rest: {
|
|
16455
16460
|
type: "spacingAliases",
|
|
@@ -19,21 +19,16 @@ const placementMap = {
|
|
|
19
19
|
"end-bottom": "right-end"
|
|
20
20
|
};
|
|
21
21
|
const configToPopoverConfigContext = ({ popover, scaleMode }) => {
|
|
22
|
-
const borderRadius = require_tokens_utils_fromEntries.fromEntries(popoverSizes.map((s) => [s, scaleMode.medium.borderRadius[popover.variables[`size/${s}/svgBase`].borderRadius.rest.value]]));
|
|
23
|
-
const gap = require_tokens_utils_fromEntries.fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].gap.rest.value]));
|
|
24
|
-
const spacingHorizontal = require_tokens_utils_fromEntries.fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].spacingHorizontal.rest.value]));
|
|
25
|
-
const spacingVertical = require_tokens_utils_fromEntries.fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].spacingVertical.rest.value]));
|
|
26
|
-
const dismissButtonSize = { default: 32 };
|
|
27
|
-
if (Object.values(borderRadius).some((b) => typeof b !== "number")) throw new Error("borderRadius is not a number");
|
|
28
22
|
return {
|
|
29
23
|
animationDuration: 200,
|
|
30
|
-
borderRadius,
|
|
24
|
+
borderRadius: require_tokens_utils_fromEntries.fromEntries(popoverSizes.map((s) => [s, scaleMode.medium.borderRadius[popover.variables[`size/${s}/svgBase`].borderRadius.rest.value]])),
|
|
31
25
|
placementMap,
|
|
32
26
|
placement: "top",
|
|
33
|
-
gap,
|
|
34
|
-
spacingHorizontal,
|
|
35
|
-
spacingVertical,
|
|
36
|
-
|
|
27
|
+
gap: require_tokens_utils_fromEntries.fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].gap.rest.value])),
|
|
28
|
+
spacingHorizontal: require_tokens_utils_fromEntries.fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].spacingHorizontal.rest.value])),
|
|
29
|
+
spacingVertical: require_tokens_utils_fromEntries.fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].spacingVertical.rest.value])),
|
|
30
|
+
dismissButtonSpacing: require_tokens_utils_fromEntries.fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/closeIconContainer`].spacing.rest.value])),
|
|
31
|
+
dismissIconSize: require_tokens_utils_fromEntries.fromEntries(popoverSizes.map((s) => [s, scaleMode.medium.iconSizes[popover.variables[`size/${s}/closeIcon`].size.rest.value]]))
|
|
37
32
|
};
|
|
38
33
|
};
|
|
39
34
|
|
|
@@ -14,7 +14,8 @@ interface UDSPopoverConfigContextType {
|
|
|
14
14
|
gap: Record<PopoverSize, SpacingAlias>;
|
|
15
15
|
spacingHorizontal: Record<PopoverSize, SpacingAlias>;
|
|
16
16
|
spacingVertical: Record<PopoverSize, SpacingAlias>;
|
|
17
|
-
|
|
17
|
+
dismissButtonSpacing: Record<PopoverSize, SpacingAlias>;
|
|
18
|
+
dismissIconSize: Record<PopoverSize, number>;
|
|
18
19
|
}
|
|
19
20
|
declare const configToPopoverConfigContext: ({
|
|
20
21
|
popover,
|
|
@@ -14,7 +14,8 @@ interface UDSPopoverConfigContextType {
|
|
|
14
14
|
gap: Record<PopoverSize, SpacingAlias>;
|
|
15
15
|
spacingHorizontal: Record<PopoverSize, SpacingAlias>;
|
|
16
16
|
spacingVertical: Record<PopoverSize, SpacingAlias>;
|
|
17
|
-
|
|
17
|
+
dismissButtonSpacing: Record<PopoverSize, SpacingAlias>;
|
|
18
|
+
dismissIconSize: Record<PopoverSize, number>;
|
|
18
19
|
}
|
|
19
20
|
declare const configToPopoverConfigContext: ({
|
|
20
21
|
popover,
|
|
@@ -18,21 +18,16 @@ const placementMap = {
|
|
|
18
18
|
"end-bottom": "right-end"
|
|
19
19
|
};
|
|
20
20
|
const configToPopoverConfigContext = ({ popover, scaleMode }) => {
|
|
21
|
-
const borderRadius = fromEntries(popoverSizes.map((s) => [s, scaleMode.medium.borderRadius[popover.variables[`size/${s}/svgBase`].borderRadius.rest.value]]));
|
|
22
|
-
const gap = fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].gap.rest.value]));
|
|
23
|
-
const spacingHorizontal = fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].spacingHorizontal.rest.value]));
|
|
24
|
-
const spacingVertical = fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].spacingVertical.rest.value]));
|
|
25
|
-
const dismissButtonSize = { default: 32 };
|
|
26
|
-
if (Object.values(borderRadius).some((b) => typeof b !== "number")) throw new Error("borderRadius is not a number");
|
|
27
21
|
return {
|
|
28
22
|
animationDuration: 200,
|
|
29
|
-
borderRadius,
|
|
23
|
+
borderRadius: fromEntries(popoverSizes.map((s) => [s, scaleMode.medium.borderRadius[popover.variables[`size/${s}/svgBase`].borderRadius.rest.value]])),
|
|
30
24
|
placementMap,
|
|
31
25
|
placement: "top",
|
|
32
|
-
gap,
|
|
33
|
-
spacingHorizontal,
|
|
34
|
-
spacingVertical,
|
|
35
|
-
|
|
26
|
+
gap: fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].gap.rest.value])),
|
|
27
|
+
spacingHorizontal: fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].spacingHorizontal.rest.value])),
|
|
28
|
+
spacingVertical: fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/contentWrapper`].spacingVertical.rest.value])),
|
|
29
|
+
dismissButtonSpacing: fromEntries(popoverSizes.map((s) => [s, popover.variables[`size/${s}/closeIconContainer`].spacing.rest.value])),
|
|
30
|
+
dismissIconSize: fromEntries(popoverSizes.map((s) => [s, scaleMode.medium.iconSizes[popover.variables[`size/${s}/closeIcon`].size.rest.value]]))
|
|
36
31
|
};
|
|
37
32
|
};
|
|
38
33
|
|