From f5c6e53390b4cbb2da04f543ef877cf03133fc80 Mon Sep 17 00:00:00 2001 From: Hunter Perrin Date: Mon, 13 Sep 2021 13:13:18 -0700 Subject: [PATCH] feat: add prop types for HTML props for components --- packages/banner/Banner.types.ts | 30 ++++ packages/banner/ambient.d.ts | 2 + packages/banner/index.ts | 3 +- packages/button/Button.svelte | 3 +- packages/button/Button.types.ts | 19 +++ packages/button/Group.types.ts | 15 ++ packages/button/GroupItem.ts | 10 +- packages/button/SMUIComponent.d.ts | 5 - packages/button/ambient.d.ts | 3 + packages/button/index.ts | 10 +- packages/card/ActionButtons.ts | 5 +- packages/card/ActionIcons.ts | 5 +- packages/card/Actions.types.ts | 15 ++ packages/card/Card.types.ts | 15 ++ packages/card/Content.ts | 5 +- packages/card/Media.types.ts | 15 ++ packages/card/MediaContent.ts | 5 +- packages/card/PrimaryAction.types.ts | 15 ++ packages/card/ambient.d.ts | 3 + packages/card/index.ts | 19 ++- packages/checkbox/Checkbox.types.ts | 27 ++++ packages/checkbox/ambient.d.ts | 3 + packages/checkbox/index.ts | 4 +- packages/chips/Checkmark.types.ts | 15 ++ packages/chips/Chip.svelte | 2 +- packages/chips/Chip.types.ts | 20 +++ packages/chips/LeadingIcon.types.ts | 15 ++ packages/chips/Set.svelte | 2 +- packages/chips/Set.types.ts | 15 ++ packages/chips/Text.types.ts | 16 ++ packages/chips/TrailingAction.types.ts | 23 +++ packages/chips/TrailingIcon.types.ts | 15 ++ packages/chips/ambient.d.ts | 2 + packages/chips/index.ts | 26 ++- .../CircularProgress.types.ts | 15 ++ packages/circular-progress/ambient.d.ts | 3 + packages/circular-progress/index.ts | 4 +- packages/common/A.types.ts | 16 ++ packages/common/Aside.types.ts | 16 ++ packages/common/Button.types.ts | 16 ++ packages/common/ClassAdder/index.types.ts | 4 +- packages/common/CommonIcon.types.ts | 19 +++ packages/common/CommonLabel.types.ts | 19 +++ packages/common/Div.types.ts | 16 ++ packages/common/Em.types.ts | 16 ++ packages/common/Footer.types.ts | 16 ++ packages/common/H1.types.ts | 16 ++ packages/common/H2.types.ts | 16 ++ packages/common/H3.types.ts | 16 ++ packages/common/H4.types.ts | 16 ++ packages/common/H5.types.ts | 16 ++ packages/common/H6.types.ts | 16 ++ packages/common/Header.types.ts | 16 ++ packages/common/Hr.types.ts | 16 ++ packages/common/I.types.ts | 16 ++ packages/common/Img.types.ts | 16 ++ packages/common/Li.types.ts | 16 ++ packages/common/Main.types.ts | 16 ++ packages/common/Nav.types.ts | 16 ++ packages/common/P.svelte | 20 +++ packages/common/P.types.ts | 16 ++ packages/common/README.md | 6 +- packages/common/Section.types.ts | 16 ++ packages/common/Span.types.ts | 16 ++ packages/common/Strong.types.ts | 16 ++ packages/common/Svg.types.ts | 16 ++ packages/common/Ul.types.ts | 16 ++ packages/common/ambient.d.ts | 3 + packages/common/classAdderBuilder.ts | 7 +- packages/common/elements.ts | 149 ++++++++++++++++++ packages/common/index.ts | 15 +- packages/common/prefixFilter.ts | 12 +- packages/data-table/Body.types.ts | 16 ++ packages/data-table/Cell.types.ts | 16 ++ packages/data-table/DataTable.types.ts | 30 ++++ packages/data-table/Head.types.ts | 16 ++ packages/data-table/Pagination.types.ts | 22 +++ packages/data-table/Row.types.ts | 16 ++ packages/data-table/ambient.d.ts | 2 + packages/data-table/index.ts | 24 ++- packages/dialog/Actions.ts | 5 +- packages/dialog/Content.ts | 5 +- packages/dialog/Dialog.types.ts | 29 ++++ packages/dialog/Header.ts | 5 +- packages/dialog/Title.ts | 5 +- packages/dialog/ambient.d.ts | 2 + packages/dialog/index.ts | 4 +- packages/drawer/AppContent.ts | 5 +- packages/drawer/Content.ts | 5 +- packages/drawer/Drawer.types.ts | 15 ++ packages/drawer/Header.ts | 5 +- packages/drawer/Scrim.svelte | 2 +- packages/drawer/Scrim.types.ts | 19 +++ packages/drawer/Subtitle.ts | 5 +- packages/drawer/Title.ts | 5 +- packages/drawer/ambient.d.ts | 3 + packages/drawer/index.ts | 9 +- packages/fab/Fab.svelte | 3 +- packages/fab/Fab.types.ts | 19 +++ packages/fab/ambient.d.ts | 3 + packages/fab/index.ts | 4 +- .../floating-label/FloatingLabel.types.ts | 15 ++ packages/floating-label/ambient.d.ts | 3 + packages/floating-label/index.ts | 3 +- packages/form-field/FormField.types.ts | 22 +++ packages/form-field/ambient.d.ts | 2 + packages/form-field/index.ts | 4 +- packages/icon-button/IconButton.svelte | 3 +- packages/icon-button/IconButton.types.ts | 19 +++ packages/icon-button/ambient.d.ts | 3 + packages/icon-button/index.ts | 4 +- packages/image-list/Image.ts | 5 +- packages/image-list/ImageAspectContainer.ts | 5 +- packages/image-list/ImageList.types.ts | 15 ++ packages/image-list/Item.ts | 5 +- packages/image-list/Supporting.ts | 5 +- packages/image-list/ambient.d.ts | 3 + packages/image-list/index.ts | 4 +- packages/layout-grid/Cell.types.ts | 15 ++ packages/layout-grid/InnerGrid.types.ts | 15 ++ packages/layout-grid/LayoutGrid.types.ts | 19 +++ packages/layout-grid/ambient.d.ts | 3 + packages/layout-grid/index.ts | 14 +- packages/line-ripple/LineRipple.types.ts | 15 ++ packages/line-ripple/ambient.d.ts | 3 + packages/line-ripple/index.ts | 4 +- .../linear-progress/LinearProgress.types.ts | 15 ++ packages/linear-progress/ambient.d.ts | 3 + packages/linear-progress/index.ts | 4 +- packages/list/Graphic.types.ts | 15 ++ packages/list/Group.ts | 5 +- packages/list/Item.svelte | 4 +- packages/list/Item.types.ts | 20 +++ packages/list/Label.types.ts | 15 ++ packages/list/List.svelte | 3 +- packages/list/List.types.ts | 20 +++ packages/list/Meta.ts | 5 +- packages/list/PrimaryText.ts | 5 +- packages/list/SecondaryText.ts | 5 +- packages/list/Separator.svelte | 3 +- packages/list/Separator.types.ts | 19 +++ packages/list/Subheader.ts | 5 +- packages/list/Text.ts | 5 +- packages/list/ambient.d.ts | 3 + packages/list/index.ts | 22 ++- packages/menu-surface/MenuSurface.types.ts | 16 ++ packages/menu-surface/ambient.d.ts | 3 + packages/menu-surface/index.ts | 3 +- packages/menu/Menu.svelte | 7 +- packages/menu/Menu.types.ts | 15 +- packages/menu/SelectionGroup.types.ts | 22 +++ packages/menu/SelectionGroupIcon.ts | 2 +- packages/menu/ambient.d.ts | 3 + packages/menu/index.ts | 5 +- .../notched-outline/NotchedOutline.types.ts | 15 ++ packages/notched-outline/ambient.d.ts | 2 + packages/notched-outline/index.ts | 4 +- packages/paper/Content.ts | 5 +- packages/paper/Paper.types.ts | 15 ++ packages/paper/Subtitle.ts | 5 +- packages/paper/Title.ts | 5 +- packages/paper/ambient.d.ts | 3 + packages/paper/index.ts | 4 +- packages/radio/Radio.types.ts | 27 ++++ packages/radio/ambient.d.ts | 3 + packages/radio/index.ts | 4 +- packages/segmented-button/Segment.types.ts | 16 ++ .../segmented-button/SegmentedButton.svelte | 2 +- .../segmented-button/SegmentedButton.types.ts | 15 ++ packages/segmented-button/ambient.d.ts | 2 + packages/segmented-button/index.ts | 9 +- packages/select/Option.svelte | 3 +- packages/select/Option.types.ts | 14 ++ packages/select/Select.svelte | 9 +- packages/select/Select.types.ts | 77 +++++++++ packages/select/ambient.d.ts | 2 + .../select/helper-text/HelperText.types.ts | 15 ++ packages/select/helper-text/index.ts | 4 +- packages/select/icon/Icon.types.ts | 15 ++ packages/select/icon/index.ts | 4 +- packages/select/index.ts | 9 +- packages/site/src/routes/__layout.svelte | 7 +- .../common/_ClassAdderBuilderComponent.ts | 5 +- .../demo/common/_ElementalComponents.svelte | 5 +- .../demo/common/_EventsAndModifiers.svelte | 2 +- .../site/src/routes/demo/drawer/_Modal.svelte | 2 +- packages/site/src/routes/demo/fab/_Svg.svelte | 2 +- .../src/routes/demo/icon-button/_Svgs.svelte | 2 +- .../image-list/_EnforceAspectRatio.svelte | 2 +- .../routes/demo/menu-surface/_Anchored.svelte | 4 +- .../demo/menu-surface/_ManualAnchor.svelte | 7 +- .../demo/segmented-button/_IconsKeys.svelte | 2 +- .../demo/segmented-button/_Touch.svelte | 2 +- .../routes/demo/snackbar/_DynamicText.svelte | 8 +- .../src/routes/demo/snackbar/_Kitchen.svelte | 4 +- .../demo/snackbar/_LeadingWithAction.svelte | 8 +- .../src/routes/demo/snackbar/_Simple.svelte | 10 +- .../demo/snackbar/_StackedWithAction.svelte | 8 +- .../routes/demo/textfield/_ManualSetup.svelte | 26 +-- .../src/routes/demo/top-app-bar/iframe.svelte | 3 +- packages/site/src/routes/index.svelte | 2 +- packages/slider/Slider.types.ts | 30 ++++ packages/slider/ambient.d.ts | 3 + packages/slider/index.ts | 4 +- packages/snackbar/Actions.ts | 5 +- packages/snackbar/Snackbar.types.ts | 22 +++ packages/snackbar/ambient.d.ts | 2 + packages/snackbar/index.ts | 4 +- packages/snackbar/kitchen/Kitchen.svelte | 2 +- packages/snackbar/kitchen/Kitchen.types.ts | 24 +++ packages/snackbar/kitchen/index.ts | 3 +- packages/switch/Switch.types.ts | 27 ++++ packages/switch/ambient.d.ts | 3 + packages/switch/index.ts | 4 +- packages/tab-bar/TabBar.svelte | 3 +- packages/tab-bar/TabBar.types.ts | 19 +++ packages/tab-bar/ambient.d.ts | 2 + packages/tab-bar/index.ts | 4 +- packages/tab-indicator/TabIndicator.types.ts | 22 +++ packages/tab-indicator/ambient.d.ts | 3 + packages/tab-indicator/index.ts | 4 +- packages/tab-scroller/TabScroller.types.ts | 29 ++++ packages/tab-scroller/ambient.d.ts | 3 + packages/tab-scroller/index.ts | 4 +- packages/tab/Tab.svelte | 6 +- packages/tab/Tab.types.ts | 31 ++++ packages/tab/ambient.d.ts | 3 + packages/tab/index.ts | 3 +- packages/textfield/HelperLine.ts | 5 +- packages/textfield/Input.types.ts | 8 +- packages/textfield/Prefix.ts | 5 +- packages/textfield/Suffix.ts | 5 +- packages/textfield/Textarea.types.ts | 8 +- packages/textfield/Textfield.svelte | 11 +- packages/textfield/Textfield.types.ts | 37 +++-- packages/textfield/ambient.d.ts | 2 + .../CharacterCounter.types.ts | 15 ++ packages/textfield/character-counter/index.ts | 4 +- .../textfield/helper-text/HelperText.types.ts | 15 ++ packages/textfield/helper-text/index.ts | 4 +- packages/textfield/icon/Icon.types.ts | 15 ++ packages/textfield/icon/index.ts | 4 +- packages/textfield/index.ts | 19 +-- packages/tooltip/Content.ts | 5 +- packages/tooltip/Link.ts | 5 +- packages/tooltip/RichActions.ts | 5 +- packages/tooltip/Title.ts | 5 +- packages/tooltip/Tooltip.types.ts | 22 +++ packages/tooltip/Wrapper.ts | 18 --- packages/tooltip/Wrapper.types.ts | 15 ++ packages/tooltip/ambient.d.ts | 3 + packages/tooltip/index.ts | 9 +- packages/top-app-bar/AutoAdjust.svelte | 2 +- packages/top-app-bar/AutoAdjust.types.ts | 19 +++ packages/top-app-bar/Row.ts | 5 +- packages/top-app-bar/Section.types.ts | 15 ++ packages/top-app-bar/Title.ts | 5 +- packages/top-app-bar/TopAppBar.types.ts | 15 ++ packages/top-app-bar/ambient.d.ts | 2 + packages/top-app-bar/index.ts | 14 +- packages/touch-target/Wrapper.ts | 5 +- packages/touch-target/ambient.d.ts | 3 + 262 files changed, 2477 insertions(+), 342 deletions(-) create mode 100644 packages/button/Button.types.ts create mode 100644 packages/button/Group.types.ts delete mode 100644 packages/button/SMUIComponent.d.ts create mode 100644 packages/button/ambient.d.ts create mode 100644 packages/card/Actions.types.ts create mode 100644 packages/card/Card.types.ts create mode 100644 packages/card/Media.types.ts create mode 100644 packages/card/PrimaryAction.types.ts create mode 100644 packages/card/ambient.d.ts create mode 100644 packages/checkbox/Checkbox.types.ts create mode 100644 packages/checkbox/ambient.d.ts create mode 100644 packages/chips/Checkmark.types.ts create mode 100644 packages/chips/LeadingIcon.types.ts create mode 100644 packages/chips/Set.types.ts create mode 100644 packages/chips/TrailingIcon.types.ts create mode 100644 packages/circular-progress/CircularProgress.types.ts create mode 100644 packages/circular-progress/ambient.d.ts create mode 100644 packages/common/A.types.ts create mode 100644 packages/common/Aside.types.ts create mode 100644 packages/common/Button.types.ts create mode 100644 packages/common/CommonIcon.types.ts create mode 100644 packages/common/CommonLabel.types.ts create mode 100644 packages/common/Div.types.ts create mode 100644 packages/common/Em.types.ts create mode 100644 packages/common/Footer.types.ts create mode 100644 packages/common/H1.types.ts create mode 100644 packages/common/H2.types.ts create mode 100644 packages/common/H3.types.ts create mode 100644 packages/common/H4.types.ts create mode 100644 packages/common/H5.types.ts create mode 100644 packages/common/H6.types.ts create mode 100644 packages/common/Header.types.ts create mode 100644 packages/common/Hr.types.ts create mode 100644 packages/common/I.types.ts create mode 100644 packages/common/Img.types.ts create mode 100644 packages/common/Li.types.ts create mode 100644 packages/common/Main.types.ts create mode 100644 packages/common/Nav.types.ts create mode 100644 packages/common/P.svelte create mode 100644 packages/common/P.types.ts create mode 100644 packages/common/Section.types.ts create mode 100644 packages/common/Span.types.ts create mode 100644 packages/common/Strong.types.ts create mode 100644 packages/common/Svg.types.ts create mode 100644 packages/common/Ul.types.ts create mode 100644 packages/common/ambient.d.ts create mode 100644 packages/common/elements.ts create mode 100644 packages/data-table/Pagination.types.ts create mode 100644 packages/dialog/Dialog.types.ts create mode 100644 packages/drawer/Drawer.types.ts create mode 100644 packages/drawer/Scrim.types.ts create mode 100644 packages/drawer/ambient.d.ts create mode 100644 packages/fab/Fab.types.ts create mode 100644 packages/fab/ambient.d.ts create mode 100644 packages/floating-label/ambient.d.ts create mode 100644 packages/form-field/FormField.types.ts create mode 100644 packages/icon-button/IconButton.types.ts create mode 100644 packages/icon-button/ambient.d.ts create mode 100644 packages/image-list/ImageList.types.ts create mode 100644 packages/image-list/ambient.d.ts create mode 100644 packages/layout-grid/Cell.types.ts create mode 100644 packages/layout-grid/InnerGrid.types.ts create mode 100644 packages/layout-grid/LayoutGrid.types.ts create mode 100644 packages/layout-grid/ambient.d.ts create mode 100644 packages/line-ripple/LineRipple.types.ts create mode 100644 packages/line-ripple/ambient.d.ts create mode 100644 packages/linear-progress/LinearProgress.types.ts create mode 100644 packages/linear-progress/ambient.d.ts create mode 100644 packages/list/Graphic.types.ts create mode 100644 packages/list/Label.types.ts create mode 100644 packages/list/Separator.types.ts create mode 100644 packages/list/ambient.d.ts create mode 100644 packages/menu-surface/ambient.d.ts create mode 100644 packages/menu/SelectionGroup.types.ts create mode 100644 packages/menu/ambient.d.ts create mode 100644 packages/notched-outline/NotchedOutline.types.ts create mode 100644 packages/paper/Paper.types.ts create mode 100644 packages/paper/ambient.d.ts create mode 100644 packages/radio/Radio.types.ts create mode 100644 packages/radio/ambient.d.ts create mode 100644 packages/segmented-button/SegmentedButton.types.ts create mode 100644 packages/select/Option.types.ts create mode 100644 packages/select/Select.types.ts create mode 100644 packages/select/helper-text/HelperText.types.ts create mode 100644 packages/select/icon/Icon.types.ts create mode 100644 packages/slider/Slider.types.ts create mode 100644 packages/slider/ambient.d.ts create mode 100644 packages/snackbar/Snackbar.types.ts create mode 100644 packages/switch/Switch.types.ts create mode 100644 packages/switch/ambient.d.ts create mode 100644 packages/tab-bar/TabBar.types.ts create mode 100644 packages/tab-indicator/TabIndicator.types.ts create mode 100644 packages/tab-indicator/ambient.d.ts create mode 100644 packages/tab-scroller/TabScroller.types.ts create mode 100644 packages/tab-scroller/ambient.d.ts create mode 100644 packages/tab/ambient.d.ts create mode 100644 packages/textfield/character-counter/CharacterCounter.types.ts create mode 100644 packages/textfield/helper-text/HelperText.types.ts create mode 100644 packages/textfield/icon/Icon.types.ts create mode 100644 packages/tooltip/Tooltip.types.ts delete mode 100644 packages/tooltip/Wrapper.ts create mode 100644 packages/tooltip/Wrapper.types.ts create mode 100644 packages/tooltip/ambient.d.ts create mode 100644 packages/top-app-bar/AutoAdjust.types.ts create mode 100644 packages/top-app-bar/Section.types.ts create mode 100644 packages/top-app-bar/TopAppBar.types.ts create mode 100644 packages/touch-target/ambient.d.ts diff --git a/packages/banner/Banner.types.ts b/packages/banner/Banner.types.ts index 59fb89513..4ffd278c4 100644 --- a/packages/banner/Banner.types.ts +++ b/packages/banner/Banner.types.ts @@ -1 +1,31 @@ +import type Component from './Banner.svelte'; + +export declare class BannerComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + { + [k in keyof Partial< + svelte.JSX.HTMLAttributes + > as `textWrapper\$${k}`]?: Partial< + svelte.JSX.HTMLAttributes + >[k]; + } & + { + [k in keyof Partial< + svelte.JSX.HTMLAttributes + > as `graphic\$${k}`]?: Partial< + svelte.JSX.HTMLAttributes + >[k]; + } & + Component['$$prop_def']; +} + export { CloseReason } from '@material/banner'; diff --git a/packages/banner/ambient.d.ts b/packages/banner/ambient.d.ts index 242f144ff..724f1e8e2 100644 --- a/packages/banner/ambient.d.ts +++ b/packages/banner/ambient.d.ts @@ -1,4 +1,6 @@ declare namespace svelte.JSX { + interface HTMLAttributes {} + interface HTMLProps extends HTMLAttributes { ['onSMUIBannerButton:primaryActionClick']?: ( event: CustomEvent & { target: T } diff --git a/packages/banner/index.ts b/packages/banner/index.ts index 4de0257be..98bc519f4 100644 --- a/packages/banner/index.ts +++ b/packages/banner/index.ts @@ -1,8 +1,9 @@ import Banner from './Banner.svelte'; +import type { BannerComponentDev } from './Banner.types'; export * from './Banner.types'; import { Label, Icon } from '@smui/common'; -export default Banner; +export default Banner as typeof BannerComponentDev; export { Label, Icon }; diff --git a/packages/button/Button.svelte b/packages/button/Button.svelte index f4db9d488..f9100f873 100644 --- a/packages/button/Button.svelte +++ b/packages/button/Button.svelte @@ -61,8 +61,7 @@ ActionArray, } from '@smui/common/internal'; import Ripple from '@smui/ripple'; - import A from '@smui/common/A.svelte'; - import Button from '@smui/common/Button.svelte'; + import { A, Button } from '@smui/common/elements'; const forwardEvents = forwardEventsBuilder(get_current_component()); diff --git a/packages/button/Button.types.ts b/packages/button/Button.types.ts new file mode 100644 index 000000000..5d0bbde28 --- /dev/null +++ b/packages/button/Button.types.ts @@ -0,0 +1,19 @@ +import type { SMUIComponent } from '@smui/common'; +import type Component from './Button.svelte'; +import type { ButtonComponentDev as ButtonElementComponentDev } from '@smui/common/elements'; + +export declare class ButtonComponentDev< + C extends SMUIComponent = ButtonElementComponentDev +> extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/button/Group.types.ts b/packages/button/Group.types.ts new file mode 100644 index 000000000..adf96d549 --- /dev/null +++ b/packages/button/Group.types.ts @@ -0,0 +1,15 @@ +import type Component from './Group.svelte'; + +export declare class GroupComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/button/GroupItem.ts b/packages/button/GroupItem.ts index 1c988cddd..01f6e51d9 100644 --- a/packages/button/GroupItem.ts +++ b/packages/button/GroupItem.ts @@ -1,14 +1,12 @@ -export type GroupItemProps = { - addClass?: (className: string) => void; - removeClass?: (className: string) => void; -}; - export default function GroupItem( node: Element, { addClass = (className) => node.classList.add(className), removeClass = (className) => node.classList.remove(className), - }: GroupItemProps = {} + }: { + addClass?: (className: string) => void; + removeClass?: (className: string) => void; + } = {} ) { addClass('smui-button__group-item'); diff --git a/packages/button/SMUIComponent.d.ts b/packages/button/SMUIComponent.d.ts deleted file mode 100644 index 09fb56650..000000000 --- a/packages/button/SMUIComponent.d.ts +++ /dev/null @@ -1,5 +0,0 @@ -import type { SMUIComponent } from '@smui/common'; - -declare module '*.svelte' { - export { SMUIComponent as default }; -} diff --git a/packages/button/ambient.d.ts b/packages/button/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/button/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/button/index.ts b/packages/button/index.ts index 867802c75..432ef0931 100644 --- a/packages/button/index.ts +++ b/packages/button/index.ts @@ -1,10 +1,14 @@ import Button from './Button.svelte'; +import type { ButtonComponentDev } from './Button.types'; +export * from './Button.types'; -import Group from './Group.svelte'; -export * from './GroupItem'; +import GroupComponent from './Group.svelte'; +import type { GroupComponentDev } from './Group.types'; +export * from './Group.types'; +const Group = GroupComponent as typeof GroupComponentDev; import GroupItem from './GroupItem'; import { Label, Icon } from '@smui/common'; -export default Button; +export default Button as typeof ButtonComponentDev; export { Group, GroupItem, Label, Icon }; diff --git a/packages/card/ActionButtons.ts b/packages/card/ActionButtons.ts index f55801c0f..b92c3615a 100644 --- a/packages/card/ActionButtons.ts +++ b/packages/card/ActionButtons.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-card__action-buttons', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/card/ActionIcons.ts b/packages/card/ActionIcons.ts index 9fb6891e3..d32b9ca63 100644 --- a/packages/card/ActionIcons.ts +++ b/packages/card/ActionIcons.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-card__action-icons', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/card/Actions.types.ts b/packages/card/Actions.types.ts new file mode 100644 index 000000000..f674eca80 --- /dev/null +++ b/packages/card/Actions.types.ts @@ -0,0 +1,15 @@ +import type Component from './Actions.svelte'; + +export declare class ActionsComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/card/Card.types.ts b/packages/card/Card.types.ts new file mode 100644 index 000000000..45174af67 --- /dev/null +++ b/packages/card/Card.types.ts @@ -0,0 +1,15 @@ +import type Component from './Card.svelte'; + +export declare class CardComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/card/Content.ts b/packages/card/Content.ts index 6c33a94eb..2365a90ae 100644 --- a/packages/card/Content.ts +++ b/packages/card/Content.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'smui-card__content', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/card/Media.types.ts b/packages/card/Media.types.ts new file mode 100644 index 000000000..055924245 --- /dev/null +++ b/packages/card/Media.types.ts @@ -0,0 +1,15 @@ +import type Component from './Media.svelte'; + +export declare class MediaComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/card/MediaContent.ts b/packages/card/MediaContent.ts index ffd12bb61..88f2d47e0 100644 --- a/packages/card/MediaContent.ts +++ b/packages/card/MediaContent.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-card__media-content', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/card/PrimaryAction.types.ts b/packages/card/PrimaryAction.types.ts new file mode 100644 index 000000000..e14e92a31 --- /dev/null +++ b/packages/card/PrimaryAction.types.ts @@ -0,0 +1,15 @@ +import type Component from './PrimaryAction.svelte'; + +export declare class PrimaryActionComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/card/ambient.d.ts b/packages/card/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/card/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/card/index.ts b/packages/card/index.ts index 2d55c4c3f..823a63e51 100644 --- a/packages/card/index.ts +++ b/packages/card/index.ts @@ -1,14 +1,25 @@ import Card from './Card.svelte'; +import type { CardComponentDev } from './Card.types'; +export * from './Card.types'; import Content from './Content'; -import PrimaryAction from './PrimaryAction.svelte'; -import Media from './Media.svelte'; +import PrimaryActionComponent from './PrimaryAction.svelte'; +import type { PrimaryActionComponentDev } from './PrimaryAction.types'; +export * from './PrimaryAction.types'; +const PrimaryAction = PrimaryActionComponent as typeof PrimaryActionComponentDev; +import MediaComponent from './Media.svelte'; +import type { MediaComponentDev } from './Media.types'; +export * from './Media.types'; +const Media = MediaComponent as typeof MediaComponentDev; import MediaContent from './MediaContent'; -import Actions from './Actions.svelte'; +import ActionsComponent from './Actions.svelte'; +import type { ActionsComponentDev } from './Actions.types'; +export * from './Actions.types'; +const Actions = ActionsComponent as typeof ActionsComponentDev; import ActionButtons from './ActionButtons'; import ActionIcons from './ActionIcons'; -export default Card; +export default Card as typeof CardComponentDev; export { Content, diff --git a/packages/checkbox/Checkbox.types.ts b/packages/checkbox/Checkbox.types.ts new file mode 100644 index 000000000..105981c8a --- /dev/null +++ b/packages/checkbox/Checkbox.types.ts @@ -0,0 +1,27 @@ +import type Component from './Checkbox.svelte'; + +export declare class CheckboxComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + { + [k in keyof Partial< + svelte.JSX.HTMLAttributes + > as `input\$${k}`]?: Partial< + svelte.JSX.HTMLAttributes + >[k]; + } & { + input$type?: never; + input$disabled?: never; + input$value?: never; + input$checked?: never; + input$group?: never; + } & Component['$$prop_def']; +} diff --git a/packages/checkbox/ambient.d.ts b/packages/checkbox/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/checkbox/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/checkbox/index.ts b/packages/checkbox/index.ts index e2c62a6f5..3c9ae3cd9 100644 --- a/packages/checkbox/index.ts +++ b/packages/checkbox/index.ts @@ -1,3 +1,5 @@ import Checkbox from './Checkbox.svelte'; +import type { CheckboxComponentDev } from './Checkbox.types'; +export * from './Checkbox.types'; -export default Checkbox; +export default Checkbox as typeof CheckboxComponentDev; diff --git a/packages/chips/Checkmark.types.ts b/packages/chips/Checkmark.types.ts new file mode 100644 index 000000000..d5b4f8971 --- /dev/null +++ b/packages/chips/Checkmark.types.ts @@ -0,0 +1,15 @@ +import type Component from './Checkmark.svelte'; + +export declare class CheckmarkComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/chips/Chip.svelte b/packages/chips/Chip.svelte index 93b0c3fb3..d05ddc4cd 100644 --- a/packages/chips/Chip.svelte +++ b/packages/chips/Chip.svelte @@ -68,7 +68,7 @@ ActionArray, } from '@smui/common/internal'; import Ripple from '@smui/ripple'; - import Div from '@smui/common/Div.svelte'; + import { Div } from '@smui/common/elements'; import type { SMUIChipsPrimaryActionAccessor } from './Text.types'; import type { SMUIChipsTrailingActionAccessor } from './TrailingAction.types'; diff --git a/packages/chips/Chip.types.ts b/packages/chips/Chip.types.ts index 7d4a7ad2b..ac2a6557d 100644 --- a/packages/chips/Chip.types.ts +++ b/packages/chips/Chip.types.ts @@ -1,3 +1,23 @@ +import type { SMUIComponent } from '@smui/common'; +import type Component from './Chip.svelte'; +import type { DivComponentDev as DivElementComponentDev } from '@smui/common/elements'; + +export declare class ChipComponentDev< + C extends SMUIComponent = DivElementComponentDev +> extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} + export interface SMUIChipsChipAccessor { chipId: any; readonly selected: boolean; diff --git a/packages/chips/LeadingIcon.types.ts b/packages/chips/LeadingIcon.types.ts new file mode 100644 index 000000000..1fdf32d0a --- /dev/null +++ b/packages/chips/LeadingIcon.types.ts @@ -0,0 +1,15 @@ +import type Component from './LeadingIcon.svelte'; + +export declare class LeadingIconComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/chips/Set.svelte b/packages/chips/Set.svelte index 659d8c2a7..b109dc5c2 100644 --- a/packages/chips/Set.svelte +++ b/packages/chips/Set.svelte @@ -50,7 +50,7 @@ useActions, ActionArray, } from '@smui/common/internal'; - import ContextFragment from '@smui/common/ContextFragment.svelte'; + import { ContextFragment } from '@smui/common'; import type { SMUIChipsChipAccessor } from './Chip.types'; diff --git a/packages/chips/Set.types.ts b/packages/chips/Set.types.ts new file mode 100644 index 000000000..7227a472f --- /dev/null +++ b/packages/chips/Set.types.ts @@ -0,0 +1,15 @@ +import type Component from './Set.svelte'; + +export declare class SetComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/chips/Text.types.ts b/packages/chips/Text.types.ts index 7a1978bc5..53b8ef4f0 100644 --- a/packages/chips/Text.types.ts +++ b/packages/chips/Text.types.ts @@ -1,3 +1,19 @@ +import type Component from './Text.svelte'; + +export declare class TextComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} + export interface SMUIChipsPrimaryActionAccessor { focus(): void; addAttr(name: string, value: string): void; diff --git a/packages/chips/TrailingAction.types.ts b/packages/chips/TrailingAction.types.ts index 6042c1e6b..c653ce4f1 100644 --- a/packages/chips/TrailingAction.types.ts +++ b/packages/chips/TrailingAction.types.ts @@ -1,3 +1,26 @@ +import type Component from './TrailingAction.svelte'; + +export declare class TrailingActionComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + { + [k in keyof Partial< + svelte.JSX.HTMLAttributes + > as `icon\$${k}`]?: Partial< + svelte.JSX.HTMLAttributes + >[k]; + } & + Component['$$prop_def']; +} + export interface SMUIChipsTrailingActionAccessor { isNavigable(): boolean; focus(): void; diff --git a/packages/chips/TrailingIcon.types.ts b/packages/chips/TrailingIcon.types.ts new file mode 100644 index 000000000..f10905381 --- /dev/null +++ b/packages/chips/TrailingIcon.types.ts @@ -0,0 +1,15 @@ +import type Component from './TrailingIcon.svelte'; + +export declare class TrailingIconComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/chips/ambient.d.ts b/packages/chips/ambient.d.ts index fbbf0d639..052bc8550 100644 --- a/packages/chips/ambient.d.ts +++ b/packages/chips/ambient.d.ts @@ -1,4 +1,6 @@ declare namespace svelte.JSX { + interface HTMLAttributes {} + interface HTMLProps extends HTMLAttributes { ['onSMUIChipsChip:mount']?: ( event: CustomEvent & { target: T } diff --git a/packages/chips/index.ts b/packages/chips/index.ts index 9716d2ce0..b12025b5c 100644 --- a/packages/chips/index.ts +++ b/packages/chips/index.ts @@ -1,14 +1,28 @@ import Chip from './Chip.svelte'; +import type { ChipComponentDev } from './Chip.types'; export * from './Chip.types'; -import Set from './Set.svelte'; -import Text from './Text.svelte'; +import SetComponent from './Set.svelte'; +import type { SetComponentDev } from './Set.types'; +export * from './Set.types'; +const Set = SetComponent as typeof SetComponentDev; +import TextComponent from './Text.svelte'; +import type { TextComponentDev } from './Text.types'; export * from './Text.types'; -import LeadingIcon from './LeadingIcon.svelte'; -import TrailingIcon from './TrailingIcon.svelte'; -import TrailingAction from './TrailingAction.svelte'; +const Text = TextComponent as typeof TextComponentDev; +import LeadingIconComponent from './LeadingIcon.svelte'; +import type { LeadingIconComponentDev } from './LeadingIcon.types'; +export * from './LeadingIcon.types'; +const LeadingIcon = LeadingIconComponent as typeof LeadingIconComponentDev; +import TrailingIconComponent from './TrailingIcon.svelte'; +import type { TrailingIconComponentDev } from './TrailingIcon.types'; +export * from './TrailingIcon.types'; +const TrailingIcon = TrailingIconComponent as typeof TrailingIconComponentDev; +import TrailingActionComponent from './TrailingAction.svelte'; +import type { TrailingActionComponentDev } from './TrailingAction.types'; export * from './TrailingAction.types'; +const TrailingAction = TrailingActionComponent as typeof TrailingActionComponentDev; -export default Chip; +export default Chip as typeof ChipComponentDev; export { Set, Text, LeadingIcon, TrailingIcon, TrailingAction }; diff --git a/packages/circular-progress/CircularProgress.types.ts b/packages/circular-progress/CircularProgress.types.ts new file mode 100644 index 000000000..2e6947494 --- /dev/null +++ b/packages/circular-progress/CircularProgress.types.ts @@ -0,0 +1,15 @@ +import type Component from './CircularProgress.svelte'; + +export declare class CircularProgressComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/circular-progress/ambient.d.ts b/packages/circular-progress/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/circular-progress/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/circular-progress/index.ts b/packages/circular-progress/index.ts index 52139e6a4..bf6503773 100644 --- a/packages/circular-progress/index.ts +++ b/packages/circular-progress/index.ts @@ -1,3 +1,5 @@ import CircularProgress from './CircularProgress.svelte'; +import type { CircularProgressComponentDev } from './CircularProgress.types'; +export * from './CircularProgress.types'; -export default CircularProgress; +export default CircularProgress as typeof CircularProgressComponentDev; diff --git a/packages/common/A.types.ts b/packages/common/A.types.ts new file mode 100644 index 000000000..578176a88 --- /dev/null +++ b/packages/common/A.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './A.svelte'; + +export declare class AComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Aside.types.ts b/packages/common/Aside.types.ts new file mode 100644 index 000000000..208b39dca --- /dev/null +++ b/packages/common/Aside.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Aside.svelte'; + +export declare class AsideComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Button.types.ts b/packages/common/Button.types.ts new file mode 100644 index 000000000..37b75a000 --- /dev/null +++ b/packages/common/Button.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Button.svelte'; + +export declare class ButtonComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/ClassAdder/index.types.ts b/packages/common/ClassAdder/index.types.ts index 4c4fbbefc..8f851043c 100644 --- a/packages/common/ClassAdder/index.types.ts +++ b/packages/common/ClassAdder/index.types.ts @@ -1,7 +1,7 @@ import type { SMUIComponent } from '../SMUIComponent.d'; -export type ClassAdderInternals = { - component: typeof SMUIComponent; +export type ClassAdderInternals = { + component: T; class: string; /** * Map of name to context name. The context should resolve to a Svelte store, diff --git a/packages/common/CommonIcon.types.ts b/packages/common/CommonIcon.types.ts new file mode 100644 index 000000000..84a3e15b0 --- /dev/null +++ b/packages/common/CommonIcon.types.ts @@ -0,0 +1,19 @@ +import type { SMUIComponent } from './SMUIComponent'; +import type Component from './CommonIcon.svelte'; +import type { IComponentDev } from './I.types'; + +export declare class CommonIconComponentDev< + C extends SMUIComponent = IComponentDev +> extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/CommonLabel.types.ts b/packages/common/CommonLabel.types.ts new file mode 100644 index 000000000..97ba7c7fe --- /dev/null +++ b/packages/common/CommonLabel.types.ts @@ -0,0 +1,19 @@ +import type { SMUIComponent } from './SMUIComponent'; +import type Component from './CommonLabel.svelte'; +import type { SpanComponentDev } from './Span.types'; + +export declare class CommonLabelComponentDev< + C extends SMUIComponent = SpanComponentDev +> extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Div.types.ts b/packages/common/Div.types.ts new file mode 100644 index 000000000..49f789c17 --- /dev/null +++ b/packages/common/Div.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Div.svelte'; + +export declare class DivComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Em.types.ts b/packages/common/Em.types.ts new file mode 100644 index 000000000..a03ce9c10 --- /dev/null +++ b/packages/common/Em.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Em.svelte'; + +export declare class EmComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Footer.types.ts b/packages/common/Footer.types.ts new file mode 100644 index 000000000..fb73486fa --- /dev/null +++ b/packages/common/Footer.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Footer.svelte'; + +export declare class FooterComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/H1.types.ts b/packages/common/H1.types.ts new file mode 100644 index 000000000..e2001353b --- /dev/null +++ b/packages/common/H1.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './H1.svelte'; + +export declare class H1ComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/H2.types.ts b/packages/common/H2.types.ts new file mode 100644 index 000000000..36191a263 --- /dev/null +++ b/packages/common/H2.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './H2.svelte'; + +export declare class H2ComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/H3.types.ts b/packages/common/H3.types.ts new file mode 100644 index 000000000..e1eabe5d0 --- /dev/null +++ b/packages/common/H3.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './H3.svelte'; + +export declare class H3ComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/H4.types.ts b/packages/common/H4.types.ts new file mode 100644 index 000000000..d80a90476 --- /dev/null +++ b/packages/common/H4.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './H4.svelte'; + +export declare class H4ComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/H5.types.ts b/packages/common/H5.types.ts new file mode 100644 index 000000000..8182e1d38 --- /dev/null +++ b/packages/common/H5.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './H5.svelte'; + +export declare class H5ComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/H6.types.ts b/packages/common/H6.types.ts new file mode 100644 index 000000000..d133f0d15 --- /dev/null +++ b/packages/common/H6.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './H6.svelte'; + +export declare class H6ComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Header.types.ts b/packages/common/Header.types.ts new file mode 100644 index 000000000..9fd20b9e6 --- /dev/null +++ b/packages/common/Header.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Header.svelte'; + +export declare class HeaderComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Hr.types.ts b/packages/common/Hr.types.ts new file mode 100644 index 000000000..6abaf19e9 --- /dev/null +++ b/packages/common/Hr.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Hr.svelte'; + +export declare class HrComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/I.types.ts b/packages/common/I.types.ts new file mode 100644 index 000000000..6bfa633c9 --- /dev/null +++ b/packages/common/I.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './I.svelte'; + +export declare class IComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Img.types.ts b/packages/common/Img.types.ts new file mode 100644 index 000000000..9cf20f1d2 --- /dev/null +++ b/packages/common/Img.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Img.svelte'; + +export declare class ImgComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Li.types.ts b/packages/common/Li.types.ts new file mode 100644 index 000000000..af9fd51f9 --- /dev/null +++ b/packages/common/Li.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Li.svelte'; + +export declare class LiComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Main.types.ts b/packages/common/Main.types.ts new file mode 100644 index 000000000..6ffe92eb3 --- /dev/null +++ b/packages/common/Main.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Main.svelte'; + +export declare class MainComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Nav.types.ts b/packages/common/Nav.types.ts new file mode 100644 index 000000000..06e5ebf63 --- /dev/null +++ b/packages/common/Nav.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Nav.svelte'; + +export declare class NavComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/P.svelte b/packages/common/P.svelte new file mode 100644 index 000000000..3a5e219c6 --- /dev/null +++ b/packages/common/P.svelte @@ -0,0 +1,20 @@ +

+ +

+ + diff --git a/packages/common/P.types.ts b/packages/common/P.types.ts new file mode 100644 index 000000000..a777e7954 --- /dev/null +++ b/packages/common/P.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './P.svelte'; + +export declare class PComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/README.md b/packages/common/README.md index 90aac421f..ad57c24bd 100644 --- a/packages/common/README.md +++ b/packages/common/README.md @@ -150,6 +150,10 @@ An elemental component for the `main` tag. An elemental component for the `nav` tag. +## P.svelte + +An elemental component for the `p` tag. + ## Section.svelte An elemental component for the `section` tag. @@ -182,7 +186,7 @@ Use this to build a ClassAdder component. ClassAdder components are useful for r ```js import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'my-added-class', diff --git a/packages/common/Section.types.ts b/packages/common/Section.types.ts new file mode 100644 index 000000000..2bc451c63 --- /dev/null +++ b/packages/common/Section.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Section.svelte'; + +export declare class SectionComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Span.types.ts b/packages/common/Span.types.ts new file mode 100644 index 000000000..36d3d87f1 --- /dev/null +++ b/packages/common/Span.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Span.svelte'; + +export declare class SpanComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Strong.types.ts b/packages/common/Strong.types.ts new file mode 100644 index 000000000..b3f4ad662 --- /dev/null +++ b/packages/common/Strong.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Strong.svelte'; + +export declare class StrongComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Svg.types.ts b/packages/common/Svg.types.ts new file mode 100644 index 000000000..3a7b466ed --- /dev/null +++ b/packages/common/Svg.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Svg.svelte'; + +export declare class SvgComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/Ul.types.ts b/packages/common/Ul.types.ts new file mode 100644 index 000000000..127c03996 --- /dev/null +++ b/packages/common/Ul.types.ts @@ -0,0 +1,16 @@ +import type { SMUIComponent } from './SMUIComponent.d'; +import type Component from './Ul.svelte'; + +export declare class UlComponentDev extends SMUIComponent { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/common/ambient.d.ts b/packages/common/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/common/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/common/classAdderBuilder.ts b/packages/common/classAdderBuilder.ts index eaac474f3..daac59bb4 100644 --- a/packages/common/classAdderBuilder.ts +++ b/packages/common/classAdderBuilder.ts @@ -1,9 +1,12 @@ import type { ClassAdderInternals } from './ClassAdder/index.types'; import ClassAdder, { internals } from './ClassAdder/index.svelte'; +import type { SMUIComponent } from './SMUIComponent'; const defaults = { ...internals }; -export function classAdderBuilder(props: Partial) { +export function classAdderBuilder( + props: Partial> +) { return new Proxy(ClassAdder, { construct: function (target, args) { Object.assign(internals, defaults, props); @@ -14,5 +17,5 @@ export function classAdderBuilder(props: Partial) { Object.assign(internals, defaults, props); return (target as any)[prop]; }, - }); + }) as T; } diff --git a/packages/common/elements.ts b/packages/common/elements.ts new file mode 100644 index 000000000..db9924fd2 --- /dev/null +++ b/packages/common/elements.ts @@ -0,0 +1,149 @@ +import AComponent from './A.svelte'; +import type { AComponentDev } from './A.types'; +export * from './A.types'; +const A = AComponent as typeof AComponentDev; +export { A }; + +import AsideComponent from './Aside.svelte'; +import type { AsideComponentDev } from './Aside.types'; +export * from './Aside.types'; +const Aside = AsideComponent as typeof AsideComponentDev; +export { Aside }; + +import ButtonComponent from './Button.svelte'; +import type { ButtonComponentDev } from './Button.types'; +export * from './Button.types'; +const Button = ButtonComponent as typeof ButtonComponentDev; +export { Button }; + +import DivComponent from './Div.svelte'; +import type { DivComponentDev } from './Div.types'; +export * from './Div.types'; +const Div = DivComponent as typeof DivComponentDev; +export { Div }; + +import EmComponent from './Em.svelte'; +import type { EmComponentDev } from './Em.types'; +export * from './Em.types'; +const Em = EmComponent as typeof EmComponentDev; +export { Em }; + +import FooterComponent from './Footer.svelte'; +import type { FooterComponentDev } from './Footer.types'; +export * from './Footer.types'; +const Footer = FooterComponent as typeof FooterComponentDev; +export { Footer }; + +import H1Component from './H1.svelte'; +import type { H1ComponentDev } from './H1.types'; +export * from './H1.types'; +const H1 = H1Component as typeof H1ComponentDev; +export { H1 }; + +import H2Component from './H2.svelte'; +import type { H2ComponentDev } from './H2.types'; +export * from './H2.types'; +const H2 = H2Component as typeof H2ComponentDev; +export { H2 }; + +import H3Component from './H3.svelte'; +import type { H3ComponentDev } from './H3.types'; +export * from './H3.types'; +const H3 = H3Component as typeof H3ComponentDev; +export { H3 }; + +import H4Component from './H4.svelte'; +import type { H4ComponentDev } from './H4.types'; +export * from './H4.types'; +const H4 = H4Component as typeof H4ComponentDev; +export { H4 }; + +import H5Component from './H5.svelte'; +import type { H5ComponentDev } from './H5.types'; +export * from './H5.types'; +const H5 = H5Component as typeof H5ComponentDev; +export { H5 }; + +import H6Component from './H6.svelte'; +import type { H6ComponentDev } from './H6.types'; +export * from './H6.types'; +const H6 = H6Component as typeof H6ComponentDev; +export { H6 }; + +import HeaderComponent from './Header.svelte'; +import type { HeaderComponentDev } from './Header.types'; +export * from './Header.types'; +const Header = HeaderComponent as typeof HeaderComponentDev; +export { Header }; + +import HrComponent from './Hr.svelte'; +import type { HrComponentDev } from './Hr.types'; +export * from './Hr.types'; +const Hr = HrComponent as typeof HrComponentDev; +export { Hr }; + +import IComponent from './I.svelte'; +import type { IComponentDev } from './I.types'; +export * from './I.types'; +const I = IComponent as typeof IComponentDev; +export { I }; + +import ImgComponent from './Img.svelte'; +import type { ImgComponentDev } from './Img.types'; +export * from './Img.types'; +const Img = ImgComponent as typeof ImgComponentDev; +export { Img }; + +import LiComponent from './Li.svelte'; +import type { LiComponentDev } from './Li.types'; +export * from './Li.types'; +const Li = LiComponent as typeof LiComponentDev; +export { Li }; + +import MainComponent from './Main.svelte'; +import type { MainComponentDev } from './Main.types'; +export * from './Main.types'; +const Main = MainComponent as typeof MainComponentDev; +export { Main }; + +import NavComponent from './Nav.svelte'; +import type { NavComponentDev } from './Nav.types'; +export * from './Nav.types'; +const Nav = NavComponent as typeof NavComponentDev; +export { Nav }; + +import PComponent from './P.svelte'; +import type { PComponentDev } from './P.types'; +export * from './P.types'; +const P = PComponent as typeof PComponentDev; +export { P }; + +import SectionComponent from './Section.svelte'; +import type { SectionComponentDev } from './Section.types'; +export * from './Section.types'; +const Section = SectionComponent as typeof SectionComponentDev; +export { Section }; + +import SpanComponent from './Span.svelte'; +import type { SpanComponentDev } from './Span.types'; +export * from './Span.types'; +const Span = SpanComponent as typeof SpanComponentDev; +export { Span }; + +import StrongComponent from './Strong.svelte'; +import type { StrongComponentDev } from './Strong.types'; +export * from './Strong.types'; +const Strong = StrongComponent as typeof StrongComponentDev; +export { Strong }; + +import SvgComponent from './Svg.svelte'; +import type { SvgComponentDev } from './Svg.types'; +export * from './Svg.types'; +const Svg = SvgComponent as typeof SvgComponentDev; +export { Svg }; + +import UlComponent from './Ul.svelte'; +import type { UlComponentDev } from './Ul.types'; +export * from './Ul.types'; +const Ul = UlComponent as typeof UlComponentDev; +export { Ul }; diff --git a/packages/common/index.ts b/packages/common/index.ts index 0dc5217e1..fc1fa26ca 100644 --- a/packages/common/index.ts +++ b/packages/common/index.ts @@ -1,7 +1,16 @@ -import Label from './CommonLabel.svelte'; -import Icon from './CommonIcon.svelte'; +import LabelComponent from './CommonLabel.svelte'; +import type { CommonLabelComponentDev } from './CommonLabel.types'; +export * from './CommonLabel.types'; +const Label = LabelComponent as typeof CommonLabelComponentDev; -export { Label, Icon }; +import IconComponent from './CommonIcon.svelte'; +import type { CommonIconComponentDev } from './CommonIcon.types'; +export * from './CommonIcon.types'; +const Icon = IconComponent as typeof CommonIconComponentDev; + +import ContextFragment from './ContextFragment.svelte'; + +export { Label, Icon, ContextFragment }; export * from './SMUIComponent.d'; export * from './SMUIInputAccessors.d'; export * from './LayoutListener.d'; diff --git a/packages/common/prefixFilter.ts b/packages/common/prefixFilter.ts index 5231673e4..d19e004dc 100644 --- a/packages/common/prefixFilter.ts +++ b/packages/common/prefixFilter.ts @@ -1,14 +1,14 @@ -export function prefixFilter< - T extends { [k: string]: any }, - R extends { [k: string]: any } ->(obj: T, prefix: string): R { +export function prefixFilter( + obj: { [k: string]: any }, + prefix: string +): { [k: string]: any } { let names = Object.getOwnPropertyNames(obj); - const newObj: R = {} as R; + const newObj: { [k: string]: any } = {}; for (let i = 0; i < names.length; i++) { const name = names[i]; if (name.substring(0, prefix.length) === prefix) { - newObj[name.substring(prefix.length) as keyof R] = obj[name]; + newObj[name.substring(prefix.length)] = obj[name]; } } diff --git a/packages/data-table/Body.types.ts b/packages/data-table/Body.types.ts index 87df5bf52..5e5fc387f 100644 --- a/packages/data-table/Body.types.ts +++ b/packages/data-table/Body.types.ts @@ -1,3 +1,19 @@ +import type Component from './Body.svelte'; + +export declare class BodyComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} + import type { SMUIDataTableRowAccessor } from './Row.types'; export interface SMUIDataTableBodyAccessor { diff --git a/packages/data-table/Cell.types.ts b/packages/data-table/Cell.types.ts index 57ce3fb12..95302f385 100644 --- a/packages/data-table/Cell.types.ts +++ b/packages/data-table/Cell.types.ts @@ -1,3 +1,19 @@ +import type Component from './Cell.svelte'; + +export declare class CellComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} + interface SMUIDataTableHeaderCellAccessor { _smui_data_table_header_cell_accessor: true; readonly columnId: string; diff --git a/packages/data-table/DataTable.types.ts b/packages/data-table/DataTable.types.ts index a08e76afd..d78c5cb6f 100644 --- a/packages/data-table/DataTable.types.ts +++ b/packages/data-table/DataTable.types.ts @@ -1 +1,31 @@ +import type Component from './DataTable.svelte'; + +export declare class DataTableComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + { + [k in keyof Partial< + svelte.JSX.HTMLAttributes + > as `container\$${k}`]?: Partial< + svelte.JSX.HTMLAttributes + >[k]; + } & + { + [k in keyof Partial< + svelte.JSX.HTMLAttributes + > as `table\$${k}`]?: Partial< + svelte.JSX.HTMLAttributes + >[k]; + } & + Component['$$prop_def']; +} + export { SortValue } from '@material/data-table'; diff --git a/packages/data-table/Head.types.ts b/packages/data-table/Head.types.ts index 858e3d1b0..18085fd0b 100644 --- a/packages/data-table/Head.types.ts +++ b/packages/data-table/Head.types.ts @@ -1,3 +1,19 @@ +import type Component from './Head.svelte'; + +export declare class HeadComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} + import type { SMUICheckboxInputAccessor } from '@smui/common'; import type { SMUIDataTableCellAccessor } from './Cell.types'; diff --git a/packages/data-table/Pagination.types.ts b/packages/data-table/Pagination.types.ts new file mode 100644 index 000000000..a10f2dc69 --- /dev/null +++ b/packages/data-table/Pagination.types.ts @@ -0,0 +1,22 @@ +import type Component from './Pagination.svelte'; + +export declare class PaginationComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + { + [k in keyof Partial< + svelte.JSX.HTMLAttributes + > as `trailing\$${k}`]?: Partial< + svelte.JSX.HTMLAttributes + >[k]; + } & + Component['$$prop_def']; +} diff --git a/packages/data-table/Row.types.ts b/packages/data-table/Row.types.ts index e9e055b2c..ecb71ca7b 100644 --- a/packages/data-table/Row.types.ts +++ b/packages/data-table/Row.types.ts @@ -1,3 +1,19 @@ +import type Component from './Row.svelte'; + +export declare class RowComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} + import type { SMUICheckboxInputAccessor } from '@smui/common'; interface SMUIDataTableHeaderRowAccessor { diff --git a/packages/data-table/ambient.d.ts b/packages/data-table/ambient.d.ts index 6dc36394e..82e157f2e 100644 --- a/packages/data-table/ambient.d.ts +++ b/packages/data-table/ambient.d.ts @@ -1,4 +1,6 @@ declare namespace svelte.JSX { + interface HTMLAttributes {} + interface HTMLProps extends HTMLAttributes { ['onSMUICheckbox:mount']?: (event: CustomEvent & { target: T }) => any; ['onSMUICheckbox:unmount']?: ( diff --git a/packages/data-table/index.ts b/packages/data-table/index.ts index c1d83fd16..8a545c6db 100644 --- a/packages/data-table/index.ts +++ b/packages/data-table/index.ts @@ -1,17 +1,29 @@ import DataTable from './DataTable.svelte'; +import type { DataTableComponentDev } from './DataTable.types'; export * from './DataTable.types'; -import Head from './Head.svelte'; +import HeadComponent from './Head.svelte'; +import type { HeadComponentDev } from './Head.types'; export * from './Head.types'; -import Body from './Body.svelte'; +const Head = HeadComponent as typeof HeadComponentDev; +import BodyComponent from './Body.svelte'; +import type { BodyComponentDev } from './Body.types'; export * from './Body.types'; -import Row from './Row.svelte'; +const Body = BodyComponent as typeof BodyComponentDev; +import RowComponent from './Row.svelte'; +import type { RowComponentDev } from './Row.types'; export * from './Row.types'; -import Cell from './Cell.svelte'; +const Row = RowComponent as typeof RowComponentDev; +import CellComponent from './Cell.svelte'; +import type { CellComponentDev } from './Cell.types'; export * from './Cell.types'; -import Pagination from './Pagination.svelte'; +const Cell = CellComponent as typeof CellComponentDev; +import PaginationComponent from './Pagination.svelte'; +import type { PaginationComponentDev } from './Pagination.types'; +export * from './Pagination.types'; +const Pagination = PaginationComponent as typeof PaginationComponentDev; import { Label } from '@smui/common'; -export default DataTable; +export default DataTable as typeof DataTableComponentDev; export { Head, Body, Row, Cell, Pagination, Label }; diff --git a/packages/dialog/Actions.ts b/packages/dialog/Actions.ts index d7b15d6ee..9dc0c3b13 100644 --- a/packages/dialog/Actions.ts +++ b/packages/dialog/Actions.ts @@ -1,10 +1,9 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-dialog__actions', - component: Div as typeof SMUIComponent, + component: Div, classMap: { 'smui-dialog__actions--reversed': 'SMUI:dialog:actions:reversed', }, diff --git a/packages/dialog/Content.ts b/packages/dialog/Content.ts index 78fcf0883..0dd31652c 100644 --- a/packages/dialog/Content.ts +++ b/packages/dialog/Content.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-dialog__content', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/dialog/Dialog.types.ts b/packages/dialog/Dialog.types.ts new file mode 100644 index 000000000..9c4686623 --- /dev/null +++ b/packages/dialog/Dialog.types.ts @@ -0,0 +1,29 @@ +import type Component from './Dialog.svelte'; + +export declare class DialogComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + { + [k in keyof Partial< + svelte.JSX.HTMLAttributes + > as `container\$${k}`]?: Partial< + svelte.JSX.HTMLAttributes + >[k]; + } & + { + [k in keyof Partial< + svelte.JSX.HTMLAttributes + > as `surface\$${k}`]?: Partial< + svelte.JSX.HTMLAttributes + >[k]; + } & + Component['$$prop_def']; +} diff --git a/packages/dialog/Header.ts b/packages/dialog/Header.ts index 729b94496..ec47c940c 100644 --- a/packages/dialog/Header.ts +++ b/packages/dialog/Header.ts @@ -1,10 +1,9 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-dialog__header', - component: Div as typeof SMUIComponent, + component: Div, contexts: { 'SMUI:icon-button:context': 'dialog:header', }, diff --git a/packages/dialog/Title.ts b/packages/dialog/Title.ts index 725b37473..0bc216ef6 100644 --- a/packages/dialog/Title.ts +++ b/packages/dialog/Title.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import H2 from '@smui/common/H2.svelte'; +import { H2 } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-dialog__title', - component: H2 as typeof SMUIComponent, + component: H2, }); diff --git a/packages/dialog/ambient.d.ts b/packages/dialog/ambient.d.ts index 415387a77..df3d2a84e 100644 --- a/packages/dialog/ambient.d.ts +++ b/packages/dialog/ambient.d.ts @@ -1,4 +1,6 @@ declare namespace svelte.JSX { + interface HTMLAttributes {} + interface HTMLProps extends HTMLAttributes { ['onMDCDialog:opening']?: (event: CustomEvent & { target: T }) => any; ['onMDCDialog:opened']?: (event: CustomEvent & { target: T }) => any; diff --git a/packages/dialog/index.ts b/packages/dialog/index.ts index 4a4ce0fe4..470f01046 100644 --- a/packages/dialog/index.ts +++ b/packages/dialog/index.ts @@ -1,4 +1,6 @@ import Dialog from './Dialog.svelte'; +import type { DialogComponentDev } from './Dialog.types'; +export * from './Dialog.types'; import Header from './Header'; import Title from './Title'; @@ -6,6 +8,6 @@ import Content from './Content'; import Actions from './Actions'; import InitialFocus from './InitialFocus'; -export default Dialog; +export default Dialog as typeof DialogComponentDev; export { Header, Title, Content, Actions, InitialFocus }; diff --git a/packages/drawer/AppContent.ts b/packages/drawer/AppContent.ts index 596b9451a..f600de07e 100644 --- a/packages/drawer/AppContent.ts +++ b/packages/drawer/AppContent.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-drawer-app-content', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/drawer/Content.ts b/packages/drawer/Content.ts index 42bf0c222..50bb0ef60 100644 --- a/packages/drawer/Content.ts +++ b/packages/drawer/Content.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-drawer__content', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/drawer/Drawer.types.ts b/packages/drawer/Drawer.types.ts new file mode 100644 index 000000000..cf2fde6e8 --- /dev/null +++ b/packages/drawer/Drawer.types.ts @@ -0,0 +1,15 @@ +import type Component from './Drawer.svelte'; + +export declare class DrawerComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/drawer/Header.ts b/packages/drawer/Header.ts index 86a6ec56d..8e6683f42 100644 --- a/packages/drawer/Header.ts +++ b/packages/drawer/Header.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-drawer__header', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/drawer/Scrim.svelte b/packages/drawer/Scrim.svelte index d8860d8ad..c6b1fdf9e 100644 --- a/packages/drawer/Scrim.svelte +++ b/packages/drawer/Scrim.svelte @@ -22,7 +22,7 @@ dispatch, ActionArray, } from '@smui/common/internal'; - import Div from '@smui/common/Div.svelte'; + import { Div } from '@smui/common/elements'; const forwardEvents = forwardEventsBuilder(get_current_component()); diff --git a/packages/drawer/Scrim.types.ts b/packages/drawer/Scrim.types.ts new file mode 100644 index 000000000..73ffef3d1 --- /dev/null +++ b/packages/drawer/Scrim.types.ts @@ -0,0 +1,19 @@ +import type { SMUIComponent } from '@smui/common'; +import type Component from './Scrim.svelte'; +import type { DivComponentDev as DivElementComponentDev } from '@smui/common/elements'; + +export declare class ScrimComponentDev< + C extends SMUIComponent = DivElementComponentDev +> extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/drawer/Subtitle.ts b/packages/drawer/Subtitle.ts index 26ee16e17..1b424ccc6 100644 --- a/packages/drawer/Subtitle.ts +++ b/packages/drawer/Subtitle.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import H2 from '@smui/common/H2.svelte'; +import { H2 } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-drawer__subtitle', - component: H2 as typeof SMUIComponent, + component: H2, }); diff --git a/packages/drawer/Title.ts b/packages/drawer/Title.ts index cf365a8ca..8a186347a 100644 --- a/packages/drawer/Title.ts +++ b/packages/drawer/Title.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import H1 from '@smui/common/H1.svelte'; +import { H1 } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-drawer__title', - component: H1 as typeof SMUIComponent, + component: H1, }); diff --git a/packages/drawer/ambient.d.ts b/packages/drawer/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/drawer/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/drawer/index.ts b/packages/drawer/index.ts index 6419c6450..131ddd402 100644 --- a/packages/drawer/index.ts +++ b/packages/drawer/index.ts @@ -1,12 +1,17 @@ import Drawer from './Drawer.svelte'; +import type { DrawerComponentDev } from './Drawer.types'; +export * from './Drawer.types'; import AppContent from './AppContent'; import Content from './Content'; import Header from './Header'; import Title from './Title'; import Subtitle from './Subtitle'; -import Scrim from './Scrim.svelte'; +import ScrimComponent from './Scrim.svelte'; +import type { ScrimComponentDev } from './Scrim.types'; +export * from './Scrim.types'; +const Scrim = ScrimComponent as typeof ScrimComponentDev; -export default Drawer; +export default Drawer as typeof DrawerComponentDev; export { AppContent, Content, Header, Title, Subtitle, Scrim }; diff --git a/packages/fab/Fab.svelte b/packages/fab/Fab.svelte index 8fb675c9c..01b2061c2 100644 --- a/packages/fab/Fab.svelte +++ b/packages/fab/Fab.svelte @@ -47,8 +47,7 @@ ActionArray, } from '@smui/common/internal'; import Ripple from '@smui/ripple'; - import A from '@smui/common/A.svelte'; - import Button from '@smui/common/Button.svelte'; + import { A, Button } from '@smui/common/elements'; const forwardEvents = forwardEventsBuilder(get_current_component()); diff --git a/packages/fab/Fab.types.ts b/packages/fab/Fab.types.ts new file mode 100644 index 000000000..c1bd52fe7 --- /dev/null +++ b/packages/fab/Fab.types.ts @@ -0,0 +1,19 @@ +import type { SMUIComponent } from '@smui/common'; +import type Component from './Fab.svelte'; +import type { ButtonComponentDev as ButtonElementComponentDev } from '@smui/common/elements'; + +export declare class FabComponentDev< + C extends SMUIComponent = ButtonElementComponentDev +> extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/fab/ambient.d.ts b/packages/fab/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/fab/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/fab/index.ts b/packages/fab/index.ts index c494ce5df..686ac18b7 100644 --- a/packages/fab/index.ts +++ b/packages/fab/index.ts @@ -1,7 +1,9 @@ import Fab from './Fab.svelte'; +import type { FabComponentDev } from './Fab.types'; +export * from './Fab.types'; import { Label, Icon } from '@smui/common'; -export default Fab; +export default Fab as typeof FabComponentDev; export { Label, Icon }; diff --git a/packages/floating-label/FloatingLabel.types.ts b/packages/floating-label/FloatingLabel.types.ts index e5d1d7178..0d3e2bce7 100644 --- a/packages/floating-label/FloatingLabel.types.ts +++ b/packages/floating-label/FloatingLabel.types.ts @@ -1,3 +1,18 @@ +import type Component from './FloatingLabel.svelte'; + +export declare class FloatingLabelComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Partial< + svelte.JSX.HTMLAttributes + > & + Component['$$prop_def']; +} + export interface SMUIFloatingLabelAccessor { readonly element: HTMLSpanElement | HTMLLabelElement; addStyle(name: string, value: string): void; diff --git a/packages/floating-label/ambient.d.ts b/packages/floating-label/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/floating-label/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/floating-label/index.ts b/packages/floating-label/index.ts index 40d355fbb..311abbd40 100644 --- a/packages/floating-label/index.ts +++ b/packages/floating-label/index.ts @@ -1,4 +1,5 @@ import FloatingLabel from './FloatingLabel.svelte'; +import type { FloatingLabelComponentDev } from './FloatingLabel.types'; export * from './FloatingLabel.types'; -export default FloatingLabel; +export default FloatingLabel as typeof FloatingLabelComponentDev; diff --git a/packages/form-field/FormField.types.ts b/packages/form-field/FormField.types.ts new file mode 100644 index 000000000..de7dea933 --- /dev/null +++ b/packages/form-field/FormField.types.ts @@ -0,0 +1,22 @@ +import type Component from './FormField.svelte'; + +export declare class FormFieldComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + { + [k in keyof Partial< + svelte.JSX.HTMLAttributes + > as `label\$${k}`]?: Partial< + svelte.JSX.HTMLAttributes + >[k]; + } & + Component['$$prop_def']; +} diff --git a/packages/form-field/ambient.d.ts b/packages/form-field/ambient.d.ts index b08ae4423..b26d8dddb 100644 --- a/packages/form-field/ambient.d.ts +++ b/packages/form-field/ambient.d.ts @@ -1,4 +1,6 @@ declare namespace svelte.JSX { + interface HTMLAttributes {} + interface HTMLProps extends HTMLAttributes { ['onSMUIGenericInput:mount']?: ( event: CustomEvent & { target: T } diff --git a/packages/form-field/index.ts b/packages/form-field/index.ts index 7584b2a1e..024d40818 100644 --- a/packages/form-field/index.ts +++ b/packages/form-field/index.ts @@ -1,3 +1,5 @@ import FormField from './FormField.svelte'; +import type { FormFieldComponentDev } from './FormField.types'; +export * from './FormField.types'; -export default FormField; +export default FormField as typeof FormFieldComponentDev; diff --git a/packages/icon-button/IconButton.svelte b/packages/icon-button/IconButton.svelte index 9dec3916c..9f1fa7967 100644 --- a/packages/icon-button/IconButton.svelte +++ b/packages/icon-button/IconButton.svelte @@ -70,8 +70,7 @@ ActionArray, } from '@smui/common/internal'; import Ripple from '@smui/ripple'; - import A from '@smui/common/A.svelte'; - import Button from '@smui/common/Button.svelte'; + import { A, Button } from '@smui/common/elements'; const forwardEvents = forwardEventsBuilder(get_current_component()); interface UninitializedValue extends Function {} diff --git a/packages/icon-button/IconButton.types.ts b/packages/icon-button/IconButton.types.ts new file mode 100644 index 000000000..8c31bdbe0 --- /dev/null +++ b/packages/icon-button/IconButton.types.ts @@ -0,0 +1,19 @@ +import type { SMUIComponent } from '@smui/common'; +import type Component from './IconButton.svelte'; +import type { ButtonComponentDev as ButtonElementComponentDev } from '@smui/common/elements'; + +export declare class IconButtonComponentDev< + C extends SMUIComponent = ButtonElementComponentDev +> extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/icon-button/ambient.d.ts b/packages/icon-button/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/icon-button/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/icon-button/index.ts b/packages/icon-button/index.ts index 1c92e45ad..e88440a02 100644 --- a/packages/icon-button/index.ts +++ b/packages/icon-button/index.ts @@ -1,7 +1,9 @@ import IconButton from './IconButton.svelte'; +import type { IconButtonComponentDev } from './IconButton.types'; +export * from './IconButton.types'; import { Icon } from '@smui/common'; -export default IconButton; +export default IconButton as typeof IconButtonComponentDev; export { Icon }; diff --git a/packages/image-list/Image.ts b/packages/image-list/Image.ts index 358e8ec7d..e18335bd2 100644 --- a/packages/image-list/Image.ts +++ b/packages/image-list/Image.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Img from '@smui/common/Img.svelte'; +import { Img } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-image-list__image', - component: Img as typeof SMUIComponent, + component: Img, }); diff --git a/packages/image-list/ImageAspectContainer.ts b/packages/image-list/ImageAspectContainer.ts index e479e1a99..79e0cd445 100644 --- a/packages/image-list/ImageAspectContainer.ts +++ b/packages/image-list/ImageAspectContainer.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-image-list__image-aspect-container', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/image-list/ImageList.types.ts b/packages/image-list/ImageList.types.ts new file mode 100644 index 000000000..e950a9579 --- /dev/null +++ b/packages/image-list/ImageList.types.ts @@ -0,0 +1,15 @@ +import type Component from './ImageList.svelte'; + +export declare class ImageListComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/image-list/Item.ts b/packages/image-list/Item.ts index 6e1846fcf..2001f9103 100644 --- a/packages/image-list/Item.ts +++ b/packages/image-list/Item.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Li from '@smui/common/Li.svelte'; +import { Li } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-image-list__item', - component: Li as typeof SMUIComponent, + component: Li, }); diff --git a/packages/image-list/Supporting.ts b/packages/image-list/Supporting.ts index 43a5a1488..09156b293 100644 --- a/packages/image-list/Supporting.ts +++ b/packages/image-list/Supporting.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-image-list__supporting', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/image-list/ambient.d.ts b/packages/image-list/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/image-list/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/image-list/index.ts b/packages/image-list/index.ts index d1a6c70d6..76f7884b9 100644 --- a/packages/image-list/index.ts +++ b/packages/image-list/index.ts @@ -1,4 +1,6 @@ import ImageList from './ImageList.svelte'; +import type { ImageListComponentDev } from './ImageList.types'; +export * from './ImageList.types'; import Item from './Item'; import ImageAspectContainer from './ImageAspectContainer'; @@ -6,6 +8,6 @@ import Image from './Image'; import Supporting from './Supporting'; import { Label } from '@smui/common'; -export default ImageList; +export default ImageList as typeof ImageListComponentDev; export { Item, ImageAspectContainer, Image, Supporting, Label }; diff --git a/packages/layout-grid/Cell.types.ts b/packages/layout-grid/Cell.types.ts new file mode 100644 index 000000000..6ad058051 --- /dev/null +++ b/packages/layout-grid/Cell.types.ts @@ -0,0 +1,15 @@ +import type Component from './Cell.svelte'; + +export declare class CellComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/layout-grid/InnerGrid.types.ts b/packages/layout-grid/InnerGrid.types.ts new file mode 100644 index 000000000..c7b90e615 --- /dev/null +++ b/packages/layout-grid/InnerGrid.types.ts @@ -0,0 +1,15 @@ +import type Component from './InnerGrid.svelte'; + +export declare class InnerGridComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/layout-grid/LayoutGrid.types.ts b/packages/layout-grid/LayoutGrid.types.ts new file mode 100644 index 000000000..bce000783 --- /dev/null +++ b/packages/layout-grid/LayoutGrid.types.ts @@ -0,0 +1,19 @@ +import type Component from './LayoutGrid.svelte'; +import type { InnerGridComponentDev } from './InnerGrid.types'; + +export declare class LayoutGridComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + { + [k in keyof InnerGridComponentDev['$$prop_def'] as `innerGrid\$${k}`]?: InnerGridComponentDev['$$prop_def'][k]; + } & + Component['$$prop_def']; +} diff --git a/packages/layout-grid/ambient.d.ts b/packages/layout-grid/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/layout-grid/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/layout-grid/index.ts b/packages/layout-grid/index.ts index cdf78a4f5..d1a58f373 100644 --- a/packages/layout-grid/index.ts +++ b/packages/layout-grid/index.ts @@ -1,8 +1,16 @@ import LayoutGrid from './LayoutGrid.svelte'; +import type { LayoutGridComponentDev } from './LayoutGrid.types'; +export * from './LayoutGrid.types'; -import Cell from './Cell.svelte'; -import InnerGrid from './InnerGrid.svelte'; +import CellComponent from './Cell.svelte'; +import type { CellComponentDev } from './Cell.types'; +export * from './Cell.types'; +const Cell = CellComponent as typeof CellComponentDev; +import InnerGridComponent from './InnerGrid.svelte'; +import type { InnerGridComponentDev } from './InnerGrid.types'; +export * from './InnerGrid.types'; +const InnerGrid = InnerGridComponent as typeof InnerGridComponentDev; -export default LayoutGrid; +export default LayoutGrid as typeof LayoutGridComponentDev; export { Cell, InnerGrid }; diff --git a/packages/line-ripple/LineRipple.types.ts b/packages/line-ripple/LineRipple.types.ts new file mode 100644 index 000000000..964e9a24d --- /dev/null +++ b/packages/line-ripple/LineRipple.types.ts @@ -0,0 +1,15 @@ +import type Component from './LineRipple.svelte'; + +export declare class LineRippleComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/line-ripple/ambient.d.ts b/packages/line-ripple/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/line-ripple/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/line-ripple/index.ts b/packages/line-ripple/index.ts index e9f7f96ba..f6a0cf0ba 100644 --- a/packages/line-ripple/index.ts +++ b/packages/line-ripple/index.ts @@ -1,3 +1,5 @@ import LineRipple from './LineRipple.svelte'; +import type { LineRippleComponentDev } from './LineRipple.types'; +export * from './LineRipple.types'; -export default LineRipple; +export default LineRipple as typeof LineRippleComponentDev; diff --git a/packages/linear-progress/LinearProgress.types.ts b/packages/linear-progress/LinearProgress.types.ts new file mode 100644 index 000000000..e0b2d722e --- /dev/null +++ b/packages/linear-progress/LinearProgress.types.ts @@ -0,0 +1,15 @@ +import type Component from './LinearProgress.svelte'; + +export declare class LinearProgressComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/linear-progress/ambient.d.ts b/packages/linear-progress/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/linear-progress/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/linear-progress/index.ts b/packages/linear-progress/index.ts index 648977338..c858c88d2 100644 --- a/packages/linear-progress/index.ts +++ b/packages/linear-progress/index.ts @@ -1,3 +1,5 @@ import LinearProgress from './LinearProgress.svelte'; +import type { LinearProgressComponentDev } from './LinearProgress.types'; +export * from './LinearProgress.types'; -export default LinearProgress; +export default LinearProgress as typeof LinearProgressComponentDev; diff --git a/packages/list/Graphic.types.ts b/packages/list/Graphic.types.ts new file mode 100644 index 000000000..10705b6db --- /dev/null +++ b/packages/list/Graphic.types.ts @@ -0,0 +1,15 @@ +import type Component from './Graphic.svelte'; + +export declare class GraphicComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/list/Group.ts b/packages/list/Group.ts index 783fb0de9..9441686c9 100644 --- a/packages/list/Group.ts +++ b/packages/list/Group.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Div from '@smui/common/Div.svelte'; +import { Div } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-deprecated-list-group', - component: Div as typeof SMUIComponent, + component: Div, }); diff --git a/packages/list/Item.svelte b/packages/list/Item.svelte index a1ce09603..1c09eff47 100644 --- a/packages/list/Item.svelte +++ b/packages/list/Item.svelte @@ -77,9 +77,7 @@ ActionArray, } from '@smui/common/internal'; import Ripple from '@smui/ripple'; - import A from '@smui/common/A.svelte'; - import Span from '@smui/common/Span.svelte'; - import Li from '@smui/common/Li.svelte'; + import { A, Span, Li } from '@smui/common/elements'; import type { SMUIListItemAccessor } from './Item.types'; diff --git a/packages/list/Item.types.ts b/packages/list/Item.types.ts index 76b5c5859..8456aa75b 100644 --- a/packages/list/Item.types.ts +++ b/packages/list/Item.types.ts @@ -1,3 +1,23 @@ +import type { SMUIComponent } from '@smui/common'; +import type Component from './Item.svelte'; +import type { LiComponentDev as LiElementComponentDev } from '@smui/common/elements'; + +export declare class ItemComponentDev< + C extends SMUIComponent = LiElementComponentDev +> extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} + export interface SMUIListItemAccessor { _smui_list_item_accessor: true; readonly element: Element; diff --git a/packages/list/Label.types.ts b/packages/list/Label.types.ts new file mode 100644 index 000000000..799ed44e5 --- /dev/null +++ b/packages/list/Label.types.ts @@ -0,0 +1,15 @@ +import type Component from './Label.svelte'; + +export declare class LabelComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/list/List.svelte b/packages/list/List.svelte index 7477d5c0d..3eeba97ec 100644 --- a/packages/list/List.svelte +++ b/packages/list/List.svelte @@ -58,8 +58,7 @@ dispatch, ActionArray, } from '@smui/common/internal'; - import Ul from '@smui/common/Ul.svelte'; - import Nav from '@smui/common/Nav.svelte'; + import { Ul, Nav } from '@smui/common/elements'; import type { SMUIListAccessor } from './List.types'; import type { SMUIListItemAccessor } from './Item.types'; diff --git a/packages/list/List.types.ts b/packages/list/List.types.ts index 6c2be338c..4229ec4e1 100644 --- a/packages/list/List.types.ts +++ b/packages/list/List.types.ts @@ -1,3 +1,23 @@ +import type { SMUIComponent } from '@smui/common'; +import type Component from './List.svelte'; +import type { UlComponentDev as UlElementComponentDev } from '@smui/common/elements'; + +export declare class ListComponentDev< + C extends SMUIComponent = UlElementComponentDev +> extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} + import type { SMUIListItemAccessor } from './Item.types'; export interface SMUIListAccessor { diff --git a/packages/list/Meta.ts b/packages/list/Meta.ts index 82a7c432e..7185735f0 100644 --- a/packages/list/Meta.ts +++ b/packages/list/Meta.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Span from '@smui/common/Span.svelte'; +import { Span } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-deprecated-list-item__meta', - component: Span as typeof SMUIComponent, + component: Span, }); diff --git a/packages/list/PrimaryText.ts b/packages/list/PrimaryText.ts index 104b20b5a..e528e6c06 100644 --- a/packages/list/PrimaryText.ts +++ b/packages/list/PrimaryText.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Span from '@smui/common/Span.svelte'; +import { Span } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-deprecated-list-item__primary-text', - component: Span as typeof SMUIComponent, + component: Span, }); diff --git a/packages/list/SecondaryText.ts b/packages/list/SecondaryText.ts index 788f22644..5d9734f80 100644 --- a/packages/list/SecondaryText.ts +++ b/packages/list/SecondaryText.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Span from '@smui/common/Span.svelte'; +import { Span } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-deprecated-list-item__secondary-text', - component: Span as typeof SMUIComponent, + component: Span, }); diff --git a/packages/list/Separator.svelte b/packages/list/Separator.svelte index 877908321..c5963067b 100644 --- a/packages/list/Separator.svelte +++ b/packages/list/Separator.svelte @@ -24,8 +24,7 @@ classMap, ActionArray, } from '@smui/common/internal'; - import Li from '@smui/common/Li.svelte'; - import Hr from '@smui/common/Hr.svelte'; + import { Li, Hr } from '@smui/common/elements'; const forwardEvents = forwardEventsBuilder(get_current_component()); diff --git a/packages/list/Separator.types.ts b/packages/list/Separator.types.ts new file mode 100644 index 000000000..80c05b4a0 --- /dev/null +++ b/packages/list/Separator.types.ts @@ -0,0 +1,19 @@ +import type { SMUIComponent } from '@smui/common'; +import type Component from './Separator.svelte'; +import type { LiComponentDev as LiElementComponentDev } from '@smui/common/elements'; + +export declare class SeparatorComponentDev< + C extends SMUIComponent = LiElementComponentDev +> extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} diff --git a/packages/list/Subheader.ts b/packages/list/Subheader.ts index b4ce41198..25ffcbb5b 100644 --- a/packages/list/Subheader.ts +++ b/packages/list/Subheader.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import H3 from '@smui/common/H3.svelte'; +import { H3 } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-deprecated-list-group__subheader', - component: H3 as typeof SMUIComponent, + component: H3, }); diff --git a/packages/list/Text.ts b/packages/list/Text.ts index 0b8a80f5d..c77f3cb59 100644 --- a/packages/list/Text.ts +++ b/packages/list/Text.ts @@ -1,8 +1,7 @@ -import type { SMUIComponent } from '@smui/common'; import { classAdderBuilder } from '@smui/common/internal'; -import Span from '@smui/common/Span.svelte'; +import { Span } from '@smui/common/elements'; export default classAdderBuilder({ class: 'mdc-deprecated-list-item__text', - component: Span as typeof SMUIComponent, + component: Span, }); diff --git a/packages/list/ambient.d.ts b/packages/list/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/list/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/list/index.ts b/packages/list/index.ts index 6fb30f0c3..af2322452 100644 --- a/packages/list/index.ts +++ b/packages/list/index.ts @@ -1,19 +1,31 @@ import List from './List.svelte'; +import type { ListComponentDev } from './List.types'; export * from './List.types'; -import Item from './Item.svelte'; +import ItemComponent from './Item.svelte'; +import type { ItemComponentDev } from './Item.types'; export * from './Item.types'; +const Item = ItemComponent as typeof ItemComponentDev; import Text from './Text'; import PrimaryText from './PrimaryText'; import SecondaryText from './SecondaryText'; -import Graphic from './Graphic.svelte'; +import GraphicComponent from './Graphic.svelte'; +import type { GraphicComponentDev } from './Graphic.types'; +export * from './Graphic.types'; +const Graphic = GraphicComponent as typeof GraphicComponentDev; import Meta from './Meta'; -import Label from './Label.svelte'; +import LabelComponent from './Label.svelte'; +import type { LabelComponentDev } from './Label.types'; +export * from './Label.types'; +const Label = LabelComponent as typeof LabelComponentDev; import Group from './Group'; import Subheader from './Subheader'; -import Separator from './Separator.svelte'; +import SeparatorComponent from './Separator.svelte'; +import type { SeparatorComponentDev } from './Separator.types'; +export * from './Separator.types'; +const Separator = SeparatorComponent as typeof SeparatorComponentDev; -export default List; +export default List as typeof ListComponentDev; export { Item, diff --git a/packages/menu-surface/MenuSurface.types.ts b/packages/menu-surface/MenuSurface.types.ts index dd5d720cc..9b1aa452f 100644 --- a/packages/menu-surface/MenuSurface.types.ts +++ b/packages/menu-surface/MenuSurface.types.ts @@ -1,3 +1,19 @@ +import type Component from './MenuSurface.svelte'; + +export declare class MenuSurfaceComponentDev extends Component { + /** + * @private + * For type checking capabilities only. + * Does not exist at runtime. + * ### DO NOT USE! + */ + $$prop_def: Omit< + Partial>, + keyof Component['$$prop_def'] + > & + Component['$$prop_def']; +} + import { Corner } from '@material/menu-surface'; export { Corner }; diff --git a/packages/menu-surface/ambient.d.ts b/packages/menu-surface/ambient.d.ts new file mode 100644 index 000000000..0f17de42e --- /dev/null +++ b/packages/menu-surface/ambient.d.ts @@ -0,0 +1,3 @@ +declare namespace svelte.JSX { + interface HTMLAttributes {} +} diff --git a/packages/menu-surface/index.ts b/packages/menu-surface/index.ts index 86f0f4497..dfdf46370 100644 --- a/packages/menu-surface/index.ts +++ b/packages/menu-surface/index.ts @@ -1,9 +1,10 @@ import MenuSurface from './MenuSurface.svelte'; +import type { MenuSurfaceComponentDev } from './MenuSurface.types'; export * from './MenuSurface.types'; import Anchor from './Anchor'; export * from './Anchor'; -export default MenuSurface; +export default MenuSurface as typeof MenuSurfaceComponentDev; export { Anchor }; diff --git a/packages/menu/Menu.svelte b/packages/menu/Menu.svelte index 71bb39edc..1053608bb 100644 --- a/packages/menu/Menu.svelte +++ b/packages/menu/Menu.svelte @@ -21,7 +21,10 @@ diff --git a/packages/site/src/routes/demo/common/_EventsAndModifiers.svelte b/packages/site/src/routes/demo/common/_EventsAndModifiers.svelte index 55dfa7bf4..620988404 100644 --- a/packages/site/src/routes/demo/common/_EventsAndModifiers.svelte +++ b/packages/site/src/routes/demo/common/_EventsAndModifiers.svelte @@ -69,7 +69,7 @@ diff --git a/packages/site/src/routes/demo/image-list/_EnforceAspectRatio.svelte b/packages/site/src/routes/demo/image-list/_EnforceAspectRatio.svelte index 4d31a20d3..4597dbc42 100644 --- a/packages/site/src/routes/demo/image-list/_EnforceAspectRatio.svelte +++ b/packages/site/src/routes/demo/image-list/_EnforceAspectRatio.svelte @@ -26,7 +26,7 @@ Supporting, Label, } from '@smui/image-list'; - import Div from '@smui/common/Div.svelte'; + import { Div } from '@smui/common/elements'; function getUnevenImageSize( counter: number, diff --git a/packages/site/src/routes/demo/menu-surface/_Anchored.svelte b/packages/site/src/routes/demo/menu-surface/_Anchored.svelte index a9863ff16..69666ea1e 100644 --- a/packages/site/src/routes/demo/menu-surface/_Anchored.svelte +++ b/packages/site/src/routes/demo/menu-surface/_Anchored.svelte @@ -14,11 +14,11 @@ diff --git a/packages/site/src/routes/demo/menu-surface/_ManualAnchor.svelte b/packages/site/src/routes/demo/menu-surface/_ManualAnchor.svelte index 41650dde5..d196761aa 100644 --- a/packages/site/src/routes/demo/menu-surface/_ManualAnchor.svelte +++ b/packages/site/src/routes/demo/menu-surface/_ManualAnchor.svelte @@ -34,7 +34,10 @@ diff --git a/packages/site/src/routes/demo/segmented-button/_IconsKeys.svelte b/packages/site/src/routes/demo/segmented-button/_IconsKeys.svelte index 103b48b7d..43155f04d 100644 --- a/packages/site/src/routes/demo/segmented-button/_IconsKeys.svelte +++ b/packages/site/src/routes/demo/segmented-button/_IconsKeys.svelte @@ -61,7 +61,7 @@ Icon, Label, } from '@smui/segmented-button'; - import Svg from '@smui/common/Svg.svelte'; + import { Svg } from '@smui/common/elements'; import { mdiFormatAlignLeft, mdiFormatAlignCenter, diff --git a/packages/site/src/routes/demo/segmented-button/_Touch.svelte b/packages/site/src/routes/demo/segmented-button/_Touch.svelte index 8f0b7ca45..510990127 100644 --- a/packages/site/src/routes/demo/segmented-button/_Touch.svelte +++ b/packages/site/src/routes/demo/segmented-button/_Touch.svelte @@ -23,7 +23,7 @@ diff --git a/packages/site/src/routes/demo/snackbar/_Kitchen.svelte b/packages/site/src/routes/demo/snackbar/_Kitchen.svelte index 91867d6f7..4cd5c43b9 100644 --- a/packages/site/src/routes/demo/snackbar/_Kitchen.svelte +++ b/packages/site/src/routes/demo/snackbar/_Kitchen.svelte @@ -10,10 +10,10 @@ diff --git a/packages/site/src/routes/demo/snackbar/_StackedWithAction.svelte b/packages/site/src/routes/demo/snackbar/_StackedWithAction.svelte index dc132728f..f9e76f6f9 100644 --- a/packages/site/src/routes/demo/snackbar/_StackedWithAction.svelte +++ b/packages/site/src/routes/demo/snackbar/_StackedWithAction.svelte @@ -25,11 +25,15 @@ 
Action: {action}
diff --git a/packages/site/src/routes/demo/top-app-bar/iframe.svelte b/packages/site/src/routes/demo/top-app-bar/iframe.svelte index da538baee..bea095224 100644 --- a/packages/site/src/routes/demo/top-app-bar/iframe.svelte +++ b/packages/site/src/routes/demo/top-app-bar/iframe.svelte @@ -40,6 +40,7 @@ Section, Title, AutoAdjust, + TopAppBarComponentDev, } from '@smui/top-app-bar'; import IconButton from '@smui/icon-button'; import LoremIpsum from '$lib/LoremIpsum.svelte'; @@ -50,7 +51,7 @@ let collapsed = false; let title = 'Standard'; let shortAlwaysCollapsed = false; - let topAppBar: TopAppBar; + let topAppBar: TopAppBarComponentDev; switch ($page.query.get('style')) { case 'fixed': diff --git a/packages/site/src/routes/index.svelte b/packages/site/src/routes/index.svelte index a561e231e..8a14607e5 100644 --- a/packages/site/src/routes/index.svelte +++ b/packages/site/src/routes/index.svelte @@ -299,7 +299,7 @@ SecondaryText, } from '@smui/list'; import { Icon } from '@smui/common'; - import Svg from '@smui/common/Svg.svelte'; + import { Svg } from '@smui/common/elements';