@clderystd/m3-ui 0.0.0-stage → 0.1.0

package/dist/components/M3Tooltip.vue.d.ts

@@ -0,0 +1,24 @@
+type __VLS_Props = {
+    /** Tooltip text (plain tooltip, MD3). */
+    text: string;
+    placement?: 'top' | 'bottom';
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLSpanElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    placement: "top" | "bottom";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/M3TopAppBar.vue.d.ts

@@ -0,0 +1,41 @@
+type __VLS_Props = {
+    /** True once the page is scrolled: switches the bar to the container colour. */
+    scrolled?: boolean;
+    /** Force the elevated/scrolled treatment regardless of scroll position. */
+    elevated?: boolean;
+    /** Small (64dp) is the default; medium (112dp) and large (152dp) stack the title. */
+    size?: 'small' | 'medium' | 'large';
+    /** Centre the title. */
+    centered?: boolean;
+    /** Stick to the top of the viewport. */
+    sticky?: boolean;
+    /** Paint no surface of its own so the page shows through; use the `background` slot. */
+    overlay?: boolean;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        background?(_: {}): any;
+        leading?(_: {}): any;
+        default?(_: {}): any;
+        actions?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    size: "small" | "medium" | "large";
+    elevated: boolean;
+    scrolled: boolean;
+    centered: boolean;
+    sticky: boolean;
+    overlay: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/index.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Material Design 3 组件库。
+ *
+ * 只用官方 M3 设计令牌实现，不依赖任何第三方 UI 组件库。
+ * 配色（--md-sys-color-*）由使用方提供：本包只带结构令牌
+ * （形状 / 字阶 / 海拔 / 动效 / 状态层），可换主题色。
+ */
+export { default as M3Avatar } from './M3Avatar.vue';
+export { default as M3Button } from './M3Button.vue';
+export { default as M3Card } from './M3Card.vue';
+export { default as M3Chip } from './M3Chip.vue';
+export { default as M3Dialog } from './M3Dialog.vue';
+export { default as M3Divider } from './M3Divider.vue';
+export { default as M3Fab } from './M3Fab.vue';
+export { default as M3Icon } from './M3Icon.vue';
+export { default as M3IconButton } from './M3IconButton.vue';
+export { default as M3List } from './M3List.vue';
+export { default as M3ListItem } from './M3ListItem.vue';
+export { default as M3Menu } from './M3Menu.vue';
+export { default as M3MenuItem } from './M3MenuItem.vue';
+export { default as M3SegmentedButton, type SegmentedOption } from './M3SegmentedButton.vue';
+export { default as M3Sheet } from './M3Sheet.vue';
+export { default as M3Switch } from './M3Switch.vue';
+export { default as M3Tooltip } from './M3Tooltip.vue';
+export { default as M3TopAppBar } from './M3TopAppBar.vue';
+export type { IconComponent } from '../types';
+export { IconCheck, IconClose, IconExpandMore } from '../icons';
+export { vRipple } from '../directives/ripple';
+export { vReveal } from '../directives/reveal';
+export { useModal, type UseModalOptions, type ModalControls } from '../composables/useModal';

package/dist/composables/useModal.d.ts

@@ -0,0 +1,16 @@
+import { Ref } from 'vue';
+export interface UseModalOptions {
+    /** Called when the user presses Escape or clicks the scrim. */
+    onClose: () => void;
+    /** Keep the panel mounted; skip restoring focus to the trigger. */
+    restoreFocus?: boolean;
+}
+export interface ModalControls {
+    /** Move focus to the first focusable element inside the panel. */
+    focusFirst: () => void;
+}
+/**
+ * Shared behaviour for M3 dialogs and sheets: scroll lock, a focus trap that keeps Tab
+ * inside the panel, Escape-to-close, and focus restoration to the invoking element.
+ */
+export declare function useModal(isOpen: Ref<boolean>, panelRef: Ref<HTMLElement | null>, options: UseModalOptions): ModalControls;

package/dist/directives/reveal.d.ts

@@ -0,0 +1,15 @@
+import { Directive } from 'vue';
+interface RevealOptions {
+    /** Transition delay in ms, for staggering grids. */
+    delay?: number;
+    /** Start blurred and sharpen into place. */
+    blur?: boolean;
+    /** Reveal only the first time (default) or every time it enters view. */
+    once?: boolean;
+    /** Starting vertical offset in px (defaults to the stylesheet value). */
+    y?: number;
+    /** Starting scale (defaults to the stylesheet value). */
+    scale?: number;
+}
+export declare const vReveal: Directive<HTMLElement, RevealOptions | number | undefined>;
+export {};

package/dist/directives/ripple.d.ts

@@ -0,0 +1,6 @@
+import { Directive } from 'vue';
+interface RippleHost extends HTMLElement {
+    __mdRippleHandler?: (event: PointerEvent) => void;
+}
+export declare const vRipple: Directive<RippleHost>;
+export {};

package/dist/icons/index.d.ts

@@ -0,0 +1,9 @@
+import { FunctionalComponent } from 'vue';
+/** Material Symbols: check */
+export declare const IconCheck: FunctionalComponent<{}, {}, any, {}>;
+/** Material Symbols: close */
+export declare const IconClose: FunctionalComponent<{}, {}, any, {}>;
+/** Material Symbols: expand-more */
+export declare const IconExpandMore: FunctionalComponent<{}, {}, any, {}>;
+/** 图标组件的形状；外面传图标时用它标注类型。 */
+export type { IconComponent } from '../types';

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from './components';