@humuchen/mac-ui 0.0.1

package/dist/types/components/form/mac-form.d.ts

@@ -0,0 +1,64 @@
+import { BaseElement } from '../../internal/base-element';
+import type { MacFormItem } from './mac-form-item';
+export interface FormRule {
+    required?: boolean;
+    message?: string;
+    trigger?: 'blur' | 'change' | 'input' | ('blur' | 'change' | 'input')[];
+    validator?: (value: unknown) => boolean | string | Promise<boolean | string>;
+    min?: number;
+    max?: number;
+    len?: number;
+    pattern?: RegExp;
+    type?: 'string' | 'number' | 'boolean' | 'array' | 'email' | 'url' | 'date';
+}
+/**
+ * @tag mac-form
+ * @summary 一个表单组件，用于收集和验证用户输入。
+ *
+ * @slot - 表单项和控件。
+ *
+ * @csspart base - 表单的基础容器。
+ *
+ * @event mac-change - 字段值变化时触发。Detail: { model, path, value }
+ * @event mac-submit - 表单提交时触发。Detail: { model }
+ */
+export declare class MacForm extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 表单数据模型。 */
+    model: Record<string, unknown>;
+    /** 验证规则。 */
+    rules: Record<string, FormRule | FormRule[]>;
+    /** 标签宽度。 */
+    labelWidth: string;
+    /** 标签对齐方式。 */
+    labelAlign: 'left' | 'right' | 'top';
+    /** 是否显示标签。 */
+    showLabel: boolean;
+    /** 是否显示反馈（错误信息）。 */
+    showFeedback: boolean;
+    /** 表单尺寸。 */
+    size?: 'sm' | 'md' | 'lg';
+    /** 禁用所有表单项。 */
+    disabled: boolean;
+    private _items;
+    willUpdate(): void;
+    _registerItem(item: MacFormItem): void;
+    _unregisterItem(item: MacFormItem): void;
+    /** 根据路径获取字段值。 */
+    getValue(path: string): unknown;
+    /** 根据路径设置字段值。 */
+    setValue(path: string, value: unknown): void;
+    /** 验证所有表单项。 */
+    validate(): Promise<boolean>;
+    /** 重置所有表单项的验证状态。 */
+    reset(): void;
+    /** 清空表单模型。 */
+    clear(): void;
+    render(): import("lit").TemplateResult<1>;
+    private _handleSubmit;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-form': MacForm;
+    }
+}

package/dist/types/components/form/mac-form.stories.d.ts

@@ -0,0 +1,18 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-form';
+import './mac-form-item';
+import '../input/mac-input';
+import '../input-number/mac-input-number';
+import '../radio/mac-radio';
+import '../button/mac-button';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const LabelAlign: Story;
+export declare const Sizes: Story;
+export declare const ValidationRules: Story;
+export declare const InlineRules: Story;
+export declare const Disabled: Story;
+export declare const NoFeedback: Story;
+export declare const NoLabel: Story;

package/dist/types/components/group-button/index.d.ts

@@ -0,0 +1,2 @@
+export { MacGroupButton } from './mac-group-button.js';
+export type { GroupButtonItem } from './mac-group-button.js';

package/dist/types/components/group-button/mac-group-button.d.ts

@@ -0,0 +1,50 @@
+import { PropertyValues } from 'lit';
+import { BaseElement } from '../../internal/base-element';
+export interface GroupButtonItem {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+/**
+ * @tag mac-group-button
+ * @summary 一个 macOS 风格的分段控制组件。
+ *
+ * @slot - 默认插槽，用于分组按钮项。
+ *
+ * @csspart container - 主容器。
+ * @csspart slider - 滑动背景指示器。
+ * @csspart button - 单个按钮元素。
+ *
+ * @event mac-change - 选中值变化时触发。
+ */
+export declare class MacGroupButton extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 按钮项数组。 */
+    items: GroupButtonItem[];
+    /** 当前选中的值。 */
+    value: string;
+    /** 按钮的尺寸。 */
+    size?: 'sm' | 'md' | 'lg';
+    /** 禁用所有按钮。 */
+    disabled: boolean;
+    private slider;
+    private buttons;
+    private _selectedIndex;
+    willUpdate(): void;
+    protected firstUpdated(changedProperties: PropertyValues): void;
+    protected updated(changedProperties: PropertyValues): void;
+    private _setInitialValue;
+    private _updateSliderPosition;
+    private _handleButtonClick;
+    private _handleKeyDown;
+    private _getPreviousEnabledIndex;
+    private _getNextEnabledIndex;
+    private _getFirstEnabledIndex;
+    private _getLastEnabledIndex;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-group-button': MacGroupButton;
+    }
+}

