@yahoo/uds 3.157.0 → 3.158.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/dist/automated-config/dist/generated/autoVariants.cjs +26 -0
- package/dist/automated-config/dist/generated/autoVariants.d.cts +17 -0
- package/dist/automated-config/dist/generated/autoVariants.d.ts +17 -0
- package/dist/automated-config/dist/generated/autoVariants.js +26 -0
- package/dist/automated-config/dist/generated/generatedConfigs.cjs +3287 -596
- package/dist/automated-config/dist/generated/generatedConfigs.d.cts +350 -12
- package/dist/automated-config/dist/generated/generatedConfigs.d.ts +350 -12
- package/dist/automated-config/dist/generated/generatedConfigs.js +3285 -597
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.cjs +276 -45
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.d.cts +8 -2
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.d.ts +8 -2
- package/dist/automated-config/dist/generated/universalTokensConfigAuto.js +276 -45
- package/dist/automated-config/dist/properties.cjs +8 -1
- package/dist/automated-config/dist/properties.d.cts +8 -0
- package/dist/automated-config/dist/properties.d.ts +8 -0
- package/dist/automated-config/dist/properties.js +8 -1
- package/dist/automated-config/dist/types/ComponentConfig.d.cts +3 -1
- package/dist/automated-config/dist/types/ComponentConfig.d.ts +3 -1
- package/dist/automated-config/dist/utils/buildConfigSchema.cjs +48 -33
- package/dist/automated-config/dist/utils/buildConfigSchema.d.cts +14 -4
- package/dist/automated-config/dist/utils/buildConfigSchema.d.ts +14 -4
- package/dist/automated-config/dist/utils/buildConfigSchema.js +49 -34
- package/dist/automated-config/dist/utils/componentStatePseudoStates.cjs +4 -0
- package/dist/automated-config/dist/utils/componentStatePseudoStates.js +4 -1
- package/dist/automated-config/dist/utils/getButtonControlHeight.cjs +129 -0
- package/dist/automated-config/dist/utils/getButtonControlHeight.d.cts +133 -0
- package/dist/automated-config/dist/utils/getButtonControlHeight.d.ts +133 -0
- package/dist/automated-config/dist/utils/getButtonControlHeight.js +122 -0
- package/dist/automated-config/dist/utils/getButtonControlHeightPx.cjs +114 -0
- package/dist/automated-config/dist/utils/getButtonControlHeightPx.d.cts +78 -0
- package/dist/automated-config/dist/utils/getButtonControlHeightPx.d.ts +78 -0
- package/dist/automated-config/dist/utils/getButtonControlHeightPx.js +108 -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/automated-config/dist/utils/getConfigVariantPseudoStates.cjs +5 -2
- package/dist/automated-config/dist/utils/getConfigVariantPseudoStates.js +6 -3
- package/dist/automated-config/dist/utils/iconButtonMatchButtonHeight.cjs +110 -0
- package/dist/automated-config/dist/utils/iconButtonMatchButtonHeight.d.cts +19 -0
- package/dist/automated-config/dist/utils/iconButtonMatchButtonHeight.d.ts +19 -0
- package/dist/automated-config/dist/utils/iconButtonMatchButtonHeight.js +108 -0
- package/dist/automated-config/dist/utils/index.cjs +106 -33
- package/dist/automated-config/dist/utils/index.d.cts +16 -4
- package/dist/automated-config/dist/utils/index.d.ts +16 -4
- package/dist/automated-config/dist/utils/index.js +107 -34
- package/dist/automated-config/dist/utils/isConfiguratorPropertyVisible.cjs +15 -0
- package/dist/automated-config/dist/utils/isConfiguratorPropertyVisible.d.cts +20 -0
- package/dist/automated-config/dist/utils/isConfiguratorPropertyVisible.d.ts +20 -0
- package/dist/automated-config/dist/utils/isConfiguratorPropertyVisible.js +15 -0
- package/dist/automated-config/dist/utils/pseudoStateSelectors.cjs +6 -3
- package/dist/automated-config/dist/utils/pseudoStateSelectors.d.cts +1 -1
- package/dist/automated-config/dist/utils/pseudoStateSelectors.d.ts +1 -1
- package/dist/automated-config/dist/utils/pseudoStateSelectors.js +6 -3
- package/dist/components/client/Button.cjs +3 -3
- package/dist/components/client/Button.js +3 -3
- package/dist/components/client/Input/Input.cjs +1 -1
- package/dist/components/client/Input/Input.js +1 -1
- package/dist/components/client/Menu/Menu.Item.cjs +1 -0
- package/dist/components/client/Menu/Menu.Item.js +1 -0
- package/dist/components/client/Select/Select.cjs +179 -0
- package/dist/components/client/Select/Select.d.cts +55 -0
- package/dist/components/client/Select/Select.d.ts +56 -0
- package/dist/components/client/Select/Select.js +176 -0
- package/dist/components/client/Select/SelectContent.cjs +75 -0
- package/dist/components/client/Select/SelectContent.d.cts +44 -0
- package/dist/components/client/Select/SelectContent.d.ts +45 -0
- package/dist/components/client/Select/SelectContent.js +73 -0
- package/dist/components/client/Select/SelectDivider.cjs +63 -0
- package/dist/components/client/Select/SelectDivider.d.cts +44 -0
- package/dist/components/client/Select/SelectDivider.d.ts +45 -0
- package/dist/components/client/Select/SelectDivider.js +61 -0
- package/dist/components/client/Select/SelectHelpText.cjs +51 -0
- package/dist/components/client/Select/SelectHelpText.d.cts +27 -0
- package/dist/components/client/Select/SelectHelpText.d.ts +28 -0
- package/dist/components/client/Select/SelectHelpText.js +48 -0
- package/dist/components/client/Select/SelectItem.cjs +172 -0
- package/dist/components/client/Select/SelectItem.d.cts +29 -0
- package/dist/components/client/Select/SelectItem.d.ts +30 -0
- package/dist/components/client/Select/SelectItem.js +170 -0
- package/dist/components/client/Select/SelectTrigger.cjs +138 -0
- package/dist/components/client/Select/SelectTrigger.d.cts +27 -0
- package/dist/components/client/Select/SelectTrigger.d.ts +28 -0
- package/dist/components/client/Select/SelectTrigger.js +136 -0
- package/dist/components/client/Select/SelectValue.cjs +28 -0
- package/dist/components/client/Select/SelectValue.d.cts +19 -0
- package/dist/components/client/Select/SelectValue.d.ts +20 -0
- package/dist/components/client/Select/SelectValue.js +26 -0
- package/dist/components/client/Select/index.cjs +11 -0
- package/dist/components/client/Select/index.d.cts +6 -0
- package/dist/components/client/Select/index.d.ts +7 -0
- package/dist/components/client/Select/index.js +7 -0
- package/dist/components/client/Select/selectContext.cjs +20 -0
- package/dist/components/client/Select/selectContext.d.cts +23 -0
- package/dist/components/client/Select/selectContext.d.ts +24 -0
- package/dist/components/client/Select/selectContext.js +16 -0
- package/dist/components/client/Select/selectFieldStyles.cjs +85 -0
- package/dist/components/client/Select/selectFieldStyles.d.cts +37 -0
- package/dist/components/client/Select/selectFieldStyles.d.ts +38 -0
- package/dist/components/client/Select/selectFieldStyles.js +75 -0
- package/dist/components/client/index.cjs +8 -0
- package/dist/components/client/index.d.cts +5 -1
- package/dist/components/client/index.d.ts +5 -1
- package/dist/components/client/index.js +5 -1
- package/dist/components/index.cjs +8 -0
- package/dist/components/index.d.cts +5 -1
- package/dist/components/index.d.ts +5 -1
- package/dist/components/index.js +5 -1
- package/dist/config/dist/index.cjs +383 -73
- package/dist/config/dist/index.js +383 -73
- package/dist/css/dist/css/utils.cjs +3 -0
- package/dist/css/dist/css/utils.js +3 -0
- package/dist/css/dist/packages/automated-config/dist/properties.cjs +8 -1
- package/dist/css/dist/packages/automated-config/dist/properties.js +8 -1
- package/dist/css/dist/packages/config/dist/index.cjs +383 -73
- package/dist/css/dist/packages/config/dist/index.js +383 -73
- package/dist/css-tokens/dist/index.cjs +2 -0
- package/dist/css-tokens/dist/index.d.cts +2 -1
- package/dist/css-tokens/dist/index.d.ts +2 -1
- package/dist/css-tokens/dist/index.js +2 -1
- package/dist/index.cjs +34 -0
- package/dist/index.d.cts +12 -4
- package/dist/index.d.ts +12 -4
- package/dist/index.js +11 -3
- package/dist/styles/styler.d.cts +29 -12
- package/dist/styles/styler.d.ts +29 -12
- package/dist/styles/variants.d.cts +54 -0
- package/dist/styles/variants.d.ts +54 -0
- package/dist/tailwind/utils/index.cjs +3 -0
- package/dist/tailwind/utils/index.d.cts +2 -1
- package/dist/tailwind/utils/index.d.ts +2 -1
- package/dist/tailwind/utils/index.js +2 -1
- package/dist/tailwind-internal/dist/base/addColorModeVars.cjs +1 -1
- package/dist/tailwind-internal/dist/base/addColorModeVars.js +1 -1
- package/dist/tailwind-internal/dist/base/addColorModeVarsV2.cjs +1 -1
- package/dist/tailwind-internal/dist/base/addColorModeVarsV2.js +1 -1
- package/dist/tailwind-internal/dist/components/getFocusRingStyles.cjs +74 -6
- package/dist/tailwind-internal/dist/components/getFocusRingStyles.d.cts +14 -0
- package/dist/tailwind-internal/dist/components/getFocusRingStyles.d.ts +14 -0
- package/dist/tailwind-internal/dist/components/getFocusRingStyles.js +74 -7
- package/dist/tailwind-internal/dist/components/getResponsiveTextStyles.cjs +1 -1
- package/dist/tailwind-internal/dist/components/getResponsiveTextStyles.js +1 -1
- package/dist/tailwind-internal/dist/index.d.cts +1 -0
- package/dist/tailwind-internal/dist/index.d.ts +1 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/generated/generatedConfigs.cjs +3287 -596
- package/dist/tailwind-internal/dist/packages/automated-config/dist/generated/generatedConfigs.js +3285 -597
- package/dist/tailwind-internal/dist/packages/automated-config/dist/properties.cjs +8 -1
- package/dist/tailwind-internal/dist/packages/automated-config/dist/properties.js +8 -1
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/componentStatePseudoStates.cjs +4 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/componentStatePseudoStates.js +4 -1
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/getButtonControlHeight.cjs +126 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/getButtonControlHeight.js +123 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/iconButtonMatchButtonHeight.cjs +20 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/iconButtonMatchButtonHeight.js +20 -0
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/index.cjs +103 -33
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/index.js +104 -34
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/pseudoStateSelectors.cjs +6 -3
- package/dist/tailwind-internal/dist/packages/automated-config/dist/utils/pseudoStateSelectors.js +6 -3
- package/dist/tailwind-internal/dist/packages/config/dist/index.cjs +383 -73
- package/dist/tailwind-internal/dist/packages/config/dist/index.js +383 -73
- package/dist/tailwind-internal/dist/packages/css-tokens/dist/index.cjs +12 -10
- package/dist/tailwind-internal/dist/packages/css-tokens/dist/index.js +3 -2
- package/dist/tailwind-internal/dist/plugins/a11y.cjs +6 -2
- package/dist/tailwind-internal/dist/plugins/a11y.js +6 -2
- package/dist/tailwind-internal/dist/plugins/blurBgFallback.cjs +1 -1
- package/dist/tailwind-internal/dist/plugins/blurBgFallback.js +1 -1
- package/dist/tailwind-internal/dist/plugins/borderRadius.cjs +1 -1
- package/dist/tailwind-internal/dist/plugins/borderRadius.js +1 -1
- package/dist/tailwind-internal/dist/plugins/borderWidth.cjs +1 -1
- package/dist/tailwind-internal/dist/plugins/borderWidth.js +1 -1
- package/dist/tailwind-internal/dist/plugins/colors.cjs +2 -2
- package/dist/tailwind-internal/dist/plugins/colors.js +2 -2
- package/dist/tailwind-internal/dist/plugins/components.cjs +5 -2
- package/dist/tailwind-internal/dist/plugins/components.js +6 -3
- package/dist/tailwind-internal/dist/plugins/elevation.cjs +1 -1
- package/dist/tailwind-internal/dist/plugins/elevation.js +1 -1
- package/dist/tailwind-internal/dist/plugins/shadows.cjs +1 -1
- package/dist/tailwind-internal/dist/plugins/shadows.js +1 -1
- package/dist/tailwind-internal/dist/plugins/typography.cjs +2 -2
- package/dist/tailwind-internal/dist/plugins/typography.js +2 -2
- package/dist/tailwind-internal/dist/utils/getElevationStyles.cjs +1 -1
- package/dist/tailwind-internal/dist/utils/getElevationStyles.js +1 -1
- package/dist/tailwind-internal/dist/utils/getFontStyles.cjs +1 -1
- package/dist/tailwind-internal/dist/utils/getFontStyles.js +1 -1
- package/dist/tailwind-internal/dist/utils/getMotionStyles.cjs +1 -1
- package/dist/tailwind-internal/dist/utils/getMotionStyles.js +1 -1
- package/dist/tailwind-internal/dist/utils/getShadowPresetValues.cjs +1 -1
- package/dist/tailwind-internal/dist/utils/getShadowPresetValues.js +1 -1
- package/dist/tailwind-internal/dist/utils/getShadowStyles.cjs +1 -1
- package/dist/tailwind-internal/dist/utils/getShadowStyles.js +1 -1
- package/dist/tailwind-internal/dist/utils/parseTokens.cjs +2 -2
- package/dist/tailwind-internal/dist/utils/parseTokens.js +2 -2
- package/dist/tokens/automation/configs/index.cjs +3 -0
- package/dist/tokens/automation/configs/index.d.cts +2 -2
- package/dist/tokens/automation/configs/index.d.ts +2 -2
- package/dist/tokens/automation/configs/index.js +2 -2
- package/dist/tokens/automation/index.cjs +25 -0
- package/dist/tokens/automation/index.d.cts +6 -2
- package/dist/tokens/automation/index.d.ts +6 -2
- package/dist/tokens/automation/index.js +6 -2
- package/dist/tokens/consts/cssTokens.cjs +1 -0
- package/dist/tokens/consts/cssTokens.d.cts +2 -2
- package/dist/tokens/consts/cssTokens.d.ts +2 -2
- package/dist/tokens/consts/cssTokens.js +2 -2
- package/dist/tokens/index.cjs +26 -0
- package/dist/tokens/index.d.cts +8 -4
- package/dist/tokens/index.d.ts +8 -4
- package/dist/tokens/index.js +7 -3
- package/dist/tokens/types.d.cts +2 -2
- package/dist/tokens/types.d.ts +2 -2
- package/dist/types/dist/index.d.cts +36 -1
- package/dist/types/dist/index.d.ts +36 -1
- package/dist/uds/generated/componentData.cjs +718 -308
- package/dist/uds/generated/componentData.js +718 -308
- package/dist/uds/generated/migrationSchemaVersion.cjs +1 -1
- package/dist/uds/generated/migrationSchemaVersion.js +1 -1
- package/dist/uds/generated/tailwindPurge.cjs +1501 -315
- package/dist/uds/generated/tailwindPurge.js +1501 -315
- package/generated/componentData.json +897 -398
- package/generated/migrationSchemaVersion.ts +1 -1
- package/generated/tailwindPurge.ts +4 -4
- package/package.json +1 -1
|
@@ -8,6 +8,13 @@ import { SchemaStateValue } from "../types/ConfigSchema.js";
|
|
|
8
8
|
import { OmitIndexSignature, SimplifyDeep, UnionToIntersection, WritableDeep } from "type-fest";
|
|
9
9
|
|
|
10
10
|
//#region ../automated-config/dist/utils/buildConfigSchema.d.ts
|
|
11
|
+
type OptionalInDefaultSchemaPropKeys<Props extends Record<string, SelectedConfigurableProperty<ConfigurablePropertiesName, string>>> = { [K in keyof Props]: Props[K] extends {
|
|
12
|
+
optionalInDefaultSchema: true;
|
|
13
|
+
} ? K : never }[keyof Props];
|
|
14
|
+
type RequiredInDefaultSchemaPropKeys<Props extends Record<string, SelectedConfigurableProperty<ConfigurablePropertiesName, string>>> = { [K in keyof Props]: Props[K] extends {
|
|
15
|
+
optionalInDefaultSchema: true;
|
|
16
|
+
} ? never : K }[keyof Props];
|
|
17
|
+
type InferredLayerPropertyMap<Props extends Record<string, SelectedConfigurableProperty<ConfigurablePropertiesName, string>>, Layer> = { [PropKey in RequiredInDefaultSchemaPropKeys<Props>]: InferredPropertyStates<Props[PropKey], Layer> } & { [PropKey in OptionalInDefaultSchemaPropKeys<Props>]?: InferredPropertyStates<Props[PropKey], Layer> };
|
|
11
18
|
/** Infers default option values from all component variants */
|
|
12
19
|
type InferredDefaults<C extends ComponentConfig> = (C['variants'] extends NonNullable<ComponentConfig['variants']> ? { [VarKey in keyof C['variants']]: C['variants'][VarKey]['options'][number] } : {}) & (C['subComponents'] extends NonNullable<ComponentConfig['subComponents']> ? UnionToIntersection<{ [SubCompKey in keyof C['subComponents']]: { [VarKey in keyof C['subComponents'][SubCompKey]['variants']]: C['subComponents'][SubCompKey]['variants'][VarKey]['options'][number] } }[keyof C['subComponents']]> : {});
|
|
13
20
|
/** Infers type-safe schema value structure for a configurable property */
|
|
@@ -45,6 +52,9 @@ type InferredPropertyStates<Prop extends SelectedConfigurableProperty<Configurab
|
|
|
45
52
|
type GetExcludedPseudoStatesForOption<StateConfig extends ComponentStateConfig, StateOption extends string> = StateConfig extends {
|
|
46
53
|
excludePseudoStatesForOptions?: infer Exclusions extends Partial<Record<string, readonly PossibleStates[]>>;
|
|
47
54
|
} ? StateOption extends keyof Exclusions ? Exclusions[StateOption] : undefined : undefined;
|
|
55
|
+
type GetExcludedLayersForOption<StateConfig extends ComponentStateConfig, StateOption extends string> = StateConfig extends {
|
|
56
|
+
excludeLayersForOptions?: infer Exclusions extends Partial<Record<string, readonly string[]>>;
|
|
57
|
+
} ? StateOption extends keyof Exclusions ? Exclusions[StateOption] extends readonly (infer Layer extends string)[] ? Layer : never : never : never;
|
|
48
58
|
/** Property states after applying per-option pseudo-state exclusions */
|
|
49
59
|
type InferredPropertyStatesForOption<Prop extends SelectedConfigurableProperty<ConfigurablePropertiesName, string>, ExcludedPseudoStates extends readonly PossibleStates[] | undefined> = (Prop['skipRestState'] extends true ? {} : {
|
|
50
60
|
rest: InferredPropertySchema<Prop>;
|
|
@@ -54,13 +64,13 @@ type InferredPropertyStatesForOption<Prop extends SelectedConfigurableProperty<C
|
|
|
54
64
|
/** Infers property-to-states mappings for a layer's properties */
|
|
55
65
|
type InferredLayerProperties<Layer> = Layer extends LayerConfig ? Layer extends {
|
|
56
66
|
properties: infer Props extends LayerConfig['properties'];
|
|
57
|
-
} ?
|
|
67
|
+
} ? InferredLayerPropertyMap<Props, Layer> : {} : {};
|
|
58
68
|
type InferredLayerPropertiesForOption<Layer, ExcludedPseudoStates extends readonly PossibleStates[] | undefined> = Layer extends LayerConfig ? Layer extends {
|
|
59
69
|
properties: infer Props extends LayerConfig['properties'];
|
|
60
|
-
} ? { [PropKey in
|
|
70
|
+
} ? { [PropKey in RequiredInDefaultSchemaPropKeys<Props>]: InferredPropertyStatesForOption<Props[PropKey], ExcludedPseudoStates> } & { [PropKey in OptionalInDefaultSchemaPropKeys<Props>]?: InferredPropertyStatesForOption<Props[PropKey], ExcludedPseudoStates> } : {} : {};
|
|
61
71
|
/** Generates schema key → properties mappings for a variant's layers or component states */
|
|
62
|
-
type InferredSchemaMap<VarKey extends string, VarConfig extends VariantConfig, LayersOrStates extends NonNullable<VariantConfigWithComponentStates['componentStates']> | NonNullable<VariantConfigWithProperties['layers']>, Prefix extends string = ''> = LayersOrStates extends NonNullable<VariantConfigWithComponentStates['componentStates']> ? UnionToIntersection<{ [StateKey in keyof OmitIndexSignature<LayersOrStates>]: UnionToIntersection<{ [StateOption in LayersOrStates[StateKey]['options'][number]]: { [LayerKey in keyof OmitIndexSignature<LayersOrStates[StateKey]['layers']
|
|
63
|
-
type InferredVariantLevelProperties<Props extends Record<string, SelectedConfigurableProperty<ConfigurablePropertiesName, string>>> = { [PropKey in
|
|
72
|
+
type InferredSchemaMap<VarKey extends string, VarConfig extends VariantConfig, LayersOrStates extends NonNullable<VariantConfigWithComponentStates['componentStates']> | NonNullable<VariantConfigWithProperties['layers']>, Prefix extends string = ''> = LayersOrStates extends NonNullable<VariantConfigWithComponentStates['componentStates']> ? UnionToIntersection<{ [StateKey in keyof OmitIndexSignature<LayersOrStates>]: UnionToIntersection<{ [StateOption in LayersOrStates[StateKey]['options'][number]]: { [LayerKey in Exclude<keyof OmitIndexSignature<LayersOrStates[StateKey]['layers']>, GetExcludedLayersForOption<LayersOrStates[StateKey], StateOption>> as `${Prefix}${VarKey}/${VarConfig['options'][number]}/${StateKey & string}/${StateOption}/${LayerKey & string}`]: InferredLayerPropertiesForOption<LayersOrStates[StateKey]['layers'][LayerKey], GetExcludedPseudoStatesForOption<LayersOrStates[StateKey], StateOption>> } }[LayersOrStates[StateKey]['options'][number]]> }[keyof OmitIndexSignature<LayersOrStates>]> : { [LayerKey in keyof OmitIndexSignature<LayersOrStates> as `${Prefix}${VarKey}/${VarConfig['options'][number]}/${LayerKey & string}`]: InferredLayerProperties<LayersOrStates[LayerKey]> };
|
|
73
|
+
type InferredVariantLevelProperties<Props extends Record<string, SelectedConfigurableProperty<ConfigurablePropertiesName, string>>> = { [PropKey in RequiredInDefaultSchemaPropKeys<Props>]: InferredPropertyStates<Props[PropKey]> } & { [PropKey in OptionalInDefaultSchemaPropKeys<Props>]?: InferredPropertyStates<Props[PropKey]> };
|
|
64
74
|
type InferredVariantPropertiesMap<VarKey extends string, VarConfig extends VariantConfigWithProperties, Prefix extends string = ''> = VarConfig extends {
|
|
65
75
|
variantProperties: infer Props extends Record<string, SelectedConfigurableProperty<ConfigurablePropertiesName, string>>;
|
|
66
76
|
} ? { [Option in VarConfig['options'][number] as `${Prefix}${VarKey}/${Option}`]: InferredVariantLevelProperties<Props> } : {};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
-
import { getExcludedPseudoStatesForComponentStateOption } from "./componentStatePseudoStates.js";
|
|
2
|
+
import { getExcludedLayersForComponentStateOption, getExcludedPseudoStatesForComponentStateOption } from "./componentStatePseudoStates.js";
|
|
3
3
|
import { generateSchemaKey } from "./generateSchemaKey.js";
|
|
4
4
|
import { resolvePropertyStates } from "./resolvePropertyStates.js";
|
|
5
5
|
import { isVariantConfigWithComponentStates, isVariantConfigWithProperties } from "./variantConfigGuards.js";
|
|
@@ -70,6 +70,9 @@ function buildPropertyStateMap(layer, property, variantOption, excludedStates =
|
|
|
70
70
|
function propertyVariesOnlyAtRest(property) {
|
|
71
71
|
return property.name === "textVariant";
|
|
72
72
|
}
|
|
73
|
+
function isOptionalInDefaultSchema(property) {
|
|
74
|
+
return property.optionalInDefaultSchema === true;
|
|
75
|
+
}
|
|
73
76
|
/** Resolves the fixture type by finding which value set contains the given value */
|
|
74
77
|
function findFixtureTypeForValue(property, value) {
|
|
75
78
|
const index = property.values.findIndex((arr) => arr.includes(value));
|
|
@@ -99,6 +102,7 @@ function emitUniversalLayerSchema(result, layers, variantKey, variantOption, sub
|
|
|
99
102
|
result.variables[schemaKey] = {};
|
|
100
103
|
for (const propertyKey in layer.properties) {
|
|
101
104
|
const property = layer.properties[propertyKey];
|
|
105
|
+
if (isOptionalInDefaultSchema(property)) continue;
|
|
102
106
|
result.variables[schemaKey] = {
|
|
103
107
|
...result.variables[schemaKey],
|
|
104
108
|
[propertyKey]: buildPropertyStateMap(layer, property, variantOption)
|
|
@@ -120,22 +124,27 @@ function buildConfigSchema(config) {
|
|
|
120
124
|
const componentStates = variantConfig.componentStates;
|
|
121
125
|
for (const componentStateKey in componentStates) {
|
|
122
126
|
const componentState = componentStates[componentStateKey];
|
|
123
|
-
for (const componentStateOption of componentState.options)
|
|
124
|
-
const
|
|
125
|
-
const
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
result.variables[schemaKey] = {
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
127
|
+
for (const componentStateOption of componentState.options) {
|
|
128
|
+
const excludedLayers = new Set(getExcludedLayersForComponentStateOption(componentState, componentStateOption));
|
|
129
|
+
for (const layerKey in componentState.layers) {
|
|
130
|
+
if (excludedLayers.has(layerKey)) continue;
|
|
131
|
+
const layer = componentState.layers[layerKey];
|
|
132
|
+
const schemaKey = generateSchemaKey({
|
|
133
|
+
variantKey,
|
|
134
|
+
variantValue: variantOption,
|
|
135
|
+
componentStateKey,
|
|
136
|
+
componentStateValue: componentStateOption,
|
|
137
|
+
layer: layerKey
|
|
138
|
+
});
|
|
139
|
+
result.variables[schemaKey] = {};
|
|
140
|
+
for (const propertyKey in layer.properties) {
|
|
141
|
+
const property = layer.properties[propertyKey];
|
|
142
|
+
if (isOptionalInDefaultSchema(property)) continue;
|
|
143
|
+
result.variables[schemaKey] = {
|
|
144
|
+
...result.variables[schemaKey],
|
|
145
|
+
[propertyKey]: buildPropertyStateMap(layer, property, variantOption, getExcludedPseudoStatesForComponentStateOption(componentState, componentStateOption))
|
|
146
|
+
};
|
|
147
|
+
}
|
|
139
148
|
}
|
|
140
149
|
}
|
|
141
150
|
}
|
|
@@ -145,6 +154,7 @@ function buildConfigSchema(config) {
|
|
|
145
154
|
result.variables[variantSchemaKey] = result.variables[variantSchemaKey] ?? {};
|
|
146
155
|
for (const propertyKey in variantConfig.variantProperties) {
|
|
147
156
|
const property = variantConfig.variantProperties[propertyKey];
|
|
157
|
+
if (isOptionalInDefaultSchema(property)) continue;
|
|
148
158
|
result.variables[variantSchemaKey] = {
|
|
149
159
|
...result.variables[variantSchemaKey],
|
|
150
160
|
[propertyKey]: buildPropertyStateMap({
|
|
@@ -167,23 +177,28 @@ function buildConfigSchema(config) {
|
|
|
167
177
|
const componentStates = variantConfig.componentStates;
|
|
168
178
|
for (const componentStateKey in componentStates) {
|
|
169
179
|
const componentState = componentStates[componentStateKey];
|
|
170
|
-
for (const componentStateOption of componentState.options)
|
|
171
|
-
const
|
|
172
|
-
const
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
result.variables[schemaKey] = {
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
180
|
+
for (const componentStateOption of componentState.options) {
|
|
181
|
+
const excludedLayers = new Set(getExcludedLayersForComponentStateOption(componentState, componentStateOption));
|
|
182
|
+
for (const layerKey in componentState.layers) {
|
|
183
|
+
if (excludedLayers.has(layerKey)) continue;
|
|
184
|
+
const layer = componentState.layers[layerKey];
|
|
185
|
+
const schemaKey = generateSchemaKey({
|
|
186
|
+
variantKey,
|
|
187
|
+
variantValue: variantOption,
|
|
188
|
+
componentStateKey,
|
|
189
|
+
componentStateValue: componentStateOption,
|
|
190
|
+
layer: layerKey,
|
|
191
|
+
subComponentName: subComponentKey
|
|
192
|
+
});
|
|
193
|
+
result.variables[schemaKey] = {};
|
|
194
|
+
for (const propertyKey in layer.properties) {
|
|
195
|
+
const property = layer.properties[propertyKey];
|
|
196
|
+
if (isOptionalInDefaultSchema(property)) continue;
|
|
197
|
+
result.variables[schemaKey] = {
|
|
198
|
+
...result.variables[schemaKey],
|
|
199
|
+
[propertyKey]: buildPropertyStateMap(layer, property, variantOption, getExcludedPseudoStatesForComponentStateOption(componentState, componentStateOption))
|
|
200
|
+
};
|
|
201
|
+
}
|
|
187
202
|
}
|
|
188
203
|
}
|
|
189
204
|
}
|
|
@@ -4,6 +4,9 @@
|
|
|
4
4
|
function getExcludedPseudoStatesForComponentStateOption(componentState, componentStateOption) {
|
|
5
5
|
return componentState.excludePseudoStatesForOptions?.[componentStateOption] ?? [];
|
|
6
6
|
}
|
|
7
|
+
function getExcludedLayersForComponentStateOption(componentState, componentStateOption) {
|
|
8
|
+
return componentState.excludeLayersForOptions?.[componentStateOption] ?? [];
|
|
9
|
+
}
|
|
7
10
|
function filterPseudoStatesByExclusion(pseudoStates, excludedPseudoStates) {
|
|
8
11
|
if (!pseudoStates) return [];
|
|
9
12
|
if (excludedPseudoStates.length === 0) return [...pseudoStates];
|
|
@@ -12,4 +15,5 @@ function filterPseudoStatesByExclusion(pseudoStates, excludedPseudoStates) {
|
|
|
12
15
|
}
|
|
13
16
|
//#endregion
|
|
14
17
|
exports.filterPseudoStatesByExclusion = filterPseudoStatesByExclusion;
|
|
18
|
+
exports.getExcludedLayersForComponentStateOption = getExcludedLayersForComponentStateOption;
|
|
15
19
|
exports.getExcludedPseudoStatesForComponentStateOption = getExcludedPseudoStatesForComponentStateOption;
|
|
@@ -4,6 +4,9 @@
|
|
|
4
4
|
function getExcludedPseudoStatesForComponentStateOption(componentState, componentStateOption) {
|
|
5
5
|
return componentState.excludePseudoStatesForOptions?.[componentStateOption] ?? [];
|
|
6
6
|
}
|
|
7
|
+
function getExcludedLayersForComponentStateOption(componentState, componentStateOption) {
|
|
8
|
+
return componentState.excludeLayersForOptions?.[componentStateOption] ?? [];
|
|
9
|
+
}
|
|
7
10
|
function filterPseudoStatesByExclusion(pseudoStates, excludedPseudoStates) {
|
|
8
11
|
if (!pseudoStates) return [];
|
|
9
12
|
if (excludedPseudoStates.length === 0) return [...pseudoStates];
|
|
@@ -11,4 +14,4 @@ function filterPseudoStatesByExclusion(pseudoStates, excludedPseudoStates) {
|
|
|
11
14
|
return pseudoStates.filter((pseudoState) => !excluded.has(pseudoState));
|
|
12
15
|
}
|
|
13
16
|
//#endregion
|
|
14
|
-
export { filterPseudoStatesByExclusion, getExcludedPseudoStatesForComponentStateOption };
|
|
17
|
+
export { filterPseudoStatesByExclusion, getExcludedLayersForComponentStateOption, getExcludedPseudoStatesForComponentStateOption };
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
|
|
2
|
+
const require_index = require("../../../css-tokens/dist/index.cjs");
|
|
3
|
+
const require_mapTextVariantFixtureToValue = require("../mapTextVariantFixtureToValue.cjs");
|
|
4
|
+
const require_properties = require("../properties.cjs");
|
|
5
|
+
const require_iconButtonMatchButtonHeight = require("./iconButtonMatchButtonHeight.cjs");
|
|
6
|
+
//#region ../automated-config/dist/utils/getButtonControlHeight.js
|
|
7
|
+
/*! © 2026 Yahoo, Inc. UDS Default Config v0.0.0-development */
|
|
8
|
+
/** Sizes where IconButton control height should match Button. */
|
|
9
|
+
const SHARED_BUTTON_ICONBUTTON_SIZES = new Set([
|
|
10
|
+
"xs",
|
|
11
|
+
"sm",
|
|
12
|
+
"md",
|
|
13
|
+
"lg"
|
|
14
|
+
]);
|
|
15
|
+
function getButtonIconSizeVar({ schema, iconLayerKey, state, theme }) {
|
|
16
|
+
const iconSizeValue = schema.variables?.[iconLayerKey]?.size?.[state]?.value;
|
|
17
|
+
if (typeof iconSizeValue === "string" && iconSizeValue) return theme(require_properties.configurableProperties.iconSize.twThemePath("iconSizes", iconSizeValue));
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Button content box: max(icon size, text line-height).
|
|
21
|
+
* Matches Figma auto-layout and keeps IconButton height aligned with Button.
|
|
22
|
+
*/
|
|
23
|
+
function getButtonControlContentSize({ schema, rootLayerKey, iconLayerKey, state, theme }) {
|
|
24
|
+
const iconSizeVar = getButtonIconSizeVar({
|
|
25
|
+
schema,
|
|
26
|
+
iconLayerKey,
|
|
27
|
+
state,
|
|
28
|
+
theme
|
|
29
|
+
});
|
|
30
|
+
const textVariantValue = schema.variables?.[rootLayerKey]?.textVariant?.[state]?.value;
|
|
31
|
+
if (iconSizeVar && typeof textVariantValue === "string" && textVariantValue) return `max(${iconSizeVar}, ${theme(require_mapTextVariantFixtureToValue.mapTextVariantFixtureToValue("lineHeight")("textVariants", textVariantValue))})`;
|
|
32
|
+
if (iconSizeVar) return iconSizeVar;
|
|
33
|
+
}
|
|
34
|
+
/** `round(up, …, 1px)` matches Math.ceil in getButtonControlHeightPx and Figma hug height. */
|
|
35
|
+
function formatControlHeightCalc(calcExpression) {
|
|
36
|
+
return `round(up, ${calcExpression}, 1px)`;
|
|
37
|
+
}
|
|
38
|
+
/**
|
|
39
|
+
* Button control height: vertical padding on both sides plus max(icon size, text line-height).
|
|
40
|
+
*/
|
|
41
|
+
function getButtonControlHeight({ paddingVertical, schema, rootLayerKey, iconLayerKey, state, theme }) {
|
|
42
|
+
const contentSize = getButtonControlContentSize({
|
|
43
|
+
schema,
|
|
44
|
+
rootLayerKey,
|
|
45
|
+
iconLayerKey,
|
|
46
|
+
state,
|
|
47
|
+
theme
|
|
48
|
+
});
|
|
49
|
+
if (!contentSize) return;
|
|
50
|
+
return formatControlHeightCalc(`calc(2 * ${paddingVertical} + ${contentSize})`);
|
|
51
|
+
}
|
|
52
|
+
/**
|
|
53
|
+
* IconButton control height: uniform padding plus icon size only (no typography).
|
|
54
|
+
*/
|
|
55
|
+
function getIconButtonControlHeight({ paddingVertical, schema, iconLayerKey, state, theme }) {
|
|
56
|
+
const iconSizeVar = getButtonIconSizeVar({
|
|
57
|
+
schema,
|
|
58
|
+
iconLayerKey,
|
|
59
|
+
state,
|
|
60
|
+
theme
|
|
61
|
+
});
|
|
62
|
+
if (!iconSizeVar) return;
|
|
63
|
+
return formatControlHeightCalc(`calc(2 * ${paddingVertical} + ${iconSizeVar})`);
|
|
64
|
+
}
|
|
65
|
+
/**
|
|
66
|
+
* Layout line-height for button root: max(icon size, text line-height).
|
|
67
|
+
*/
|
|
68
|
+
function getButtonContentLineHeight({ schema, rootLayerKey, iconLayerKey, state, theme }) {
|
|
69
|
+
return getButtonControlContentSize({
|
|
70
|
+
schema,
|
|
71
|
+
rootLayerKey,
|
|
72
|
+
iconLayerKey,
|
|
73
|
+
state,
|
|
74
|
+
theme
|
|
75
|
+
}) ?? "1em";
|
|
76
|
+
}
|
|
77
|
+
function applyButtonControlHeightDeclarations({ cssDeclarations, paddingVertical, schema, rootLayerKey, iconLayerKey, state, theme }) {
|
|
78
|
+
const controlHeight = rootLayerKey ? getButtonControlHeight({
|
|
79
|
+
paddingVertical,
|
|
80
|
+
schema,
|
|
81
|
+
rootLayerKey,
|
|
82
|
+
iconLayerKey,
|
|
83
|
+
state,
|
|
84
|
+
theme
|
|
85
|
+
}) : getIconButtonControlHeight({
|
|
86
|
+
paddingVertical,
|
|
87
|
+
schema,
|
|
88
|
+
iconLayerKey,
|
|
89
|
+
state,
|
|
90
|
+
theme
|
|
91
|
+
});
|
|
92
|
+
if (controlHeight) {
|
|
93
|
+
cssDeclarations[require_index.BUTTON_CONTROL_HEIGHT_VAR] = controlHeight;
|
|
94
|
+
cssDeclarations.height = `var(${require_index.BUTTON_CONTROL_HEIGHT_VAR})`;
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
function applyIconButtonSquareDimensions(cssDeclarations) {
|
|
98
|
+
if (cssDeclarations[require_index.BUTTON_CONTROL_HEIGHT_VAR]) cssDeclarations.width = `var(${require_index.BUTTON_CONTROL_HEIGHT_VAR})`;
|
|
99
|
+
}
|
|
100
|
+
/**
|
|
101
|
+
* IconButton height for xs–lg mirrors Button (padding + max(icon, line-height)).
|
|
102
|
+
* xl uses icon-only height from IconButton tokens.
|
|
103
|
+
*/
|
|
104
|
+
function applyIconButtonControlHeightDeclarations({ cssDeclarations, paddingVertical, iconButtonSchema, buttonHeightReferenceSchema, variantValue, iconLayerKey: _iconLayerKey, state, theme }) {
|
|
105
|
+
if (buttonHeightReferenceSchema && SHARED_BUTTON_ICONBUTTON_SIZES.has(variantValue) && require_iconButtonMatchButtonHeight.isIconButtonMatchButtonHeightEnabled(iconButtonSchema, variantValue)) {
|
|
106
|
+
const buttonRootLayerKey = `size/${variantValue}/root`;
|
|
107
|
+
const buttonIconLayerKey = `size/${variantValue}/icon`;
|
|
108
|
+
const buttonSpacingValue = buttonHeightReferenceSchema.variables?.[buttonRootLayerKey]?.spacingVertical?.[state]?.value;
|
|
109
|
+
applyButtonControlHeightDeclarations({
|
|
110
|
+
cssDeclarations,
|
|
111
|
+
paddingVertical: typeof buttonSpacingValue === "string" && buttonSpacingValue ? theme(require_properties.configurableProperties.spacingVertical.twThemePath("spacingAliases", buttonSpacingValue)) : paddingVertical,
|
|
112
|
+
schema: buttonHeightReferenceSchema,
|
|
113
|
+
rootLayerKey: buttonRootLayerKey,
|
|
114
|
+
iconLayerKey: buttonIconLayerKey,
|
|
115
|
+
state,
|
|
116
|
+
theme
|
|
117
|
+
});
|
|
118
|
+
applyIconButtonSquareDimensions(cssDeclarations);
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
//#endregion
|
|
122
|
+
exports.SHARED_BUTTON_ICONBUTTON_SIZES = SHARED_BUTTON_ICONBUTTON_SIZES;
|
|
123
|
+
exports.applyButtonControlHeightDeclarations = applyButtonControlHeightDeclarations;
|
|
124
|
+
exports.applyIconButtonControlHeightDeclarations = applyIconButtonControlHeightDeclarations;
|
|
125
|
+
exports.getButtonContentLineHeight = getButtonContentLineHeight;
|
|
126
|
+
exports.getButtonControlContentSize = getButtonControlContentSize;
|
|
127
|
+
exports.getButtonControlHeight = getButtonControlHeight;
|
|
128
|
+
exports.getButtonIconSizeVar = getButtonIconSizeVar;
|
|
129
|
+
exports.getIconButtonControlHeight = getIconButtonControlHeight;
|
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
|
|
2
|
+
import { IconButtonMatchButtonHeightConfig } from "./iconButtonMatchButtonHeight.cjs";
|
|
3
|
+
|
|
4
|
+
//#region ../automated-config/dist/utils/getButtonControlHeight.d.ts
|
|
5
|
+
//#region src/utils/getButtonControlHeight.d.ts
|
|
6
|
+
type ThemeFn = (path: string) => string;
|
|
7
|
+
/** Sizes where IconButton control height should match Button. */
|
|
8
|
+
declare const SHARED_BUTTON_ICONBUTTON_SIZES: Set<string>;
|
|
9
|
+
type ButtonControlSchema = IconButtonMatchButtonHeightConfig & {
|
|
10
|
+
variables?: Record<string, Record<string, Record<string, {
|
|
11
|
+
value?: unknown;
|
|
12
|
+
}>>>;
|
|
13
|
+
};
|
|
14
|
+
declare function getButtonIconSizeVar({
|
|
15
|
+
schema,
|
|
16
|
+
iconLayerKey,
|
|
17
|
+
state,
|
|
18
|
+
theme
|
|
19
|
+
}: {
|
|
20
|
+
schema: ButtonControlSchema;
|
|
21
|
+
iconLayerKey: string;
|
|
22
|
+
state: string;
|
|
23
|
+
theme: ThemeFn;
|
|
24
|
+
}): string | undefined;
|
|
25
|
+
/**
|
|
26
|
+
* Button content box: max(icon size, text line-height).
|
|
27
|
+
* Matches Figma auto-layout and keeps IconButton height aligned with Button.
|
|
28
|
+
*/
|
|
29
|
+
declare function getButtonControlContentSize({
|
|
30
|
+
schema,
|
|
31
|
+
rootLayerKey,
|
|
32
|
+
iconLayerKey,
|
|
33
|
+
state,
|
|
34
|
+
theme
|
|
35
|
+
}: {
|
|
36
|
+
schema: ButtonControlSchema;
|
|
37
|
+
rootLayerKey: string;
|
|
38
|
+
iconLayerKey: string;
|
|
39
|
+
state: string;
|
|
40
|
+
theme: ThemeFn;
|
|
41
|
+
}): string | undefined;
|
|
42
|
+
/**
|
|
43
|
+
* Button control height: vertical padding on both sides plus max(icon size, text line-height).
|
|
44
|
+
*/
|
|
45
|
+
declare function getButtonControlHeight({
|
|
46
|
+
paddingVertical,
|
|
47
|
+
schema,
|
|
48
|
+
rootLayerKey,
|
|
49
|
+
iconLayerKey,
|
|
50
|
+
state,
|
|
51
|
+
theme
|
|
52
|
+
}: {
|
|
53
|
+
paddingVertical: string;
|
|
54
|
+
schema: ButtonControlSchema;
|
|
55
|
+
rootLayerKey: string;
|
|
56
|
+
iconLayerKey: string;
|
|
57
|
+
state: string;
|
|
58
|
+
theme: ThemeFn;
|
|
59
|
+
}): string | undefined;
|
|
60
|
+
/**
|
|
61
|
+
* IconButton control height: uniform padding plus icon size only (no typography).
|
|
62
|
+
*/
|
|
63
|
+
declare function getIconButtonControlHeight({
|
|
64
|
+
paddingVertical,
|
|
65
|
+
schema,
|
|
66
|
+
iconLayerKey,
|
|
67
|
+
state,
|
|
68
|
+
theme
|
|
69
|
+
}: {
|
|
70
|
+
paddingVertical: string;
|
|
71
|
+
schema: ButtonControlSchema;
|
|
72
|
+
iconLayerKey: string;
|
|
73
|
+
state: string;
|
|
74
|
+
theme: ThemeFn;
|
|
75
|
+
}): string | undefined;
|
|
76
|
+
/**
|
|
77
|
+
* Layout line-height for button root: max(icon size, text line-height).
|
|
78
|
+
*/
|
|
79
|
+
declare function getButtonContentLineHeight({
|
|
80
|
+
schema,
|
|
81
|
+
rootLayerKey,
|
|
82
|
+
iconLayerKey,
|
|
83
|
+
state,
|
|
84
|
+
theme
|
|
85
|
+
}: {
|
|
86
|
+
schema: ButtonControlSchema;
|
|
87
|
+
rootLayerKey: string;
|
|
88
|
+
iconLayerKey: string;
|
|
89
|
+
state: string;
|
|
90
|
+
theme: ThemeFn;
|
|
91
|
+
}): string;
|
|
92
|
+
declare function applyButtonControlHeightDeclarations({
|
|
93
|
+
cssDeclarations,
|
|
94
|
+
paddingVertical,
|
|
95
|
+
schema,
|
|
96
|
+
rootLayerKey,
|
|
97
|
+
iconLayerKey,
|
|
98
|
+
state,
|
|
99
|
+
theme
|
|
100
|
+
}: {
|
|
101
|
+
cssDeclarations: Record<string, string>;
|
|
102
|
+
paddingVertical: string;
|
|
103
|
+
schema: ButtonControlSchema;
|
|
104
|
+
rootLayerKey?: string;
|
|
105
|
+
iconLayerKey: string;
|
|
106
|
+
state: string;
|
|
107
|
+
theme: ThemeFn;
|
|
108
|
+
}): void;
|
|
109
|
+
/**
|
|
110
|
+
* IconButton height for xs–lg mirrors Button (padding + max(icon, line-height)).
|
|
111
|
+
* xl uses icon-only height from IconButton tokens.
|
|
112
|
+
*/
|
|
113
|
+
declare function applyIconButtonControlHeightDeclarations({
|
|
114
|
+
cssDeclarations,
|
|
115
|
+
paddingVertical,
|
|
116
|
+
iconButtonSchema,
|
|
117
|
+
buttonHeightReferenceSchema,
|
|
118
|
+
variantValue,
|
|
119
|
+
iconLayerKey: _iconLayerKey,
|
|
120
|
+
state,
|
|
121
|
+
theme
|
|
122
|
+
}: {
|
|
123
|
+
cssDeclarations: Record<string, string>;
|
|
124
|
+
paddingVertical: string;
|
|
125
|
+
iconButtonSchema: ButtonControlSchema;
|
|
126
|
+
buttonHeightReferenceSchema?: ButtonControlSchema;
|
|
127
|
+
variantValue: string;
|
|
128
|
+
iconLayerKey: string;
|
|
129
|
+
state: string;
|
|
130
|
+
theme: ThemeFn;
|
|
131
|
+
}): void; //#endregion
|
|
132
|
+
//#endregion
|
|
133
|
+
export { type ButtonControlSchema, SHARED_BUTTON_ICONBUTTON_SIZES, applyButtonControlHeightDeclarations, applyIconButtonControlHeightDeclarations, getButtonContentLineHeight, getButtonControlContentSize, getButtonControlHeight, getButtonIconSizeVar, getIconButtonControlHeight };
|
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
|
|
2
|
+
import { IconButtonMatchButtonHeightConfig } from "./iconButtonMatchButtonHeight.js";
|
|
3
|
+
|
|
4
|
+
//#region ../automated-config/dist/utils/getButtonControlHeight.d.ts
|
|
5
|
+
//#region src/utils/getButtonControlHeight.d.ts
|
|
6
|
+
type ThemeFn = (path: string) => string;
|
|
7
|
+
/** Sizes where IconButton control height should match Button. */
|
|
8
|
+
declare const SHARED_BUTTON_ICONBUTTON_SIZES: Set<string>;
|
|
9
|
+
type ButtonControlSchema = IconButtonMatchButtonHeightConfig & {
|
|
10
|
+
variables?: Record<string, Record<string, Record<string, {
|
|
11
|
+
value?: unknown;
|
|
12
|
+
}>>>;
|
|
13
|
+
};
|
|
14
|
+
declare function getButtonIconSizeVar({
|
|
15
|
+
schema,
|
|
16
|
+
iconLayerKey,
|
|
17
|
+
state,
|
|
18
|
+
theme
|
|
19
|
+
}: {
|
|
20
|
+
schema: ButtonControlSchema;
|
|
21
|
+
iconLayerKey: string;
|
|
22
|
+
state: string;
|
|
23
|
+
theme: ThemeFn;
|
|
24
|
+
}): string | undefined;
|
|
25
|
+
/**
|
|
26
|
+
* Button content box: max(icon size, text line-height).
|
|
27
|
+
* Matches Figma auto-layout and keeps IconButton height aligned with Button.
|
|
28
|
+
*/
|
|
29
|
+
declare function getButtonControlContentSize({
|
|
30
|
+
schema,
|
|
31
|
+
rootLayerKey,
|
|
32
|
+
iconLayerKey,
|
|
33
|
+
state,
|
|
34
|
+
theme
|
|
35
|
+
}: {
|
|
36
|
+
schema: ButtonControlSchema;
|
|
37
|
+
rootLayerKey: string;
|
|
38
|
+
iconLayerKey: string;
|
|
39
|
+
state: string;
|
|
40
|
+
theme: ThemeFn;
|
|
41
|
+
}): string | undefined;
|
|
42
|
+
/**
|
|
43
|
+
* Button control height: vertical padding on both sides plus max(icon size, text line-height).
|
|
44
|
+
*/
|
|
45
|
+
declare function getButtonControlHeight({
|
|
46
|
+
paddingVertical,
|
|
47
|
+
schema,
|
|
48
|
+
rootLayerKey,
|
|
49
|
+
iconLayerKey,
|
|
50
|
+
state,
|
|
51
|
+
theme
|
|
52
|
+
}: {
|
|
53
|
+
paddingVertical: string;
|
|
54
|
+
schema: ButtonControlSchema;
|
|
55
|
+
rootLayerKey: string;
|
|
56
|
+
iconLayerKey: string;
|
|
57
|
+
state: string;
|
|
58
|
+
theme: ThemeFn;
|
|
59
|
+
}): string | undefined;
|
|
60
|
+
/**
|
|
61
|
+
* IconButton control height: uniform padding plus icon size only (no typography).
|
|
62
|
+
*/
|
|
63
|
+
declare function getIconButtonControlHeight({
|
|
64
|
+
paddingVertical,
|
|
65
|
+
schema,
|
|
66
|
+
iconLayerKey,
|
|
67
|
+
state,
|
|
68
|
+
theme
|
|
69
|
+
}: {
|
|
70
|
+
paddingVertical: string;
|
|
71
|
+
schema: ButtonControlSchema;
|
|
72
|
+
iconLayerKey: string;
|
|
73
|
+
state: string;
|
|
74
|
+
theme: ThemeFn;
|
|
75
|
+
}): string | undefined;
|
|
76
|
+
/**
|
|
77
|
+
* Layout line-height for button root: max(icon size, text line-height).
|
|
78
|
+
*/
|
|
79
|
+
declare function getButtonContentLineHeight({
|
|
80
|
+
schema,
|
|
81
|
+
rootLayerKey,
|
|
82
|
+
iconLayerKey,
|
|
83
|
+
state,
|
|
84
|
+
theme
|
|
85
|
+
}: {
|
|
86
|
+
schema: ButtonControlSchema;
|
|
87
|
+
rootLayerKey: string;
|
|
88
|
+
iconLayerKey: string;
|
|
89
|
+
state: string;
|
|
90
|
+
theme: ThemeFn;
|
|
91
|
+
}): string;
|
|
92
|
+
declare function applyButtonControlHeightDeclarations({
|
|
93
|
+
cssDeclarations,
|
|
94
|
+
paddingVertical,
|
|
95
|
+
schema,
|
|
96
|
+
rootLayerKey,
|
|
97
|
+
iconLayerKey,
|
|
98
|
+
state,
|
|
99
|
+
theme
|
|
100
|
+
}: {
|
|
101
|
+
cssDeclarations: Record<string, string>;
|
|
102
|
+
paddingVertical: string;
|
|
103
|
+
schema: ButtonControlSchema;
|
|
104
|
+
rootLayerKey?: string;
|
|
105
|
+
iconLayerKey: string;
|
|
106
|
+
state: string;
|
|
107
|
+
theme: ThemeFn;
|
|
108
|
+
}): void;
|
|
109
|
+
/**
|
|
110
|
+
* IconButton height for xs–lg mirrors Button (padding + max(icon, line-height)).
|
|
111
|
+
* xl uses icon-only height from IconButton tokens.
|
|
112
|
+
*/
|
|
113
|
+
declare function applyIconButtonControlHeightDeclarations({
|
|
114
|
+
cssDeclarations,
|
|
115
|
+
paddingVertical,
|
|
116
|
+
iconButtonSchema,
|
|
117
|
+
buttonHeightReferenceSchema,
|
|
118
|
+
variantValue,
|
|
119
|
+
iconLayerKey: _iconLayerKey,
|
|
120
|
+
state,
|
|
121
|
+
theme
|
|
122
|
+
}: {
|
|
123
|
+
cssDeclarations: Record<string, string>;
|
|
124
|
+
paddingVertical: string;
|
|
125
|
+
iconButtonSchema: ButtonControlSchema;
|
|
126
|
+
buttonHeightReferenceSchema?: ButtonControlSchema;
|
|
127
|
+
variantValue: string;
|
|
128
|
+
iconLayerKey: string;
|
|
129
|
+
state: string;
|
|
130
|
+
theme: ThemeFn;
|
|
131
|
+
}): void; //#endregion
|
|
132
|
+
//#endregion
|
|
133
|
+
export { type ButtonControlSchema, SHARED_BUTTON_ICONBUTTON_SIZES, applyButtonControlHeightDeclarations, applyIconButtonControlHeightDeclarations, getButtonContentLineHeight, getButtonControlContentSize, getButtonControlHeight, getButtonIconSizeVar, getIconButtonControlHeight };
|