Discrepancies with TypeStyle

Hi, I’ve started a very preliminary PR to integrate csstype with TypeStyle at https://github.com/typestyle/typestyle/pull/245. TypeStyle has some of the highest fidelity CSS typings I’ve seen outside of this library, and I want to make sure to capture and work through the differences that exist. To kick things off, here are the properties that TypeStyle has but csstype doesn’t currently:

Properties in typestyle but not csstype:

-apple-trailing-word
-epub-text-emphasis
-epub-text-emphasis-color
-epub-text-emphasis-style
-internal-marquee-direction
-internal-marquee-increment
-internal-marquee-repetition
-internal-marquee-speed
-internal-marquee-style
-moz-min-font-size-ratio
-moz-text-align-last
-moz-text-decoration-color
-moz-text-decoration-line
-moz-text-decoration-style
-moz-top-layer
-ms-align-items
-ms-backface-visibility
-ms-background-position-x
-ms-background-position-y
-ms-behavior
-ms-flex-flow
-ms-flex-grow
-ms-flex-shrink
-ms-flex-wrap
-ms-grid-column
-ms-grid-column-align
-ms-grid-column-span
-ms-grid-row
-ms-grid-row-align
-ms-grid-row-span
-ms-ime-mode
-ms-layout-flow
-ms-layout-grid
-ms-layout-grid-char
-ms-layout-grid-line
-ms-layout-grid-mode
-ms-layout-grid-type
-ms-perspective
-ms-perspective-origin
-ms-perspective-origin-x
-ms-perspective-origin-y
-ms-text-align-last
-ms-text-justify
-ms-text-kashida-space
-ms-text-underline-position
-ms-transform-origin-x
-ms-transform-origin-y
-ms-transform-origin-z
-ms-transform-style
-ms-word-wrap
-ms-zoom
-webkit-animation-trigger
-webkit-appearance
-webkit-color-correction
-webkit-column-fill
-webkit-cursor-visibility
-webkit-flex-align
-webkit-flex-negative
-webkit-flex-positive
-webkit-flex-wrap
-webkit-flow-from
-webkit-flow-into
-webkit-font-size-delta
-webkit-grid
-webkit-grid-area
-webkit-grid-auto-columns
-webkit-grid-auto-flow
-webkit-grid-auto-rows
-webkit-grid-column
-webkit-grid-column-end
-webkit-grid-column-gap
-webkit-grid-column-start
-webkit-grid-gap
-webkit-grid-row
-webkit-grid-row-end
-webkit-grid-row-gap
-webkit-grid-row-start
-webkit-grid-template
-webkit-grid-template-areas
-webkit-grid-template-columns
-webkit-grid-template-rows
-webkit-hyphenate-limit-after
-webkit-hyphenate-limit-before
-webkit-hyphenate-limit-lines
-webkit-initial-letter
-webkit-justify-items
-webkit-justify-self
-webkit-line-align
-webkit-line-grid
-webkit-line-snap
-webkit-mask-size
-webkit-nbsp-mode
-webkit-region-fragment
-webkit-ruby-position
-webkit-text-align-last
-webkit-text-justify
-webkit-text-underline-position
-webkit-text-zoom
alignmentAdjust
backgroundComposite
behavior
borderCornerShape
cue
cueAfter
flexNegative
flexOrder
flexPositive
flowFrom
gridRowPosition
gridRowSpan
hyphenateLimitChars
hyphenateLimitLines
hyphenateLimitZone
layoutGrid
layoutGridChar
layoutGridLine
layoutGridMode
layoutGridType
marqueeDirection
marqueeStyle
overflowStyle
pause
pauseAfter
pauseBefore
regionFragment
restAfter
restBefore
shapeInside
speak
speakAs
textDecorationLineThrough
textDecorationNone
textDecorationOverline
textDecorationUnderline
textHeight
textJustifyTrim
textKashidaSpace
textLineThrough
textLineThroughWidth
textOverline
textOverlineColor
textOverlineMode
textOverlineStyle
textOverlineWidth
transformOriginZ
userFocus
userInput
voiceBalance
voiceDuration
voiceFamily
voicePitch
voiceRange
voiceRate
voiceStress
voiceVolume
wrapFlow
wrapMargin

Where csstype’s properties overlap with typestyle but it’s missing some allowed values:

-moz-appearance: string | number;
-moz-binding: number;
-moz-border-bottom-colors: number;
-moz-border-end-color: number;
-moz-border-end-style: number;
-moz-border-left-colors: number;
-moz-border-right-colors: number;
-moz-border-start-color: number;
-moz-border-start-style: number;
-moz-border-top-colors: number;
-moz-column-count: string;
-moz-column-fill: string | number;
-moz-column-rule-color: number;
-moz-column-rule-style: number;
-moz-float-edge: string | number;
-moz-force-broken-image-icon: string;
-moz-hyphens: string | number;
-moz-image-region: number;
-moz-orient: string | number;
-moz-stack-sizing: string | number;
-moz-text-size-adjust: number;
-moz-user-focus: string | number;
-moz-user-input: string | number;
-moz-user-modify: string | number;
-moz-window-dragging: string | number;
-moz-window-shadow: string | number;
-ms-accelerator: string | number;
-ms-block-progression: string | number;
-ms-content-zoom-chaining: string | number;
-ms-content-zoom-limit-max: number;
-ms-content-zoom-limit-min: number;
-ms-content-zoom-limit: number;
-ms-content-zoom-snap-points: number;
-ms-content-zoom-snap-type: string | number;
-ms-content-zoom-snap: number;
-ms-content-zooming: string | number;
-ms-filter: number;
-ms-flow-from: number;
-ms-flow-into: number;
-ms-high-contrast-adjust: string | number;
-ms-hyphenate-limit-lines: string;
-ms-hyphens: string | number;
-ms-ime-align: string | number;
-ms-line-break: string | number;
-ms-overflow-style: string | number;
-ms-overflow-x: string | number;
-ms-overflow-y: string | number;
-ms-scroll-chaining: string | number;
-ms-scroll-limit: number;
-ms-scroll-rails: string | number;
-ms-scroll-snap-points-x: number;
-ms-scroll-snap-points-y: number;
-ms-scroll-snap-type: string | number;
-ms-scroll-snap-x: number;
-ms-scroll-snap-y: number;
-ms-scroll-translation: string | number;
-ms-scrollbar-3dlight-color: number;
-ms-scrollbar-arrow-color: number;
-ms-scrollbar-base-color: number;
-ms-scrollbar-darkshadow-color: number;
-ms-scrollbar-face-color: number;
-ms-scrollbar-highlight-color: number;
-ms-scrollbar-shadow-color: number;
-ms-scrollbar-track-color: number;
-ms-text-autospace: string | number;
-ms-text-combine-horizontal: number;
-ms-text-overflow: number;
-ms-text-size-adjust: number;
-ms-touch-action: number;
-ms-touch-select: string | number;
-ms-transform: number;
-ms-user-select: contain | all | auto;
-ms-word-break: string | number;
-ms-wrap-flow: string | number;
-ms-wrap-through: string | number;
-ms-writing-mode: string | number;
-webkit-align-content: number;
-webkit-animation-delay: number;
-webkit-animation-direction: number;
-webkit-animation-duration: number;
-webkit-animation-fill-mode: number;
-webkit-animation-name: number;
-webkit-animation-play-state: number;
-webkit-animation-timing-function: number;
-webkit-backdrop-filter: number;
-webkit-backface-visibility: string | number;
-webkit-border-before-color: number;
-webkit-border-before-style: number;
-webkit-box-decoration-break: string | number;
-webkit-box-shadow: number;
-webkit-clip-path: number;
-webkit-column-count: string;
-webkit-column-rule-color: number;
-webkit-column-rule-style: number;
-webkit-column-span: string | number;
-webkit-filter: number;
-webkit-flex-flow: number;
-webkit-font-feature-settings: number;
-webkit-font-kerning: string | number;
-webkit-font-variant-ligatures: number;
-webkit-hyphens: string | number;
-webkit-line-break: string | number;
-webkit-line-clamp: string;
-webkit-mask-clip: number;
-webkit-mask-composite: number;
-webkit-mask-image: number;
-webkit-mask-origin: number;
-webkit-mask-repeat-x: string | number;
-webkit-mask-repeat-y: string | number;
-webkit-mask-repeat: number;
-webkit-mask: number;
-webkit-order: string;
-webkit-scroll-snap-type: string | number;
-webkit-shape-image-threshold: string;
-webkit-shape-outside: number;
-webkit-tap-highlight-color: number;
-webkit-text-combine: number;
-webkit-text-decoration-color: number;
-webkit-text-decoration-line: number;
-webkit-text-decoration-skip: number;
-webkit-text-decoration-style: string | number;
-webkit-text-emphasis-color: number;
-webkit-text-emphasis-position: number;
-webkit-text-emphasis-style: number;
-webkit-text-emphasis: number;
-webkit-text-fill-color: number;
-webkit-text-orientation: string | number;
-webkit-text-size-adjust: number;
-webkit-text-stroke-color: number;
-webkit-touch-callout: string | number;
-webkit-transform-style: string | number;
-webkit-transform: number;
-webkit-transition-delay: number;
-webkit-transition-duration: number;
-webkit-transition-property: number;
-webkit-transition-timing-function: number;
-webkit-transition: number;
-webkit-user-modify: string | number;
-webkit-writing-mode: string | number;
borderBottomStyle: string;
borderLeftStyle: string;
borderRightStyle: string;
borderTopStyle: string;
boxShadow: number;
fontWeight: number;
hyphens: string;
strokeDasharray: number[];
textAlign: justify-all;

[pelotom]

I think all the remaining legitimate value discrepancies are accounted for in separate issues. The rest are where TypeStyle is using too broad of a type, e.g. string when it should be constrained to a small set of literals.

[frenic]

Waw, you’re helping out a lot. I really appreciate it!

Globals are manually defined so I guess I just missed it. I’ll add it.