package/dist/types/components/group-button/mac-group-button.stories.d.ts

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-group-button';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const Small: Story;
+export declare const Large: Story;
+export declare const WithDisabledItems: Story;
+export declare const Disabled: Story;
+export declare const TwoButtons: Story;
+export declare const ManyButtons: Story;
+export declare const AllSizes: Story;

package/dist/types/components/infinite-scroll/index.d.ts

@@ -0,0 +1 @@
+export { MacInfiniteScroll } from './mac-infinite-scroll';

package/dist/types/components/infinite-scroll/mac-infinite-scroll.d.ts

@@ -0,0 +1,57 @@
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-infinite-scroll
+ * @summary 无限滚动组件，滚动到底部时触发加载更多数据。
+ *
+ * @slot - 默认插槽，用于列表内容。
+ * @slot loading - 自定义加载指示器内容。
+ * @slot finished - 没有更多数据时显示的自定义内容。
+ * @slot error - 加载失败时显示的自定义内容。添加点击监听器以触发重试。
+ *
+ * @csspart loading - 加载状态容器。
+ * @csspart finished - 完成状态容器。
+ * @csspart error - 错误状态容器。
+ *
+ * @cssproperty --md-infinite-scroll-padding - 状态区域内边距。
+ * @cssproperty --md-infinite-scroll-color - 状态文字颜色。
+ * @cssproperty --md-infinite-scroll-font-size - 状态字体大小。
+ * @cssproperty --md-infinite-scroll-gap - 旋转器与文字之间的间距。
+ * @cssproperty --md-infinite-scroll-spinner-size - 旋转器大小。
+ *
+ * @event mac-load-more - 应该加载更多数据时触发。
+ * @event mac-retry - 点击重试按钮时触发。
+ */
+export declare class MacInfiniteScroll extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 是否还有更多数据可加载。 */
+    hasMore: boolean;
+    /** 当前是否正在加载数据。 */
+    loading: boolean;
+    /** 上次加载尝试是否失败。 */
+    error: boolean;
+    /** 距离底部触发加载的像素距离。 */
+    threshold: number;
+    /** 挂载后是否立即检查，当内容未填满容器时。 */
+    immediateCheck: boolean;
+    /** 是否禁用自动加载。 */
+    disabled: boolean;
+    private _internalLoading;
+    private _observer?;
+    private _sentinelEl?;
+    firstUpdated(): void;
+    updated(changed: Map<string, unknown>): void;
+    disconnectedCallback(): void;
+    private _setupObserver;
+    private _cleanupObserver;
+    private _handleScroll;
+    private _checkIfNeedLoad;
+    private _tryLoadMore;
+    private _handleRetry;
+    render(): import("lit").TemplateResult<1>;
+    private _renderStatus;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-infinite-scroll': MacInfiniteScroll;
+    }
+}

package/dist/types/components/infinite-scroll/mac-infinite-scroll.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-infinite-scroll';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Basic: Story;
+export declare const CustomSlots: Story;
+export declare const FinishedState: Story;
+export declare const ErrorState: Story;
+export declare const LoadingState: Story;
+export declare const Disabled: Story;

package/dist/types/components/input/index.d.ts

@@ -0,0 +1 @@
+export { MacInput } from './mac-input';

package/dist/types/components/input/mac-input.d.ts

