diff --git a/packages/jsx-typings/README.md b/packages/jsx-typings/README.md new file mode 100644 index 00000000000..2f084bf8eb7 --- /dev/null +++ b/packages/jsx-typings/README.md @@ -0,0 +1 @@ +# @vue/jsx-typings \ No newline at end of file diff --git a/packages/jsx-typings/index.d.ts b/packages/jsx-typings/index.d.ts new file mode 100644 index 00000000000..8748c4f661f --- /dev/null +++ b/packages/jsx-typings/index.d.ts @@ -0,0 +1,1337 @@ +import { Ref, ComponentPublicInstance } from '@vue/runtime-core' + +// This code is based on react definition in DefinitelyTyped published under the MIT license. +// Repository: https://github.com/DefinitelyTyped/DefinitelyTyped +// Path in the repository: types/react/index.d.ts +// +// Copyrights of original definition are: +// AssureSign +// Microsoft +// John Reilly +// Benoit Benezech +// Patricio Zavolinsky +// Digiguru +// Eric Anderson +// Dovydas Navickas +// Josh Rutherford +// Guilherme Hübner +// Ferdy Budhidharma +// Johann Rakotoharisoa +// Olivier Pascal +// Martin Hochel +// Frank Li +// Jessica Franco +// Saransh Kataria +// Kanitkorn Sujautra +// Sebastian Silbermann + +import * as CSS from 'csstype' + +export interface CSSProperties extends CSS.Properties { + /** + * The index signature was removed to enable closed typing for style + * using CSSType. You're able to use type assertion or module augmentation + * to add properties or an index signature of your own. + * + * For examples and more information, visit: + * https://github.com/frenic/csstype#what-should-i-do-when-i-get-type-errors + */ +} + +type Booleanish = boolean | 'true' | 'false' + +// All the WAI-ARIA 1.1 attributes from https://www.w3.org/TR/wai-aria-1.1/ +interface AriaAttributes { + /** Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application. */ + 'aria-activedescendant'?: string + /** Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute. */ + 'aria-atomic'?: boolean | 'false' | 'true' + /** + * Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be + * presented if they are made. + */ + 'aria-autocomplete'?: 'none' | 'inline' | 'list' | 'both' + /** Indicates an element is being modified and that assistive technologies MAY want to wait until the modifications are complete before exposing them to the user. */ + 'aria-busy'?: boolean | 'false' | 'true' + /** + * Indicates the current "checked" state of checkboxes, radio buttons, and other widgets. + * @see aria-pressed @see aria-selected. + */ + 'aria-checked'?: boolean | 'false' | 'mixed' | 'true' + /** + * Defines the total number of columns in a table, grid, or treegrid. + * @see aria-colindex. + */ + 'aria-colcount'?: number + /** + * Defines an element's column index or position with respect to the total number of columns within a table, grid, or treegrid. + * @see aria-colcount @see aria-colspan. + */ + 'aria-colindex'?: number + /** + * Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid. + * @see aria-colindex @see aria-rowspan. + */ + 'aria-colspan'?: number + /** + * Identifies the element (or elements) whose contents or presence are controlled by the current element. + * @see aria-owns. + */ + 'aria-controls'?: string + /** Indicates the element that represents the current item within a container or set of related elements. */ + 'aria-current'?: + | boolean + | 'false' + | 'true' + | 'page' + | 'step' + | 'location' + | 'date' + | 'time' + /** + * Identifies the element (or elements) that describes the object. + * @see aria-labelledby + */ + 'aria-describedby'?: string + /** + * Identifies the element that provides a detailed, extended description for the object. + * @see aria-describedby. + */ + 'aria-details'?: string + /** + * Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable. + * @see aria-hidden @see aria-readonly. + */ + 'aria-disabled'?: boolean | 'false' | 'true' + /** + * Indicates what functions can be performed when a dragged object is released on the drop target. + * @deprecated in ARIA 1.1 + */ + 'aria-dropeffect'?: 'none' | 'copy' | 'execute' | 'link' | 'move' | 'popup' + /** + * Identifies the element that provides an error message for the object. + * @see aria-invalid @see aria-describedby. + */ + 'aria-errormessage'?: string + /** Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. */ + 'aria-expanded'?: boolean | 'false' | 'true' + /** + * Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, + * allows assistive technology to override the general default of reading in document source order. + */ + 'aria-flowto'?: string + /** + * Indicates an element's "grabbed" state in a drag-and-drop operation. + * @deprecated in ARIA 1.1 + */ + 'aria-grabbed'?: boolean | 'false' | 'true' + /** Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element. */ + 'aria-haspopup'?: + | boolean + | 'false' + | 'true' + | 'menu' + | 'listbox' + | 'tree' + | 'grid' + | 'dialog' + /** + * Indicates whether the element is exposed to an accessibility API. + * @see aria-disabled. + */ + 'aria-hidden'?: boolean | 'false' | 'true' + /** + * Indicates the entered value does not conform to the format expected by the application. + * @see aria-errormessage. + */ + 'aria-invalid'?: boolean | 'false' | 'true' | 'grammar' | 'spelling' + /** Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element. */ + 'aria-keyshortcuts'?: string + /** + * Defines a string value that labels the current element. + * @see aria-labelledby. + */ + 'aria-label'?: string + /** + * Identifies the element (or elements) that labels the current element. + * @see aria-describedby. + */ + 'aria-labelledby'?: string + /** Defines the hierarchical level of an element within a structure. */ + 'aria-level'?: number + /** Indicates that an element will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. */ + 'aria-live'?: 'off' | 'assertive' | 'polite' + /** Indicates whether an element is modal when displayed. */ + 'aria-modal'?: boolean | 'false' | 'true' + /** Indicates whether a text box accepts multiple lines of input or only a single line. */ + 'aria-multiline'?: boolean | 'false' | 'true' + /** Indicates that the user may select more than one item from the current selectable descendants. */ + 'aria-multiselectable'?: boolean | 'false' | 'true' + /** Indicates whether the element's orientation is horizontal, vertical, or unknown/ambiguous. */ + 'aria-orientation'?: 'horizontal' | 'vertical' + /** + * Identifies an element (or elements) in order to define a visual, functional, or contextual parent/child relationship + * between DOM elements where the DOM hierarchy cannot be used to represent the relationship. + * @see aria-controls. + */ + 'aria-owns'?: string + /** + * Defines a short hint (a word or short phrase) intended to aid the user with data entry when the control has no value. + * A hint could be a sample value or a brief description of the expected format. + */ + 'aria-placeholder'?: string + /** + * Defines an element's number or position in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM. + * @see aria-setsize. + */ + 'aria-posinset'?: number + /** + * Indicates the current "pressed" state of toggle buttons. + * @see aria-checked @see aria-selected. + */ + 'aria-pressed'?: boolean | 'false' | 'mixed' | 'true' + /** + * Indicates that the element is not editable, but is otherwise operable. + * @see aria-disabled. + */ + 'aria-readonly'?: boolean | 'false' | 'true' + /** + * Indicates what notifications the user agent will trigger when the accessibility tree within a live region is modified. + * @see aria-atomic. + */ + 'aria-relevant'?: 'additions' | 'additions text' | 'all' | 'removals' | 'text' + /** Indicates that user input is required on the element before a form may be submitted. */ + 'aria-required'?: boolean | 'false' | 'true' + /** Defines a human-readable, author-localized description for the role of an element. */ + 'aria-roledescription'?: string + /** + * Defines the total number of rows in a table, grid, or treegrid. + * @see aria-rowindex. + */ + 'aria-rowcount'?: number + /** + * Defines an element's row index or position with respect to the total number of rows within a table, grid, or treegrid. + * @see aria-rowcount @see aria-rowspan. + */ + 'aria-rowindex'?: number + /** + * Defines the number of rows spanned by a cell or gridcell within a table, grid, or treegrid. + * @see aria-rowindex @see aria-colspan. + */ + 'aria-rowspan'?: number + /** + * Indicates the current "selected" state of various widgets. + * @see aria-checked @see aria-pressed. + */ + 'aria-selected'?: boolean | 'false' | 'true' + /** + * Defines the number of items in the current set of listitems or treeitems. Not required if all elements in the set are present in the DOM. + * @see aria-posinset. + */ + 'aria-setsize'?: number + /** Indicates if items in a table or grid are sorted in ascending or descending order. */ + 'aria-sort'?: 'none' | 'ascending' | 'descending' | 'other' + /** Defines the maximum allowed value for a range widget. */ + 'aria-valuemax'?: number + /** Defines the minimum allowed value for a range widget. */ + 'aria-valuemin'?: number + /** + * Defines the current value for a range widget. + * @see aria-valuetext. + */ + 'aria-valuenow'?: number + /** Defines the human readable text alternative of aria-valuenow for a range widget. */ + 'aria-valuetext'?: string +} + +export interface HTMLAttributes extends AriaAttributes { + domPropsInnerHTML?: string + + class?: any + style?: string | CSSProperties + + // Standard HTML Attributes + accesskey?: string + contenteditable?: Booleanish | 'inherit' + contextmenu?: string + dir?: string + draggable?: Booleanish + hidden?: boolean + id?: string + lang?: string + placeholder?: string + spellcheck?: Booleanish + tabindex?: number + title?: string + translate?: 'yes' | 'no' + + // Unknown + radiogroup?: string // , + + // WAI-ARIA + role?: string + + // RDFa Attributes + about?: string + datatype?: string + inlist?: any + prefix?: string + property?: string + resource?: string + typeof?: string + vocab?: string + + // Non-standard Attributes + autocapitalize?: string + autocorrect?: string + autocave?: string + color?: string + itemprop?: string + itemscope?: boolean + itemtype?: string + itemid?: string + itemref?: string + results?: number + security?: string + unselectable?: 'on' | 'off' + + // Living Standard + /** + * Hints at the type of data that might be entered by the user while editing the element or its contents + * @see https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute + */ + inputmode?: + | 'none' + | 'text' + | 'tel' + | 'url' + | 'email' + | 'numeric' + | 'decimal' + | 'search' + /** + * Specify that a standard HTML element should behave like a defined custom built-in element + * @see https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is + */ + is?: string +} + +export interface AnchorHTMLAttributes extends HTMLAttributes { + download?: any + href?: string + hreflang?: string + media?: string + ping?: string + rel?: string + target?: string + type?: string + referrerpolicy?: string +} + +export interface AreaHTMLAttributes extends HTMLAttributes { + alt?: string + coords?: string + download?: any + href?: string + hreflang?: string + media?: string + rel?: string + shape?: string + target?: string +} + +export interface AudioHTMLAttributes extends MediaHTMLAttributes {} + +export interface BaseHTMLAttributes extends HTMLAttributes { + href?: string + target?: string +} + +export interface BlockquoteHTMLAttributes extends HTMLAttributes { + cite?: string +} + +export interface ButtonHTMLAttributes extends HTMLAttributes { + autofocus?: boolean + disabled?: boolean + form?: string + formaction?: string + formenctype?: string + formmethod?: string + formnovalidate?: boolean + formtarget?: string + name?: string + type?: 'submit' | 'reset' | 'button' + value?: string | string[] | number +} + +export interface CanvasHTMLAttributes extends HTMLAttributes { + height?: number | string + width?: number | string +} + +export interface ColHTMLAttributes extends HTMLAttributes { + span?: number + width?: number | string +} + +export interface ColgroupHTMLAttributes extends HTMLAttributes { + span?: number +} + +export interface DataHTMLAttributes extends HTMLAttributes { + value?: string | string[] | number +} + +export interface DetailsHTMLAttributes extends HTMLAttributes { + open?: boolean +} + +export interface DelHTMLAttributes extends HTMLAttributes { + cite?: string + datetime?: string +} + +export interface DialogHTMLAttributes extends HTMLAttributes { + open?: boolean +} + +export interface EmbedHTMLAttributes extends HTMLAttributes { + height?: number | string + src?: string + type?: string + width?: number | string +} + +export interface FieldsetHTMLAttributes extends HTMLAttributes { + disabled?: boolean + form?: string + name?: string +} + +export interface FormHTMLAttributes extends HTMLAttributes { + acceptcharset?: string + action?: string + autocomplete?: string + enctype?: string + method?: string + name?: string + novalidate?: boolean + target?: string +} + +export interface HtmlHTMLAttributes extends HTMLAttributes { + manifest?: string +} + +export interface IframeHTMLAttributes extends HTMLAttributes { + allow?: string + allowfullscreen?: boolean + allowtransparency?: boolean + frameborder?: number | string + height?: number | string + marginheight?: number + marginwidth?: number + name?: string + referrerpolicy?: string + sandbox?: string + scrolling?: string + seamless?: boolean + src?: string + srcdoc?: string + width?: number | string +} + +export interface ImgHTMLAttributes extends HTMLAttributes { + alt?: string + crossorigin?: 'anonymous' | 'use-credentials' | '' + decoding?: 'async' | 'auto' | 'sync' + height?: number | string + sizes?: string + src?: string + srcset?: string + usemap?: string + width?: number | string +} + +export interface InsHTMLAttributes extends HTMLAttributes { + cite?: string + datetime?: string +} + +export interface InputHTMLAttributes extends HTMLAttributes { + accept?: string + alt?: string + autocomplete?: string + autofocus?: boolean + capture?: boolean // https://www.w3.org/tr/html-media-capture/#the-capture-attribute + checked?: boolean + crossorigin?: string + disabled?: boolean + form?: string + formaction?: string + formenctype?: string + formmethod?: string + formnovalidate?: boolean + formtarget?: string + height?: number | string + list?: string + max?: number | string + maxlength?: number + min?: number | string + minlength?: number + multiple?: boolean + name?: string + pattern?: string + placeholder?: string + readonly?: boolean + required?: boolean + size?: number + src?: string + step?: number | string + type?: string + value?: string | string[] | number + width?: number | string +} + +export interface KeygenHTMLAttributes extends HTMLAttributes { + autofocus?: boolean + challenge?: string + disabled?: boolean + form?: string + keytype?: string + keyparams?: string + name?: string +} + +export interface LabelHTMLAttributes extends HTMLAttributes { + for?: string + form?: string +} + +export interface LiHTMLAttributes extends HTMLAttributes { + value?: string | string[] | number +} + +export interface LinkHTMLAttributes extends HTMLAttributes { + as?: string + crossorigin?: string + href?: string + hreflang?: string + integrity?: string + media?: string + rel?: string + sizes?: string + type?: string +} + +export interface MapHTMLAttributes extends HTMLAttributes { + name?: string +} + +export interface MenuHTMLAttributes extends HTMLAttributes { + type?: string +} + +export interface MediaHTMLAttributes extends HTMLAttributes { + autoplay?: boolean + controls?: boolean + controlslist?: string + crossorigin?: string + loop?: boolean + mediagroup?: string + muted?: boolean + playsinline?: boolean + preload?: string + src?: string +} + +export interface MetaHTMLAttributes extends HTMLAttributes { + charset?: string + content?: string + httpequiv?: string + name?: string +} + +export interface MeterHTMLAttributes extends HTMLAttributes { + form?: string + high?: number + low?: number + max?: number | string + min?: number | string + optimum?: number + value?: string | string[] | number +} + +export interface QuoteHTMLAttributes extends HTMLAttributes { + cite?: string +} + +export interface ObjectHTMLAttributes extends HTMLAttributes { + classid?: string + data?: string + form?: string + height?: number | string + name?: string + type?: string + usemap?: string + width?: number | string + wmode?: string +} + +export interface OlHTMLAttributes extends HTMLAttributes { + reversed?: boolean + start?: number + type?: '1' | 'a' | 'A' | 'i' | 'I' +} + +export interface OptgroupHTMLAttributes extends HTMLAttributes { + disabled?: boolean + label?: string +} + +export interface OptionHTMLAttributes extends HTMLAttributes { + disabled?: boolean + label?: string + selected?: boolean + value?: string | string[] | number +} + +export interface OutputHTMLAttributes extends HTMLAttributes { + for?: string + form?: string + name?: string +} + +export interface ParamHTMLAttributes extends HTMLAttributes { + name?: string + value?: string | string[] | number +} + +export interface ProgressHTMLAttributes extends HTMLAttributes { + max?: number | string + value?: string | string[] | number +} + +export interface ScriptHTMLAttributes extends HTMLAttributes { + async?: boolean + charset?: string + crossorigin?: string + defer?: boolean + integrity?: string + nomodule?: boolean + nonce?: string + src?: string + type?: string +} + +export interface SelectHTMLAttributes extends HTMLAttributes { + autocomplete?: string + autofocus?: boolean + disabled?: boolean + form?: string + multiple?: boolean + name?: string + required?: boolean + size?: number + value?: string | string[] | number +} + +export interface SourceHTMLAttributes extends HTMLAttributes { + media?: string + sizes?: string + src?: string + srcset?: string + type?: string +} + +export interface StyleHTMLAttributes extends HTMLAttributes { + media?: string + nonce?: string + scoped?: boolean + type?: string +} + +export interface TableHTMLAttributes extends HTMLAttributes { + cellpadding?: number | string + cellspacing?: number | string + summary?: string +} + +export interface TextareaHTMLAttributes extends HTMLAttributes { + autocomplete?: string + autofocus?: boolean + cols?: number + dirname?: string + disabled?: boolean + form?: string + maxlength?: number + minlength?: number + name?: string + placeholder?: string + readonly?: boolean + required?: boolean + rows?: number + value?: string | string[] | number + wrap?: string +} + +export interface TdHTMLAttributes extends HTMLAttributes { + align?: 'left' | 'center' | 'right' | 'justify' | 'char' + colspan?: number + headers?: string + rowspan?: number + scope?: string + valign?: 'top' | 'middle' | 'bottom' | 'baseline' +} + +export interface ThHTMLAttributes extends HTMLAttributes { + align?: 'left' | 'center' | 'right' | 'justify' | 'char' + colspan?: number + headers?: string + rowspan?: number + scope?: string +} + +export interface TimeHTMLAttributes extends HTMLAttributes { + datetime?: string +} + +export interface TrackHTMLAttributes extends HTMLAttributes { + default?: boolean + kind?: string + label?: string + src?: string + srclang?: string +} + +export interface VideoHTMLAttributes extends MediaHTMLAttributes { + height?: number | string + playsinline?: boolean + poster?: string + width?: number | string + disablePictureInPicture?: boolean +} + +export interface WebViewHTMLAttributes extends HTMLAttributes { + allowfullscreen?: boolean + allowpopups?: boolean + autoFocus?: boolean + autosize?: boolean + blinkfeatures?: string + disableblinkfeatures?: string + disableguestresize?: boolean + disablewebsecurity?: boolean + guestinstance?: string + httpreferrer?: string + nodeintegration?: boolean + partition?: string + plugins?: boolean + preload?: string + src?: string + useragent?: string + webpreferences?: string +} + +export interface SVGAttributes extends AriaAttributes { + domPropsInnerHTML?: string + + color?: string + height?: number | string + id?: string + lang?: string + max?: number | string + media?: string + method?: string + min?: number | string + name?: string + target?: string + type?: string + width?: number | string + + // Other HTML properties supported by SVG elements in browsers + role?: string + tabindex?: number + + // SVG Specific attributes + 'accent-height'?: number | string + accumulate?: 'none' | 'sum' + additive?: 'replace' | 'sum' + 'alignment-baseline'?: + | 'auto' + | 'baseline' + | 'before-edge' + | 'text-before-edge' + | 'middle' + | 'central' + | 'after-edge' + | 'text-after-edge' + | 'ideographic' + | 'alphabetic' + | 'hanging' + | 'mathematical' + | 'inherit' + allowReorder?: 'no' | 'yes' + alphabetic?: number | string + amplitude?: number | string + 'arabic-form'?: 'initial' | 'medial' | 'terminal' | 'isolated' + ascent?: number | string + attributeName?: string + attributeType?: string + autoReverse?: number | string + azimuth?: number | string + baseFrequency?: number | string + 'baseline-shift'?: number | string + baseProfile?: number | string + bbox?: number | string + begin?: number | string + bias?: number | string + by?: number | string + calcMode?: number | string + 'cap-height'?: number | string + clip?: number | string + 'clip-path'?: string + clipPathUnits?: number | string + 'clip-rule'?: number | string + 'color-interpolation'?: number | string + 'color-interpolation-filters'?: 'auto' | 'sRGB' | 'linearRGB' | 'inherit' + 'color-profile'?: number | string + 'color-rendering'?: number | string + contentScriptType?: number | string + contentStyleType?: number | string + cursor?: number | string + cx?: number | string + cy?: number | string + d?: string + decelerate?: number | string + descent?: number | string + diffuseConstant?: number | string + direction?: number | string + display?: number | string + divisor?: number | string + 'dominant-baseline'?: number | string + dur?: number | string + dx?: number | string + dy?: number | string + edgeMode?: number | string + elevation?: number | string + 'enable-background'?: number | string + end?: number | string + exponent?: number | string + externalResourcesRequired?: number | string + fill?: string + 'fill-opacity'?: number | string + 'fill-rule'?: 'nonzero' | 'evenodd' | 'inherit' + filter?: string + filterRes?: number | string + filterUnits?: number | string + 'flood-color'?: number | string + 'flood-opacity'?: number | string + focusable?: number | string + 'font-family'?: string + 'font-size'?: number | string + 'font-size-adjust'?: number | string + 'font-stretch'?: number | string + 'font-style'?: number | string + 'font-variant'?: number | string + 'font-weight'?: number | string + format?: number | string + from?: number | string + fx?: number | string + fy?: number | string + g1?: number | string + g2?: number | string + 'glyph-name'?: number | string + 'glyph-orientation-horizontal'?: number | string + 'glyph-orientation-vertical'?: number | string + glyphRef?: number | string + gradientTransform?: string + gradientUnits?: string + hanging?: number | string + 'horiz-adv-x'?: number | string + 'horiz-origin-x'?: number | string + href?: string + ideographic?: number | string + 'image-rendering'?: number | string + in2?: number | string + in?: string + intercept?: number | string + k1?: number | string + k2?: number | string + k3?: number | string + k4?: number | string + k?: number | string + kernelMatrix?: number | string + kernelUnitLength?: number | string + kerning?: number | string + keyPoints?: number | string + keySplines?: number | string + keyTimes?: number | string + lengthAdjust?: number | string + 'letter-spacing'?: number | string + 'lighting-color'?: number | string + limitingConeAngle?: number | string + local?: number | string + 'marker-end'?: string + markerHeight?: number | string + 'marker-mid'?: string + 'marker-start'?: string + markerUnits?: number | string + markerWidth?: number | string + mask?: string + maskContentUnits?: number | string + maskUnits?: number | string + mathematical?: number | string + mode?: number | string + numOctaves?: number | string + offset?: number | string + opacity?: number | string + operator?: number | string + order?: number | string + orient?: number | string + orientation?: number | string + origin?: number | string + overflow?: number | string + 'overline-position'?: number | string + 'overline-thickness'?: number | string + 'paint-order'?: number | string + 'panose-1'?: number | string + pathLength?: number | string + patternContentUnits?: string + patternTransform?: number | string + patternUnits?: string + 'pointer-events'?: number | string + points?: string + pointsAtX?: number | string + pointsAtY?: number | string + pointsAtZ?: number | string + preserveAlpha?: number | string + preserveAspectRatio?: string + primitiveUnits?: number | string + r?: number | string + radius?: number | string + refX?: number | string + refY?: number | string + renderingIntent?: number | string + repeatCount?: number | string + repeatDur?: number | string + requiredExtensions?: number | string + requiredFeatures?: number | string + restart?: number | string + result?: string + rotate?: number | string + rx?: number | string + ry?: number | string + scale?: number | string + seed?: number | string + 'shape-rendering'?: number | string + slope?: number | string + spacing?: number | string + specularConstant?: number | string + specularExponent?: number | string + speed?: number | string + spreadMethod?: string + startOffset?: number | string + stdDeviation?: number | string + stemh?: number | string + stemv?: number | string + stitchTiles?: number | string + 'stop-color'?: string + 'stop-opacity'?: number | string + 'strikethrough-position'?: number | string + 'strikethrough-thickness'?: number | string + string?: number | string + stroke?: string + 'stroke-dasharray'?: string | number + 'stroke-dashoffset'?: string | number + 'stroke-linecap'?: 'butt' | 'round' | 'square' | 'inherit' + 'stroke-linejoin'?: 'miter' | 'round' | 'bevel' | 'inherit' + 'stroke-miterlimit'?: number | string + 'stroke-opacity'?: number | string + 'stroke-width'?: number | string + surfaceScale?: number | string + systemLanguage?: number | string + tableValues?: number | string + targetX?: number | string + targetY?: number | string + 'text-anchor'?: string + 'text-decoration'?: number | string + textLength?: number | string + 'text-rendering'?: number | string + to?: number | string + transform?: string + u1?: number | string + u2?: number | string + 'underline-position'?: number | string + 'underline-thickness'?: number | string + unicode?: number | string + 'unicode-bidi'?: number | string + 'unicode-range'?: number | string + 'unitsPer-em'?: number | string + 'v-alphabetic'?: number | string + values?: string + 'vector-effect'?: number | string + version?: string + 'vert-adv-y'?: number | string + 'vert-origin-x'?: number | string + 'vert-origin-y'?: number | string + 'v-hanging'?: number | string + 'v-ideographic'?: number | string + viewBox?: string + viewTarget?: number | string + visibility?: number | string + 'v-mathematical'?: number | string + widths?: number | string + 'word-spacing'?: number | string + 'writing-mode'?: number | string + x1?: number | string + x2?: number | string + x?: number | string + xChannelSelector?: string + 'x-height'?: number | string + xlinkActuate?: string + xlinkArcrole?: string + xlinkHref?: string + xlinkRole?: string + xlinkShow?: string + xlinkTitle?: string + xlinkType?: string + y1?: number | string + y2?: number | string + y?: number | string + yChannelSelector?: string + z?: number | string + zoomAndPan?: string +} + +interface IntrinsicElementAttributes { + a: AnchorHTMLAttributes + abbr: HTMLAttributes + address: HTMLAttributes + area: AreaHTMLAttributes + article: HTMLAttributes + aside: HTMLAttributes + audio: AudioHTMLAttributes + b: HTMLAttributes + base: BaseHTMLAttributes + bdi: HTMLAttributes + bdo: HTMLAttributes + big: HTMLAttributes + blockquote: BlockquoteHTMLAttributes + body: HTMLAttributes + br: HTMLAttributes + button: ButtonHTMLAttributes + canvas: CanvasHTMLAttributes + caption: HTMLAttributes + cite: HTMLAttributes + code: HTMLAttributes + col: ColHTMLAttributes + colgroup: ColgroupHTMLAttributes + data: DataHTMLAttributes + datalist: HTMLAttributes + dd: HTMLAttributes + del: DelHTMLAttributes + details: DetailsHTMLAttributes + dfn: HTMLAttributes + dialog: DialogHTMLAttributes + div: HTMLAttributes + dl: HTMLAttributes + dt: HTMLAttributes + em: HTMLAttributes + embed: EmbedHTMLAttributes + fieldset: FieldsetHTMLAttributes + figcaption: HTMLAttributes + figure: HTMLAttributes + footer: HTMLAttributes + form: FormHTMLAttributes + h1: HTMLAttributes + h2: HTMLAttributes + h3: HTMLAttributes + h4: HTMLAttributes + h5: HTMLAttributes + h6: HTMLAttributes + head: HTMLAttributes + header: HTMLAttributes + hgroup: HTMLAttributes + hr: HTMLAttributes + html: HtmlHTMLAttributes + i: HTMLAttributes + iframe: IframeHTMLAttributes + img: ImgHTMLAttributes + input: InputHTMLAttributes + ins: InsHTMLAttributes + kbd: HTMLAttributes + keygen: KeygenHTMLAttributes + label: LabelHTMLAttributes + legend: HTMLAttributes + li: LiHTMLAttributes + link: LinkHTMLAttributes + main: HTMLAttributes + map: MapHTMLAttributes + mark: HTMLAttributes + menu: MenuHTMLAttributes + menuitem: HTMLAttributes + meta: MetaHTMLAttributes + meter: MeterHTMLAttributes + nav: HTMLAttributes + noindex: HTMLAttributes + noscript: HTMLAttributes + object: ObjectHTMLAttributes + ol: OlHTMLAttributes + optgroup: OptgroupHTMLAttributes + option: OptionHTMLAttributes + output: OutputHTMLAttributes + p: HTMLAttributes + param: ParamHTMLAttributes + picture: HTMLAttributes + pre: HTMLAttributes + progress: ProgressHTMLAttributes + q: QuoteHTMLAttributes + rp: HTMLAttributes + rt: HTMLAttributes + ruby: HTMLAttributes + s: HTMLAttributes + samp: HTMLAttributes + script: ScriptHTMLAttributes + section: HTMLAttributes + select: SelectHTMLAttributes + small: HTMLAttributes + source: SourceHTMLAttributes + span: HTMLAttributes + strong: HTMLAttributes + style: StyleHTMLAttributes + sub: HTMLAttributes + summary: HTMLAttributes + sup: HTMLAttributes + table: TableHTMLAttributes + template: HTMLAttributes + tbody: HTMLAttributes + td: TdHTMLAttributes + textarea: TextareaHTMLAttributes + tfoot: HTMLAttributes + th: ThHTMLAttributes + thead: HTMLAttributes + time: TimeHTMLAttributes + title: HTMLAttributes + tr: HTMLAttributes + track: TrackHTMLAttributes + u: HTMLAttributes + ul: HTMLAttributes + var: HTMLAttributes + video: VideoHTMLAttributes + wbr: HTMLAttributes + webview: WebViewHTMLAttributes + + // SVG + svg: SVGAttributes + + animate: SVGAttributes + animateMotion: SVGAttributes + animateTransform: SVGAttributes + circle: SVGAttributes + clipPath: SVGAttributes + defs: SVGAttributes + desc: SVGAttributes + ellipse: SVGAttributes + feBlend: SVGAttributes + feColorMatrix: SVGAttributes + feComponentTransfer: SVGAttributes + feComposite: SVGAttributes + feConvolveMatrix: SVGAttributes + feDiffuseLighting: SVGAttributes + feDisplacementMap: SVGAttributes + feDistantLight: SVGAttributes + feDropShadow: SVGAttributes + feFlood: SVGAttributes + feFuncA: SVGAttributes + feFuncB: SVGAttributes + feFuncG: SVGAttributes + feFuncR: SVGAttributes + feGaussianBlur: SVGAttributes + feImage: SVGAttributes + feMerge: SVGAttributes + feMergeNode: SVGAttributes + feMorphology: SVGAttributes + feOffset: SVGAttributes + fePointLight: SVGAttributes + feSpecularLighting: SVGAttributes + feSpotLight: SVGAttributes + feTile: SVGAttributes + feTurbulence: SVGAttributes + filter: SVGAttributes + foreignObject: SVGAttributes + g: SVGAttributes + image: SVGAttributes + line: SVGAttributes + linearGradient: SVGAttributes + marker: SVGAttributes + mask: SVGAttributes + metadata: SVGAttributes + mpath: SVGAttributes + path: SVGAttributes + pattern: SVGAttributes + polygon: SVGAttributes + polyline: SVGAttributes + radialGradient: SVGAttributes + rect: SVGAttributes + stop: SVGAttributes + switch: SVGAttributes + symbol: SVGAttributes + text: SVGAttributes + textPath: SVGAttributes + tspan: SVGAttributes + use: SVGAttributes + view: SVGAttributes +} + +export interface Events { + // clipboard events + onCopy: ClipboardEvent + onCut: ClipboardEvent + onPaste: ClipboardEvent + + // composition events + onCompositionend: CompositionEvent + onCompositionstart: CompositionEvent + onCompositionupdate: CompositionEvent + + // drag drop events + onDrag: DragEvent + onDragend: DragEvent + onDragenter: DragEvent + onDragexit: DragEvent + onDragleave: DragEvent + onDragover: DragEvent + onDragstart: DragEvent + onDrop: DragEvent + + // focus events + onFocus: FocusEvent + onBlur: FocusEvent + + // form events + onChange: Event + onBeforeinput: Event + onInput: Event + onReset: Event + onSubmit: Event + onInvalid: Event + + // image events + onLoad: Event + onError: Event + + // keyboard events + onKeydown: KeyboardEvent + onKeypress: KeyboardEvent + onKeyup: KeyboardEvent + + // mouse events + onAuxclick: MouseEvent + onClick: MouseEvent + onContextmenu: MouseEvent + onDblclick: MouseEvent + onMousedown: MouseEvent + onMouseenter: MouseEvent + onMouseleave: MouseEvent + onMousemove: MouseEvent + onMouseout: MouseEvent + onMouseover: MouseEvent + onMouseup: MouseEvent + + // media events + onAbort: Event + onCanplay: Event + onCanplaythrough: Event + onDurationchange: Event + onEmptied: Event + onEncrypted: Event + onEnded: Event + onLoadeddata: Event + onLoadedmetadata: Event + onLoadstart: Event + onPause: Event + onPlay: Event + onPlaying: Event + onProgress: Event + onRatechange: Event + onSeeked: Event + onSeeking: Event + onStalled: Event + onSuspend: Event + onTimeupdate: Event + onVolumechange: Event + onWaiting: Event + + // selection events + onSelect: Event + + // UI events + onScroll: UIEvent + + // touch events + onTouchcancel: TouchEvent + onTouchend: TouchEvent + onTouchmove: TouchEvent + onTouchstart: TouchEvent + + // pointer events + onPointerdown: PointerEvent + onPointermove: PointerEvent + onPointerup: PointerEvent + onPointercancel: PointerEvent + onPointerenter: PointerEvent + onPointerleave: PointerEvent + onPointerover: PointerEvent + onPointerout: PointerEvent + + // wheel events + onWheel: WheelEvent + + // animation events + onAnimationstart: AnimationEvent + onAnimationend: AnimationEvent + onAnimationiteration: AnimationEvent + + // transition events + onTransitionend: TransitionEvent + onTransitionstart: TransitionEvent +} + +type StringKeyOf = Extract + +type EventHandlers = { + [K in StringKeyOf]?: E[K] extends Function ? E[K] : (payload: E[K]) => void +} + +type ReservedProps = { + key?: string | number + ref?: string | Ref | ((ref: Element | ComponentPublicInstance | null) => void) +} + +type ElementAttrs = T & EventHandlers & ReservedProps + +type NativeElements = { + [K in StringKeyOf]: ElementAttrs< + IntrinsicElementAttributes[K] + > +} + +declare global { + namespace JSX { + interface Element {} + interface ElementClass { + $props: {} + } + interface ElementAttributesProperty { + $props: {} + } + interface IntrinsicElements extends NativeElements { + // allow arbitrary elements + [name: string]: any + } + } +} + +// suppress ts:2669 +export {} diff --git a/packages/jsx-typings/package.json b/packages/jsx-typings/package.json new file mode 100644 index 00000000000..d61b9a29424 --- /dev/null +++ b/packages/jsx-typings/package.json @@ -0,0 +1,25 @@ +{ + "name": "@vue/jsx-typings", + "version": "3.0.0", + "description": "JSX typings for vue", + "sideEffects": false, + "files": [ + "index.d.ts" + ], + "repository": { + "type": "git", + "url": "git+https://github.com/vuejs/vue-next.git" + }, + "keywords": [ + "vue", + "jsx", + "typings", + "types" + ], + "author": "Evan You", + "license": "MIT", + "bugs": { + "url": "https://github.com/vuejs/vue-next/issues" + }, + "homepage": "https://github.com/vuejs/vue-next/tree/master/packages/jsx-typings#readme" +} diff --git a/packages/jsx-typings/src/index.ts b/packages/jsx-typings/src/index.ts new file mode 100644 index 00000000000..b1c6ea436a5 --- /dev/null +++ b/packages/jsx-typings/src/index.ts @@ -0,0 +1 @@ +export default {} diff --git a/packages/vue/package.json b/packages/vue/package.json index 097970911af..42c6dba297e 100644 --- a/packages/vue/package.json +++ b/packages/vue/package.json @@ -39,6 +39,7 @@ "dependencies": { "@vue/shared": "3.0.0", "@vue/compiler-dom": "3.0.0", + "@vue/jsx-typings": "3.0.0", "@vue/runtime-dom": "3.0.0" }, "devDependencies": { diff --git a/packages/vue/src/index.ts b/packages/vue/src/index.ts index c810d03eb92..660145bd43a 100644 --- a/packages/vue/src/index.ts +++ b/packages/vue/src/index.ts @@ -1,6 +1,7 @@ // This entry is the "full-build" that includes both the runtime // and the compiler, and supports on-the-fly compilation of the template option. import { initDev } from './dev' +import '@vue/jsx-typings' import { compile, CompilerOptions, CompilerError } from '@vue/compiler-dom' import { registerRuntimeCompiler, RenderFunction, warn } from '@vue/runtime-dom' import * as runtimeDom from '@vue/runtime-dom' @@ -62,7 +63,7 @@ function compileToFunction( /* istanbul ignore next */ throw err } - } + }, }, options ) diff --git a/scripts/build.js b/scripts/build.js index f3a66051b0a..7b734998c77 100644 --- a/scripts/build.js +++ b/scripts/build.js @@ -72,30 +72,25 @@ async function build(target) { const env = (pkg.buildOptions && pkg.buildOptions.env) || (devOnly ? 'development' : 'production') - await execa( - 'rollup', - [ - '-c', - '--environment', + if (pkg.buildOptions) { + await execa( + 'rollup', [ - `COMMIT:${commit}`, - `NODE_ENV:${env}`, - `TARGET:${target}`, - formats ? `FORMATS:${formats}` : ``, - buildTypes ? `TYPES:true` : ``, - prodOnly ? `PROD_ONLY:true` : ``, - sourceMap ? `SOURCE_MAP:true` : `` - ] - .filter(Boolean) - .join(',') - ], - { stdio: 'inherit' } - ) - - if (buildTypes && pkg.types) { - console.log() - console.log( - chalk.bold(chalk.yellow(`Rolling up type definitions for ${target}...`)) + '-c', + '--environment', + [ + `COMMIT:${commit}`, + `NODE_ENV:${env}`, + `TARGET:${target}`, + formats ? `FORMATS:${formats}` : ``, + buildTypes ? `TYPES:true` : ``, + prodOnly ? `PROD_ONLY:true` : ``, + sourceMap ? `SOURCE_MAP:true` : `` + ] + .filter(Boolean) + .join(',') + ], + { stdio: 'inherit' } ) // build types @@ -124,15 +119,45 @@ async function build(target) { ) await fs.writeFile(dtsPath, existing + '\n' + toAdd.join('\n')) } + console.log( - chalk.bold(chalk.green(`API Extractor completed successfully.`)) + chalk.bold(chalk.yellow(`Rolling up type definitions for ${target}...`)) ) - } else { - console.error( - `API Extractor completed with ${extractorResult.errorCount} errors` + - ` and ${extractorResult.warningCount} warnings` + + // build types + const { Extractor, ExtractorConfig } = require('@microsoft/api-extractor') + + const extractorConfigPath = path.resolve(pkgDir, `api-extractor.json`) + const extractorConfig = ExtractorConfig.loadFileAndPrepare( + extractorConfigPath ) - process.exitCode = 1 + const result = Extractor.invoke(extractorConfig, { + localBuild: true, + showVerboseMessages: true + }) + + if (result.succeeded) { + // concat additional d.ts to rolled-up dts (mostly for JSX) + if (pkg.buildOptions && pkg.buildOptions.dts) { + const dtsPath = path.resolve(pkgDir, pkg.types) + const existing = await fs.readFile(dtsPath, 'utf-8') + const toAdd = await Promise.all( + pkg.buildOptions.dts.map(file => { + return fs.readFile(path.resolve(pkgDir, file), 'utf-8') + }) + ) + await fs.writeFile(dtsPath, existing + '\n' + toAdd.join('\n')) + } + console.log( + chalk.bold(chalk.green(`API Extractor completed successfully.`)) + ) + } else { + console.error( + `API Extractor completed with ${extractorResult.errorCount} errors` + + ` and ${extractorResult.warningCount} warnings` + ) + process.exitCode = 1 + } } await fs.remove(`${pkgDir}/dist/packages`) diff --git a/test-dts/index.d.ts b/test-dts/index.d.ts index be3143f4773..8c487bdb501 100644 --- a/test-dts/index.d.ts +++ b/test-dts/index.d.ts @@ -4,6 +4,7 @@ // it's intended. We cannot use directives like @ts-ignore or @ts-nocheck since // that would suppress the errors that should be caught. +import '@vue/jsx-typings' export * from '@vue/runtime-dom' export function describe(_name: string, _fn: () => void): void diff --git a/tsconfig.json b/tsconfig.json index 117bce3edf9..5a15a1fa5c9 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -24,6 +24,7 @@ }, "include": [ "packages/global.d.ts", + "packages/jsx-typings/index.d.ts", "packages/*/src", "packages/runtime-dom/types/jsx.d.ts", "packages/*/__tests__",