Open kitsunekyo opened 2 months ago
related to https://github.com/frenic/csstype/issues/176
My expectation would be to either include (string & {})
consistently (eg. in the Globals
type) or provide some sort of configuration option / different import option to decide whether we want to allow strings or not
removing all types that directly allow (string & {})
, or indirectly allow it via for example DataType.Colors
, DataType.FontStretchAbsolute
, DataType.Position<TLength>
, DataType.Dasharray<TLength>
we get 185 types that dont support (string & {})
.
export namespace Property {
export type All = Globals;
export type Appearance = | Globals | DataType.CompatAuto | "auto" | "menulist-button" | "none" | "textfield";
export type BackfaceVisibility = Globals | "hidden" | "visible";
export type BorderBlockEndStyle = Globals | DataType.LineStyle;
export type BorderBlockEndWidth = | Globals | DataType.LineWidth;
export type BorderBlockStartStyle = Globals | DataType.LineStyle;
export type BorderBlockStartWidth = | Globals | DataType.LineWidth;
export type BorderBlockStyle = Globals | DataType.LineStyle;
export type BorderBlockWidth = | Globals | DataType.LineWidth;
export type BorderBottomStyle = Globals | DataType.LineStyle;
export type BorderBottomWidth = | Globals | DataType.LineWidth;
export type BorderCollapse = Globals | "collapse" | "separate";
export type BorderInlineEndStyle = Globals | DataType.LineStyle;
export type BorderInlineEndWidth = | Globals | DataType.LineWidth;
export type BorderInlineStartStyle = Globals | DataType.LineStyle;
export type BorderInlineStartWidth = | Globals | DataType.LineWidth;
export type BorderInlineStyle = Globals | DataType.LineStyle;
export type BorderInlineWidth = | Globals | DataType.LineWidth;
export type BorderLeftStyle = Globals | DataType.LineStyle;
export type BorderLeftWidth = | Globals | DataType.LineWidth;
export type BorderRightStyle = Globals | DataType.LineStyle;
export type BorderRightWidth = | Globals | DataType.LineWidth;
export type BorderTopStyle = Globals | DataType.LineStyle;
export type BorderTopWidth = | Globals | DataType.LineWidth;
export type BoxAlign = | Globals | "baseline" | "center" | "end" | "start" | "stretch";
export type BoxDecorationBreak = Globals | "clone" | "slice";
export type BoxDirection = Globals | "inherit" | "normal" | "reverse";
export type BoxLines = Globals | "multiple" | "single";
export type BoxOrient = | Globals | "block-axis" | "horizontal" | "inherit" | "inline-axis" | "vertical";
export type BoxPack = Globals | "center" | "end" | "justify" | "start";
export type BoxSizing = Globals | "border-box" | "content-box";
export type BreakAfter = | Globals | "all" | "always" | "auto" | "avoid" | "avoid-column" | "avoid-page" | "avoid-region" | "column" | "left" | "page" | "recto" | "region" | "right" | "verso";
export type BreakBefore = | Globals | "all" | "always" | "auto" | "avoid" | "avoid-column" | "avoid-page" | "avoid-region" | "column" | "left" | "page" | "recto" | "region" | "right" | "verso";
export type BreakInside = | Globals | "auto" | "avoid" | "avoid-column" | "avoid-page" | "avoid-region";
export type CaptionSide = | Globals | "block-end" | "block-start" | "bottom" | "inline-end" | "inline-start" | "top";
export type CaretShape = Globals | "auto" | "bar" | "block" | "underscore";
export type Clear = | Globals | "both" | "inline-end" | "inline-start" | "left" | "none" | "right";
export type PrintColorAdjust = Globals | "economy" | "exact";
export type ColumnFill = Globals | "auto" | "balance" | "balance-all";
export type ColumnSpan = Globals | "all" | "none";
export type ColumnWidth = | Globals | TLength | "auto";
export type ContainerType = Globals | "inline-size" | "normal" | "size";
export type ContentVisibility = Globals | "auto" | "hidden" | "visible";
export type Direction = Globals | "ltr" | "rtl";
export type EmptyCells = Globals | "hide" | "show";
export type FlexDirection = | Globals | "column" | "column-reverse" | "row" | "row-reverse";
export type FlexWrap = Globals | "nowrap" | "wrap" | "wrap-reverse";
export type Float = | Globals | "inline-end" | "inline-start" | "left" | "none" | "right";
export type FontKerning = Globals | "auto" | "none" | "normal";
export type FontOpticalSizing = Globals | "auto" | "none";
export type FontSmooth = | Globals | DataType.AbsoluteSize | TLength | "always" | "auto" | "never";
export type FontSynthesisPosition = Globals | "auto" | "none";
export type FontSynthesisSmallCaps = Globals | "auto" | "none";
export type FontSynthesisStyle = Globals | "auto" | "none";
export type FontSynthesisWeight = Globals | "auto" | "none";
export type FontVariantCaps = | Globals | "all-petite-caps" | "all-small-caps" | "normal" | "petite-caps" | "small-caps" | "titling-caps" | "unicase";
export type FontVariantEmoji = | Globals | "emoji" | "normal" | "text" | "unicode";
export type FontVariantPosition = Globals | "normal" | "sub" | "super";
export type FontWeight = | Globals | DataType.FontWeightAbsolute | "bolder" | "lighter";
export type ForcedColorAdjust = Globals | "auto" | "none";
export type GridColumnEnd = Globals | DataType.GridLine;
export type GridColumnStart = Globals | DataType.GridLine;
export type GridRowEnd = Globals | DataType.GridLine;
export type GridRowStart = Globals | DataType.GridLine;
export type Hyphens = Globals | "auto" | "manual" | "none";
export type ImageRendering = | Globals | "-moz-crisp-edges" | "-webkit-optimize-contrast" | "auto" | "crisp-edges" | "pixelated";
export type ImeMode = | Globals | "active" | "auto" | "disabled" | "inactive" | "normal";
export type InputSecurity = Globals | "auto" | "none";
export type Isolation = Globals | "auto" | "isolate";
export type LetterSpacing = | Globals | TLength | "normal";
export type LineBreak = | Globals | "anywhere" | "auto" | "loose" | "normal" | "strict";
export type LineHeightStep = Globals | TLength;
export type ListStylePosition = Globals | "inside" | "outside";
export type MarginTrim = Globals | "all" | "in-flow" | "none";
export type MaskBorderMode = Globals | "alpha" | "luminance";
export type MaskType = Globals | "alpha" | "luminance";
export type MathShift = Globals | "compact" | "normal";
export type MathStyle = Globals | "compact" | "normal";
export type MixBlendMode = Globals | DataType.BlendMode | "plus-lighter";
export type ObjectFit = | Globals | "contain" | "cover" | "fill" | "none" | "scale-down";
export type OutlineOffset = Globals | TLength;
export type OutlineWidth = | Globals | DataType.LineWidth;
export type OverflowAnchor = Globals | "auto" | "none";
export type OverflowBlock = | Globals | "auto" | "clip" | "hidden" | "scroll" | "visible";
export type OverflowClipBox = Globals | "content-box" | "padding-box";
export type OverflowInline = | Globals | "auto" | "clip" | "hidden" | "scroll" | "visible";
export type OverflowWrap = Globals | "anywhere" | "break-word" | "normal";
export type OverflowX = | Globals | "-moz-hidden-unscrollable" | "auto" | "clip" | "hidden" | "scroll" | "visible";
export type OverflowY = | Globals | "-moz-hidden-unscrollable" | "auto" | "clip" | "hidden" | "scroll" | "visible";
export type Overlay = Globals | "auto" | "none";
export type OverscrollBehaviorBlock = Globals | "auto" | "contain" | "none";
export type OverscrollBehaviorInline = Globals | "auto" | "contain" | "none";
export type OverscrollBehaviorX = Globals | "auto" | "contain" | "none";
export type OverscrollBehaviorY = Globals | "auto" | "contain" | "none";
export type PageBreakAfter = | Globals | "always" | "auto" | "avoid" | "left" | "recto" | "right" | "verso";
export type PageBreakBefore = | Globals | "always" | "auto" | "avoid" | "left" | "recto" | "right" | "verso";
export type PageBreakInside = Globals | "auto" | "avoid";
export type Perspective = | Globals | TLength | "none";
export type PointerEvents = | Globals | "all" | "auto" | "fill" | "inherit" | "none" | "painted" | "stroke" | "visible" | "visibleFill" | "visiblePainted" | "visibleStroke";
export type Position = | Globals | "-webkit-sticky" | "absolute" | "fixed" | "relative" | "static" | "sticky";
export type Resize = | Globals | "block" | "both" | "horizontal" | "inline" | "none" | "vertical";
export type RubyAlign = | Globals | "center" | "space-around" | "space-between" | "start";
export type RubyMerge = Globals | "auto" | "collapse" | "separate";
export type ScrollBehavior = Globals | "auto" | "smooth";
export type ScrollMarginBlockEnd = | Globals | TLength;
export type ScrollMarginBlockStart = | Globals | TLength;
export type ScrollMarginBottom = | Globals | TLength;
export type ScrollMarginInlineEnd = | Globals | TLength;
export type ScrollMarginInlineStart = | Globals | TLength;
export type ScrollMarginLeft = Globals | TLength;
export type ScrollMarginRight = | Globals | TLength;
export type ScrollMarginTop = Globals | TLength;
export type ScrollSnapStop = Globals | "always" | "normal";
export type ScrollSnapTypeX = Globals | "mandatory" | "none" | "proximity";
export type ScrollSnapTypeY = Globals | "mandatory" | "none" | "proximity";
export type ScrollbarWidth = Globals | "auto" | "none" | "thin";
export type TableLayout = Globals | "auto" | "fixed";
export type TextAlign = | Globals | "-webkit-match-parent" | "center" | "end" | "justify" | "left" | "match-parent" | "right" | "start";
export type TextAlignLast = | Globals | "auto" | "center" | "end" | "justify" | "left" | "right" | "start";
export type TextDecorationSkipInk = Globals | "all" | "auto" | "none";
export type TextDecorationStyle = | Globals | "dashed" | "dotted" | "double" | "solid" | "wavy";
export type TextJustify = | Globals | "auto" | "inter-character" | "inter-word" | "none";
export type TextOrientation = Globals | "mixed" | "sideways" | "upright";
export type TextRendering = | Globals | "auto" | "geometricPrecision" | "optimizeLegibility" | "optimizeSpeed";
export type TextTransform = | Globals | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "none" | "uppercase";
export type TextWrap = | Globals | "balance" | "nowrap" | "pretty" | "stable" | "wrap";
export type TransformBox = | Globals | "border-box" | "content-box" | "fill-box" | "stroke-box" | "view-box";
export type TransformStyle = Globals | "flat" | "preserve-3d";
export type UnicodeBidi = | Globals | "-moz-isolate" | "-moz-isolate-override" | "-moz-plaintext" | "-webkit-isolate" | "-webkit-isolate-override" | "-webkit-plaintext" | "bidi-override" | "embed" | "isolate" | "isolate-override" | "normal" | "plaintext";
export type UserSelect = | Globals | "-moz-none" | "all" | "auto" | "contain" | "element" | "none" | "text";
export type Visibility = Globals | "collapse" | "hidden" | "visible";
export type WhiteSpaceCollapse = | Globals | "break-spaces" | "collapse" | "discard" | "preserve" | "preserve-breaks" | "preserve-spaces";
export type WordBreak = | Globals | "break-all" | "break-word" | "keep-all" | "normal";
export type WordSpacing = | Globals | TLength | "normal";
export type WordWrap = Globals | "break-word" | "normal";
export type WritingMode = | Globals | "horizontal-tb" | "sideways-lr" | "sideways-rl" | "vertical-lr" | "vertical-rl";
export type MozFloatEdge = | Globals | "border-box" | "content-box" | "margin-box" | "padding-box";
export type MozOrient = | Globals | "block" | "horizontal" | "inline" | "vertical";
export type MozStackSizing = Globals | "ignore" | "stretch-to-fit";
export type MozTextBlink = Globals | "blink" | "none";
export type MozUserFocus = | Globals | "ignore" | "none" | "normal" | "select-after" | "select-all" | "select-before" | "select-menu" | "select-same";
export type MozUserInput = Globals | "auto" | "disabled" | "enabled" | "none";
export type MozUserModify = | Globals | "read-only" | "read-write" | "write-only";
export type MozWindowDragging = Globals | "drag" | "no-drag";
export type MozWindowShadow = | Globals | "default" | "menu" | "none" | "sheet" | "tooltip";
export type MsAccelerator = Globals | "false" | "true";
export type MsBlockProgression = Globals | "bt" | "lr" | "rl" | "tb";
export type MsContentZoomChaining = Globals | "chained" | "none";
export type MsContentZoomSnapType = | Globals | "mandatory" | "none" | "proximity";
export type MsContentZooming = Globals | "none" | "zoom";
export type MsHighContrastAdjust = Globals | "auto" | "none";
export type MsImeAlign = Globals | "after" | "auto";
export type MsOverflowStyle = | Globals | "-ms-autohiding-scrollbar" | "auto" | "none" | "scrollbar";
export type MsScrollChaining = Globals | "chained" | "none";
export type MsScrollLimitXMax = | Globals | TLength | "auto";
export type MsScrollLimitXMin = | Globals | TLength;
export type MsScrollLimitYMax = | Globals | TLength | "auto";
export type MsScrollLimitYMin = | Globals | TLength;
export type MsScrollRails = Globals | "none" | "railed";
export type MsScrollSnapType = Globals | "mandatory" | "none" | "proximity";
export type MsScrollTranslation = Globals | "none" | "vertical-to-horizontal";
export type MsTextAutospace = | Globals | "ideograph-alpha" | "ideograph-numeric" | "ideograph-parenthesis" | "ideograph-space" | "none";
export type MsTouchSelect = Globals | "grippers" | "none";
export type MsUserSelect = Globals | "element" | "none" | "text";
export type MsWrapFlow = | Globals | "auto" | "both" | "clear" | "end" | "maximum" | "start";
export type MsWrapMargin = Globals | TLength;
export type MsWrapThrough = Globals | "none" | "wrap";
export type WebkitMaskRepeatX = | Globals | "no-repeat" | "repeat" | "round" | "space";
export type WebkitMaskRepeatY = | Globals | "no-repeat" | "repeat" | "round" | "space";
export type WebkitOverflowScrolling = Globals | "auto" | "touch";
export type WebkitTextStrokeWidth = | Globals | TLength;
export type WebkitTouchCallout = Globals | "default" | "none";
export type WebkitUserModify = | Globals | "read-only" | "read-write" | "read-write-plaintext-only";
export type ClipRule = Globals | "evenodd" | "nonzero";
export type ColorInterpolation = Globals | "auto" | "linearRGB" | "sRGB";
export type ColorRendering = | Globals | "auto" | "optimizeQuality" | "optimizeSpeed";
export type DominantBaseline = | Globals | "alphabetic" | "auto" | "central" | "hanging" | "ideographic" | "mathematical" | "middle" | "no-change" | "reset-size" | "text-after-edge" | "text-before-edge" | "use-script";
export type Fill = Globals | DataType.Paint;
export type FillRule = Globals | "evenodd" | "nonzero";
export type ShapeRendering = | Globals | "auto" | "crispEdges" | "geometricPrecision" | "optimizeSpeed";
export type Stroke = Globals | DataType.Paint;
export type StrokeLinecap = Globals | "butt" | "round" | "square";
export type StrokeLinejoin = Globals | "bevel" | "miter" | "round";
export type TextAnchor = Globals | "end" | "middle" | "start";
export type VectorEffect = Globals | "non-scaling-stroke" | "none";
}
as outlined here, there are a few generic types like the one below, that allow any (pixel) string or 0 (unitless).
export type WebkitTextStrokeWidth<TLength = (string & {}) | 0> = | Globals | TLength;
filter out generics that default to (string & {})
and we are left with 146 properties that dont support strings.
export namespace Property {
export type All = Globals;
export type Appearance = | Globals | DataType.CompatAuto | "auto" | "menulist-button" | "none" | "textfield";
export type BackfaceVisibility = Globals | "hidden" | "visible";
export type BorderBlockEndStyle = Globals | DataType.LineStyle;
export type BorderBlockStartStyle = Globals | DataType.LineStyle;
export type BorderBlockStyle = Globals | DataType.LineStyle;
export type BorderBottomStyle = Globals | DataType.LineStyle;
export type BorderCollapse = Globals | "collapse" | "separate";
export type BorderInlineEndStyle = Globals | DataType.LineStyle;
export type BorderInlineStartStyle = Globals | DataType.LineStyle;
export type BorderInlineStyle = Globals | DataType.LineStyle;
export type BorderLeftStyle = Globals | DataType.LineStyle;
export type BorderRightStyle = Globals | DataType.LineStyle;
export type BorderTopStyle = Globals | DataType.LineStyle;
export type BoxAlign = | Globals | "baseline" | "center" | "end" | "start" | "stretch";
export type BoxDecorationBreak = Globals | "clone" | "slice";
export type BoxDirection = Globals | "inherit" | "normal" | "reverse";
export type BoxLines = Globals | "multiple" | "single";
export type BoxOrient = | Globals | "block-axis" | "horizontal" | "inherit" | "inline-axis" | "vertical";
export type BoxPack = Globals | "center" | "end" | "justify" | "start";
export type BoxSizing = Globals | "border-box" | "content-box";
export type BreakAfter = | Globals | "all" | "always" | "auto" | "avoid" | "avoid-column" | "avoid-page" | "avoid-region" | "column" | "left" | "page" | "recto" | "region" | "right" | "verso";
export type BreakBefore = | Globals | "all" | "always" | "auto" | "avoid" | "avoid-column" | "avoid-page" | "avoid-region" | "column" | "left" | "page" | "recto" | "region" | "right" | "verso";
export type BreakInside = | Globals | "auto" | "avoid" | "avoid-column" | "avoid-page" | "avoid-region";
export type CaptionSide = | Globals | "block-end" | "block-start" | "bottom" | "inline-end" | "inline-start" | "top";
export type CaretShape = Globals | "auto" | "bar" | "block" | "underscore";
export type Clear = | Globals | "both" | "inline-end" | "inline-start" | "left" | "none" | "right";
export type PrintColorAdjust = Globals | "economy" | "exact";
export type ColumnFill = Globals | "auto" | "balance" | "balance-all";
export type ColumnSpan = Globals | "all" | "none";
export type ContainerType = Globals | "inline-size" | "normal" | "size";
export type ContentVisibility = Globals | "auto" | "hidden" | "visible";
export type Direction = Globals | "ltr" | "rtl";
export type EmptyCells = Globals | "hide" | "show";
export type FlexDirection = | Globals | "column" | "column-reverse" | "row" | "row-reverse";
export type FlexWrap = Globals | "nowrap" | "wrap" | "wrap-reverse";
export type Float = | Globals | "inline-end" | "inline-start" | "left" | "none" | "right";
export type FontKerning = Globals | "auto" | "none" | "normal";
export type FontOpticalSizing = Globals | "auto" | "none";
export type FontSynthesisPosition = Globals | "auto" | "none";
export type FontSynthesisSmallCaps = Globals | "auto" | "none";
export type FontSynthesisStyle = Globals | "auto" | "none";
export type FontSynthesisWeight = Globals | "auto" | "none";
export type FontVariantCaps = | Globals | "all-petite-caps" | "all-small-caps" | "normal" | "petite-caps" | "small-caps" | "titling-caps" | "unicase";
export type FontVariantEmoji = | Globals | "emoji" | "normal" | "text" | "unicode";
export type FontVariantPosition = Globals | "normal" | "sub" | "super";
export type ForcedColorAdjust = Globals | "auto" | "none";
export type Hyphens = Globals | "auto" | "manual" | "none";
export type ImageRendering = | Globals | "-moz-crisp-edges" | "-webkit-optimize-contrast" | "auto" | "crisp-edges" | "pixelated";
export type ImeMode = | Globals | "active" | "auto" | "disabled" | "inactive" | "normal";
export type InputSecurity = Globals | "auto" | "none";
export type Isolation = Globals | "auto" | "isolate";
export type LineBreak = | Globals | "anywhere" | "auto" | "loose" | "normal" | "strict";
export type ListStylePosition = Globals | "inside" | "outside";
export type MarginTrim = Globals | "all" | "in-flow" | "none";
export type MaskBorderMode = Globals | "alpha" | "luminance";
export type MaskType = Globals | "alpha" | "luminance";
export type MathShift = Globals | "compact" | "normal";
export type MathStyle = Globals | "compact" | "normal";
export type MixBlendMode = Globals | DataType.BlendMode | "plus-lighter";
export type ObjectFit = | Globals | "contain" | "cover" | "fill" | "none" | "scale-down";
export type OverflowAnchor = Globals | "auto" | "none";
export type OverflowBlock = | Globals | "auto" | "clip" | "hidden" | "scroll" | "visible";
export type OverflowClipBox = Globals | "content-box" | "padding-box";
export type OverflowInline = | Globals | "auto" | "clip" | "hidden" | "scroll" | "visible";
export type OverflowWrap = Globals | "anywhere" | "break-word" | "normal";
export type OverflowX = | Globals | "-moz-hidden-unscrollable" | "auto" | "clip" | "hidden" | "scroll" | "visible";
export type OverflowY = | Globals | "-moz-hidden-unscrollable" | "auto" | "clip" | "hidden" | "scroll" | "visible";
export type Overlay = Globals | "auto" | "none";
export type OverscrollBehaviorBlock = Globals | "auto" | "contain" | "none";
export type OverscrollBehaviorInline = Globals | "auto" | "contain" | "none";
export type OverscrollBehaviorX = Globals | "auto" | "contain" | "none";
export type OverscrollBehaviorY = Globals | "auto" | "contain" | "none";
export type PageBreakAfter = | Globals | "always" | "auto" | "avoid" | "left" | "recto" | "right" | "verso";
export type PageBreakBefore = | Globals | "always" | "auto" | "avoid" | "left" | "recto" | "right" | "verso";
export type PageBreakInside = Globals | "auto" | "avoid";
export type PointerEvents = | Globals | "all" | "auto" | "fill" | "inherit" | "none" | "painted" | "stroke" | "visible" | "visibleFill" | "visiblePainted" | "visibleStroke";
export type Position = | Globals | "-webkit-sticky" | "absolute" | "fixed" | "relative" | "static" | "sticky";
export type Resize = | Globals | "block" | "both" | "horizontal" | "inline" | "none" | "vertical";
export type RubyAlign = | Globals | "center" | "space-around" | "space-between" | "start";
export type RubyMerge = Globals | "auto" | "collapse" | "separate";
export type ScrollBehavior = Globals | "auto" | "smooth";
export type ScrollSnapStop = Globals | "always" | "normal";
export type ScrollSnapTypeX = Globals | "mandatory" | "none" | "proximity";
export type ScrollSnapTypeY = Globals | "mandatory" | "none" | "proximity";
export type ScrollbarWidth = Globals | "auto" | "none" | "thin";
export type TableLayout = Globals | "auto" | "fixed";
export type TextAlign = | Globals | "-webkit-match-parent" | "center" | "end" | "justify" | "left" | "match-parent" | "right" | "start";
export type TextAlignLast = | Globals | "auto" | "center" | "end" | "justify" | "left" | "right" | "start";
export type TextDecorationSkipInk = Globals | "all" | "auto" | "none";
export type TextDecorationStyle = | Globals | "dashed" | "dotted" | "double" | "solid" | "wavy";
export type TextJustify = | Globals | "auto" | "inter-character" | "inter-word" | "none";
export type TextOrientation = Globals | "mixed" | "sideways" | "upright";
export type TextRendering = | Globals | "auto" | "geometricPrecision" | "optimizeLegibility" | "optimizeSpeed";
export type TextTransform = | Globals | "capitalize" | "full-size-kana" | "full-width" | "lowercase" | "none" | "uppercase";
export type TextWrap = | Globals | "balance" | "nowrap" | "pretty" | "stable" | "wrap";
export type TransformBox = | Globals | "border-box" | "content-box" | "fill-box" | "stroke-box" | "view-box";
export type TransformStyle = Globals | "flat" | "preserve-3d";
export type UnicodeBidi = | Globals | "-moz-isolate" | "-moz-isolate-override" | "-moz-plaintext" | "-webkit-isolate" | "-webkit-isolate-override" | "-webkit-plaintext" | "bidi-override" | "embed" | "isolate" | "isolate-override" | "normal" | "plaintext";
export type UserSelect = | Globals | "-moz-none" | "all" | "auto" | "contain" | "element" | "none" | "text";
export type Visibility = Globals | "collapse" | "hidden" | "visible";
export type WhiteSpaceCollapse = | Globals | "break-spaces" | "collapse" | "discard" | "preserve" | "preserve-breaks" | "preserve-spaces";
export type WordBreak = | Globals | "break-all" | "break-word" | "keep-all" | "normal";
export type WordWrap = Globals | "break-word" | "normal";
export type WritingMode = | Globals | "horizontal-tb" | "sideways-lr" | "sideways-rl" | "vertical-lr" | "vertical-rl";
export type MozFloatEdge = | Globals | "border-box" | "content-box" | "margin-box" | "padding-box";
export type MozOrient = | Globals | "block" | "horizontal" | "inline" | "vertical";
export type MozStackSizing = Globals | "ignore" | "stretch-to-fit";
export type MozTextBlink = Globals | "blink" | "none";
export type MozUserFocus = | Globals | "ignore" | "none" | "normal" | "select-after" | "select-all" | "select-before" | "select-menu" | "select-same";
export type MozUserInput = Globals | "auto" | "disabled" | "enabled" | "none";
export type MozUserModify = | Globals | "read-only" | "read-write" | "write-only";
export type MozWindowDragging = Globals | "drag" | "no-drag";
export type MozWindowShadow = | Globals | "default" | "menu" | "none" | "sheet" | "tooltip";
export type MsAccelerator = Globals | "false" | "true";
export type MsBlockProgression = Globals | "bt" | "lr" | "rl" | "tb";
export type MsContentZoomChaining = Globals | "chained" | "none";
export type MsContentZoomSnapType = | Globals | "mandatory" | "none" | "proximity";
export type MsContentZooming = Globals | "none" | "zoom";
export type MsHighContrastAdjust = Globals | "auto" | "none";
export type MsImeAlign = Globals | "after" | "auto";
export type MsOverflowStyle = | Globals | "-ms-autohiding-scrollbar" | "auto" | "none" | "scrollbar";
export type MsScrollChaining = Globals | "chained" | "none";
export type MsScrollRails = Globals | "none" | "railed";
export type MsScrollSnapType = Globals | "mandatory" | "none" | "proximity";
export type MsScrollTranslation = Globals | "none" | "vertical-to-horizontal";
export type MsTextAutospace = | Globals | "ideograph-alpha" | "ideograph-numeric" | "ideograph-parenthesis" | "ideograph-space" | "none";
export type MsTouchSelect = Globals | "grippers" | "none";
export type MsUserSelect = Globals | "element" | "none" | "text";
export type MsWrapFlow = | Globals | "auto" | "both" | "clear" | "end" | "maximum" | "start";
export type MsWrapThrough = Globals | "none" | "wrap";
export type WebkitMaskRepeatX = | Globals | "no-repeat" | "repeat" | "round" | "space";
export type WebkitMaskRepeatY = | Globals | "no-repeat" | "repeat" | "round" | "space";
export type WebkitOverflowScrolling = Globals | "auto" | "touch";
export type WebkitTouchCallout = Globals | "default" | "none";
export type WebkitUserModify = | Globals | "read-only" | "read-write" | "read-write-plaintext-only";
export type ClipRule = Globals | "evenodd" | "nonzero";
export type ColorInterpolation = Globals | "auto" | "linearRGB" | "sRGB";
export type ColorRendering = | Globals | "auto" | "optimizeQuality" | "optimizeSpeed";
export type DominantBaseline = | Globals | "alphabetic" | "auto" | "central" | "hanging" | "ideographic" | "mathematical" | "middle" | "no-change" | "reset-size" | "text-after-edge" | "text-before-edge" | "use-script";
export type FillRule = Globals | "evenodd" | "nonzero";
export type ShapeRendering = | Globals | "auto" | "crispEdges" | "geometricPrecision" | "optimizeSpeed";
export type StrokeLinecap = Globals | "butt" | "round" | "square";
export type StrokeLinejoin = Globals | "bevel" | "miter" | "round";
export type TextAnchor = Globals | "end" | "middle" | "start";
export type VectorEffect = Globals | "non-scaling-stroke" | "none";
}
that by design excludes just these properties from using css custom properties. why not include general support then through Globals
?
the recommended approach from the docs seems fairly unnecessary, considering we only protect 146 properties (compared to the amount of other properties).
We're using css-custom-properties in combination with typescript-design tokens quite heavily for our library. I have found that some properties include
(string & {})
, while others don't.Comparing
TextDecoration
withTextTransform
, the latter does not include(string & {})
. Same for some other properties likeTextWrap
,TextRendering
,TextJustify
...Is there any logic as to why every other property supports strings while the others don't?