@@ -0,0 +1,73 @@
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-input
+ * @summary macOS 风格的文本输入组件。
+ *
+ * @slot prefix - 输入框前的内容。
+ * @slot suffix - 输入框后的内容。
+ *
+ * @csspart base - 输入框的基础容器。
+ * @csspart input - 原生输入元素。
+ * @csspart label - 标签元素。
+ * @csspart helper-text - 辅助文本元素。
+ */
+export declare class MacInput extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 输入框的值。 */
+    value: string;
+    /** 输入框的占位符。 */
+    placeholder: string;
+    /** 输入框的类型。 */
+    type: 'text' | 'password' | 'email' | 'number' | 'tel' | 'url';
+    /** 输入框的尺寸。 */
+    size?: 'sm' | 'md' | 'lg';
+    /** 视觉变体。 */
+    variant: 'default' | 'filled' | 'glass' | 'underline';
+    /** 输入框的标签。 */
+    label: string;
+    /** 显示必填指示器。 */
+    required: boolean;
+    /** 禁用输入框。 */
+    disabled: boolean;
+    /** 使输入框只读。 */
+    readonly: boolean;
+    /** 输入框的错误状态。 */
+    error: boolean;
+    /** 输入框的成功状态。 */
+    success: boolean;
+    /** 输入框的辅助文本。 */
+    helperText: string;
+    /** 输入框的名称（用于表单）。 */
+    name: string;
+    /** 显示清除按钮。 */
+    clearable: boolean;
+    /** 显示密码切换按钮。 */
+    showPasswordToggle: boolean;
+    /** 显示字符计数器。 */
+    showCharCounter: boolean;
+    /** 最大字符长度。 */
+    maxLength?: number;
+    /** 显示加载状态。 */
+    loading: boolean;
+    /** 启用浮动标签。 */
+    floating: boolean;
+    private _hasFocus;
+    private _showPassword;
+    private _input;
+    willUpdate(): void;
+    render(): import("lit").TemplateResult<1>;
+    private _handleInput;
+    private _handleFocus;
+    private _handleBlur;
+    private _clearInput;
+    private _togglePassword;
+    /** 设置输入框焦点。 */
+    focus(): void;
+    /** 移除输入框焦点。 */
+    blur(): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-input': MacInput;
+    }
+}

package/dist/types/components/input/mac-input.stories.d.ts

@@ -0,0 +1,19 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-input';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Basic: Story;
+export declare const Variants: Story;
+export declare const Sizes: Story;
+export declare const States: Story;
+export declare const WithLabel: Story;
+export declare const FloatingLabel: Story;
+export declare const Clearable: Story;
+export declare const PasswordToggle: Story;
+export declare const CharacterCounter: Story;
+export declare const Loading: Story;
+export declare const WithIcons: Story;
+export declare const InputTypes: Story;
+export declare const CompleteExample: Story;
+export declare const GlassInputs: Story;

package/dist/types/components/input-number/index.d.ts

@@ -0,0 +1 @@
+export { MacInputNumber } from './mac-input-number';

package/dist/types/components/input-number/mac-input-number.d.ts

@@ -0,0 +1,81 @@
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-input-number
+ * @summary macOS 风格的数字输入组件。
+ *
+ * @slot prefix - 输入框前的内容。
+ * @slot suffix - 输入框后的内容。
+ *
+ * @csspart base - 输入框的基础容器。
+ * @csspart input - 原生输入元素。
+ * @csspart buttons - 步进按钮容器。
+ * @csspart button-plus - 加号步进按钮。
+ * @csspart button-minus - 减号步进按钮。
+ */
+export declare class MacInputNumber extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 输入框的值。 */
+    value?: number;
+    /** 非受控模式的默认值。 */
+    defaultValue?: number;
+    /** 最小值。 */
+    min?: number;
+    /** 最大值。 */
+    max?: number;
+    /** 步进值。 */
+    step: number;
+    /** 精度（小数位数）。 */
+    precision?: number;
+    /** 输入框的占位符。 */
+    placeholder: string;
+    /** 输入框的尺寸。 */
+    size?: 'sm' | 'md' | 'lg';
+    /** 视觉变体。 */
+    variant: 'default' | 'filled' | 'glass' | 'underline';
+    /** 输入框的状态。 */
+    status?: 'error' | 'warning' | 'success';
+    /** 禁用输入框。 */
+    disabled: boolean;
+    /** 使输入框只读。 */
+    readonly: boolean;
+    /** 显示步进按钮。 */
+    showButton: boolean;
+    /** 按钮位置。 */
+    buttonPlacement: 'inside' | 'outside';
+    /** 显示清除按钮。 */
+    clearable: boolean;
+    /** 输入框的名称（用于表单）。 */
+    name: string;
+    /** 启用键盘控制（方向键、Page Up/Down）。 */
+    keyboard: boolean;
+    private _displayValue;
+    private _hasFocus;
+    private _input;
+    private get _isControlled();
+    private get _resolvedValue();
+    connectedCallback(): void;
+    willUpdate(changed: Map<string, unknown>): void;
+    private _syncDisplayValue;
+    private _formatValue;
+    private _parseValue;
+    private _clampAndRound;
+    private _stepValue;
+    private _setValue;
+    private _handleInput;
+    private _handleChange;
+    private _handleFocus;
+    private _handleBlur;
+    private _handleKeydown;
+    private _clearInput;
+    private _renderButtons;
+    render(): import("lit").TemplateResult<1>;
+    /** 设置输入框焦点。 */
+    focus(): void;
+    /** 移除输入框焦点。 */
+    blur(): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-input-number': MacInputNumber;
+    }
+}

package/dist/types/components/input-number/mac-input-number.stories.d.ts

@@ -0,0 +1,18 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-input-number';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const MinMax: Story;
+export declare const Precision: Story;
+export declare const Sizes: Story;
+export declare const Variants: Story;
+export declare const Status: Story;
+export declare const ButtonPlacement: Story;
+export declare const HideButton: Story;
+export declare const Disabled: Story;
+export declare const Clearable: Story;
+export declare const PrefixSuffix: Story;
+export declare const Keyboard: Story;
+export declare const Uncontrolled: Story;

package/dist/types/components/lazy-image/index.d.ts

@@ -0,0 +1 @@
+export { MacLazyImage } from './mac-lazy-image';

package/dist/types/components/lazy-image/mac-lazy-image.d.ts

@@ -0,0 +1,86 @@
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-lazy-image
+ * @summary 懒加载图片组件，支持占位图、错误状态、悬停动画和点击预览。
+ *
+ * @slot placeholder - 加载时显示的自定义占位内容。
+ * @slot error - 图片加载失败时显示的自定义错误内容。
+ *
+ * @csspart image - 图片元素。
+ * @csspart placeholder - 占位容器。
+ * @csspart error - 错误容器。
+ * @csspart preview-overlay - 预览遮罩容器。
+ * @csspart preview-image - 预览图片元素。
+ *
+ * @cssproperty --md-lazy-image-object-fit - 对象适配样式。
+ * @cssproperty --md-lazy-image-placeholder-bg - 占位背景颜色。
+ * @cssproperty --md-lazy-image-placeholder-color - 占位图标颜色。
+ * @cssproperty --md-lazy-image-placeholder-icon-size - 占位图标大小。
+ * @cssproperty --md-lazy-image-error-icon-size - 错误图标大小。
+ * @cssproperty --md-lazy-image-shimmer-bg - 微光动画高亮颜色。
+ * @cssproperty --md-lazy-image-hover-scale - 悬停缩放变换（默认：1.05）。
+ * @cssproperty --md-lazy-image-hover-duration - 悬停动画时长（默认：300ms）。
+ * @cssproperty --md-lazy-image-hover-easing - 悬停动画缓动（默认：ease-out）。
+ * @cssproperty --md-lazy-image-hover-filter - 悬停滤镜效果（默认：none）。
+ * @cssproperty --md-lazy-image-preview-bg - 预览遮罩背景（默认：rgba(0,0,0,0.85)）。
+ * @cssproperty --md-lazy-image-preview-duration - 预览打开/关闭动画时长（默认：250ms）。
+ *
+ * @event mac-load - 图片成功加载时触发。
+ * @event mac-error - 图片加载失败时触发。
+ * @event mac-preview-open - 预览遮罩打开时触发。
+ * @event mac-preview-close - 预览遮罩关闭时触发。
+ */
+export declare class MacLazyImage extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 图片源地址。 */
+    src: string;
+    /** 图片替代文本。 */
+    alt: string;
+    /** 图片宽度。 */
+    width?: string;
+    /** 图片高度。 */
+    height?: string;
+    /** CSS object-fit 值。 */
+    objectFit: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+    /** 加载时显示的占位图片地址。 */
+    placeholder?: string;
+    /** IntersectionObserver 的 rootMargin。 */
+    rootMargin: string;
+    /** IntersectionObserver 的 threshold。 */
+    threshold: number;
+    /** 是否启用点击预览。 */
+    preview: boolean;
+    /** 预览模式的图片地址。未设置时回退到 src。 */
+    previewSrc: string;
+    private _loaded;
+    private _loading;
+    private _error;
+    private _inView;
+    private _previewOpen;
+    private _previewAnimating;
+    private _observer?;
+    private _imgEl?;
+    private _onKeydownBound;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    willUpdate(changedProperties: Map<string, unknown>): void;
+    private _updatePreviewAttr;
+    private _setupObserver;
+    private _cleanupObserver;
+    private _loadImage;
+    render(): import("lit").TemplateResult<1>;
+    private _onImageClick;
+    private _openPreview;
+    private _closePreview;
+    private _onKeydown;
+    private _onPreviewBgClick;
+    private _renderPreview;
+    private _renderImage;
+    private _renderPlaceholder;
+    private _renderError;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-lazy-image': MacLazyImage;
+    }
+}

package/dist/types/components/lazy-image/mac-lazy-image.stories.d.ts

@@ -0,0 +1,15 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-lazy-image';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Basic: Story;
+export declare const WithPlaceholderImage: Story;
+export declare const WithCustomPlaceholder: Story;
+export declare const ErrorState: Story;
+export declare const Gallery: Story;
+export declare const ObjectFitVariants: Story;
+export declare const WithPreview: Story;
+export declare const WithCustomPreviewImage: Story;
+export declare const WithHoverAnimation: Story;
+export declare const GalleryWithPreview: Story;

package/dist/types/components/menu/index.d.ts

@@ -0,0 +1,2 @@
+export { MacMenu } from './mac-menu';
+export type { DropdownItem } from '../dropdown/mac-dropdown';

package/dist/types/components/menu/mac-menu.d.ts

@@ -0,0 +1,63 @@
+import type { PropertyValues } from 'lit';
+import { BaseElement } from '../../internal/base-element';
+import type { DropdownItem } from '../dropdown/mac-dropdown';
+/**
+ * @tag mac-menu
+ * @summary 一个独立的菜单组件，可以在任何位置显示。
+ *
+ * @csspart base - 菜单的基础容器。
+ * @csspart item - 菜单项。
+ */
+export declare class MacMenu extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 菜单项。 */
+    items: DropdownItem[];
+    /** 当前激活/选中的值。 */
+    value: string;
+    /** 菜单是否可见。 */
+    visible: boolean;
+    /** 菜单位置（x 坐标）。 */
+    x: number;
+    /** 菜单位置（y 坐标）。 */
+    y: number;
+    private _menuEl;
+    private _submenuOpen;
+    private static _stylesInjected;
+    private _scrollHandler;
+    private _resizeHandler;
+    /**
+     * 在指定位置显示菜单，使用给定的项。
+     * @param x - X 坐标
+     * @param y - Y 坐标
+     * @param items - 要显示的菜单项
+     */
+    show(x: number, y: number, items?: DropdownItem[]): void;
+    /**
+     * 隐藏菜单。
+     */
+    hide(): void;
+    /**
+     * 切换菜单可见性。
+     */
+    toggle(x: number, y: number, items?: DropdownItem[]): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    willUpdate(changedProperties: PropertyValues): void;
+    private static _injectStyles;
+    private _handleDocumentClick;
+    private _handleKeyDown;
+    private _getPortalTheme;
+    private _addScrollListener;
+    private _removeScrollListener;
+    private _createMenu;
+    private _removeMenu;
+    private _calcPosition;
+    private _renderItems;
+    private _attachItemListeners;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-menu': MacMenu;
+    }
+}

package/dist/types/components/menu/mac-menu.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-menu';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Basic: Story;
+export declare const WithActiveItem: Story;
+export declare const Positioned: Story;
+export declare const WithDanger: Story;
+export declare const ProgrammaticControl: Story;
+export declare const ThemeAdaptation: Story;

package/dist/types/components/modal/index.d.ts

@@ -0,0 +1 @@
+export { MacModal } from './mac-modal';