@humuchen/mac-ui 0.0.1

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

@@ -0,0 +1 @@
+export { MacAlert } from './mac-alert';

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

@@ -0,0 +1,38 @@
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-alert
+ * @summary 用于显示警告消息的提示组件。
+ *
+ * @slot - 提示的描述内容。
+ * @slot icon - 自定义图标内容。
+ * @slot action - 显示在右侧的操作内容。
+ *
+ * @csspart base - 提示的基础容器。
+ * @csspart icon - 图标容器。
+ * @csspart title - 标题文本。
+ * @csspart content - 描述内容。
+ * @csspart close - 关闭按钮。
+ *
+ * @event mac-close - 点击关闭按钮时触发。
+ */
+export declare class MacAlert extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 提示的类型样式。 */
+    type: 'default' | 'primary' | 'success' | 'warning' | 'error' | 'info';
+    /** 提示的标题。 */
+    title: string;
+    /** 提示是否有边框。 */
+    bordered: boolean;
+    /** 是否显示图标。 */
+    showIcon: boolean;
+    /** 提示是否可以关闭。 */
+    closable: boolean;
+    private get _defaultIcon();
+    private _handleClose;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-alert': MacAlert;
+    }
+}

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

@@ -0,0 +1,15 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-alert';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const WithTitle: Story;
+export declare const WithoutTitle: Story;
+export declare const AllTypes: Story;
+export declare const BorderedVsBorderless: Story;
+export declare const WithoutIcon: Story;
+export declare const Closable: Story;
+export declare const WithAction: Story;
+export declare const CustomIcon: Story;
+export declare const LongContent: Story;

package/dist/types/components/animation/animations.d.ts

@@ -0,0 +1,97 @@
+import { CSSResult } from 'lit';
+/**
+ * 动画分类
+ */
+export type AnimationCategory = 'fade' | 'scale' | 'rotate' | 'slide' | 'bounce' | 'special';
+/**
+ * 单个动画定义
+ */
+export interface AnimationDefinition {
+    /** 动画名称（用于 type 属性匹配） */
+    name: string;
+    /** 效果描述 */
+    description: string;
+    /** 所属分类 */
+    category: AnimationCategory;
+    /** @keyframes 规则的纯 CSS 文本（不含 @keyframes 包裹层之外的任何选择器） */
+    keyframes: string;
+    /** 是否为退场动画（to 隐藏） */
+    exit?: boolean;
+}
+export declare const BUILT_IN: AnimationDefinition[];
+/** 内置动画名称集合（用于判断是否需要动态注入 keyframes） */
+export declare const BUILT_IN_ANIMATION_NAMES: ReadonlySet<string>;
+/**
+ * 注册自定义动画（可扩展性入口）
+ *
+ * @example
+ * ```ts
+ * registerAnimation({
+ *   name: 'myFade',
+ *   description: '自定义淡入',
+ *   category: 'fade',
+ *   keyframes: '@keyframes mac-myFade { from { opacity: 0; } to { opacity: 1; } }',
+ * })
+ * ```
+ * 注册后即可通过 `<mac-animation type="myFade">` 使用。
+ */
+export declare function registerAnimation(def: AnimationDefinition): void;
+/**
+ * 根据名称获取动画定义，未找到时返回 undefined
+ */
+export declare function getAnimation(name: string): AnimationDefinition | undefined;
+/**
+ * 判断动画是否已注册
+ */
+export declare function hasAnimation(name: string): boolean;
+/**
+ * 获取所有已注册动画名称列表
+ */
+export declare function getAnimationNames(): string[];
+/**
+ * 获取所有已注册动画定义
+ */
+export declare function getAllAnimations(): AnimationDefinition[];
+/**
+ * 所有内置动画的 @keyframes（供 HOC 组件注入 Shadow DOM）。
+ */
+export declare const builtInKeyframes: CSSResult;
+export declare const animationStyleSheet: CSSResult;
+/**
+ * 动画参数接口
+ */
+export interface AnimationOptions {
+    /** 动画时长，如 '1s' / '500ms' */
+    duration?: string;
+    /** 延迟时间 */
+    delay?: string;
+    /** 重复次数，数字或 'infinite' */
+    iterationCount?: number | 'infinite';
+    /** 方向 */
+    direction?: 'normal' | 'reverse' | 'alternate' | 'alternate-reverse';
+    /** 填充模式 */
+    fillMode?: 'none' | 'forwards' | 'backwards' | 'both';
+    /** 缓动函数 */
+    timingFunction?: string;
+    /** 是否暂停 */
+    paused?: boolean;
+}
+/**
+ * 根据动画名称与参数生成 inline `animation` 简写字符串。
+ * 用于「样式类模式」下动态控制单个元素。
+ *
+ * @example
+ * ```ts
+ * el.style.animation = buildAnimationShorthand('fadeIn', { duration: '0.5s' })
+ * ```
+ */
+export declare function buildAnimationShorthand(name: string, options?: AnimationOptions): string;
+/**
+ * 生成可直接用于 `style` 属性的对象形式（camelCase）。
+ *
+ * @example
+ * ```ts
+ * html`<div style=${styleMap(getAnimationStyleObject('bounce', { duration: '0.8s' }))}></div>`
+ * ```
+ */
+export declare function getAnimationStyleObject(name: string, options?: AnimationOptions): Record<string, string>;

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

@@ -0,0 +1,3 @@
+export { MacAnimation } from './mac-animation';
+export { registerAnimation, getAnimation, hasAnimation, getAnimationNames, getAllAnimations, builtInKeyframes, animationStyleSheet, buildAnimationShorthand, getAnimationStyleObject, BUILT_IN, BUILT_IN_ANIMATION_NAMES, } from './animations';
+export type { AnimationCategory, AnimationDefinition, AnimationOptions } from './animations';

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

@@ -0,0 +1,67 @@
+import { PropertyValues } from 'lit';
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-animation
+ * @summary 动画容器组件（高阶组件模式）。
+ *
+ * 将需要应用动画的目标元素放在 `<mac-animation>` 内部，被包裹内容将自动应用指定动画。
+ * 同时支持「样式类模式」—— 导出 `animationStyleSheet` / `buildAnimationShorthand` / `getAnimationStyleObject`。
+ *
+ * @slot - 需要应用动画的目标内容
+ *
+ * @event mac-animation-start - 动画开始时触发
+ * @event mac-animation-end - 动画结束时触发
+ * @event mac-animation-iteration - 动画每次重复时触发
+ *
+ * @csspart wrapper - 包裹动画内容的容器
+ */
+export declare class MacAnimation extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 动画类型名称（内置 27 种，或通过 registerAnimation 注册的自定义动画） */
+    type: string;
+    /** 动画时长，如 '1s' / '500ms' */
+    duration: string;
+    /** 延迟时间 */
+    delay: string;
+    /** 重复次数：数字或 'infinite' */
+    iterationCount: number | 'infinite';
+    /** 动画方向 */
+    direction: 'normal' | 'reverse' | 'alternate' | 'alternate-reverse';
+    /** 填充模式 */
+    fillMode: 'none' | 'forwards' | 'backwards' | 'both';
+    /** 缓动函数 */
+    timingFunction: string;
+    /** 是否暂停（暂停 / 继续控制） */
+    paused: boolean;
+    /** 是否以块级元素渲染（默认 inline-block） */
+    block: boolean;
+    /** 动画结束后是否自动移除动画样式（便于反复触发） */
+    autoClear: boolean;
+    private _wrapper;
+    /** 用于强制重启动画的内部计数 */
+    private _runToken;
+    updated(changed: PropertyValues): void;
+    /** 当前动画是否可用 */
+    private _resolveAnimation;
+    /** 计算并应用 inline animation 样式 */
+    private _applyAnimation;
+    /** 渲染自定义（非内置）动画的 keyframes 到 Shadow DOM */
+    private _renderCustomKeyframes;
+    render(): import("lit").TemplateResult<1>;
+    private _onAnimationStart;
+    private _onAnimationIteration;
+    private _onAnimationEnd;
+    /** 暂停动画 */
+    pause(): void;
+    /** 继续动画 */
+    resume(): void;
+    /** 重启动画（从头开始播放一次） */
+    restart(): void;
+    /** 停止动画并清除样式 */
+    stop(): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-animation': MacAnimation;
+    }
+}

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

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-animation';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const AllAnimations: Story;
+export declare const HOCMode: Story;
+export declare const StyleClassMode: Story;
+export declare const CustomAnimation: Story;

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

@@ -0,0 +1 @@
+export { MacButton } from './mac-button';

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

@@ -0,0 +1,37 @@
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-button
+ * @summary 一个多功能的按钮组件。
+ *
+ * @slot - 按钮的文本标签。
+ * @slot prefix - 标签前的内容。
+ * @slot suffix - 标签后的内容。
+ *
+ * @csspart base - 按钮的基础容器。
+ * @csspart label - 按钮的标签。
+ * @csspart prefix - 前缀容器。
+ * @csspart suffix - 后缀容器。
+ *
+ * @event mac-click - 点击按钮时触发。
+ */
+export declare class MacButton extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 按钮的变体样式。 */
+    variant: 'primary' | 'secondary' | 'text';
+    /** 按钮的尺寸。 */
+    size?: 'sm' | 'md' | 'lg';
+    /** 禁用按钮。 */
+    disabled: boolean;
+    /** 显示加载动画。 */
+    loading: boolean;
+    /** 按钮的类型（表单行为）。 */
+    type: 'button' | 'submit' | 'reset';
+    willUpdate(): void;
+    render(): import("lit").TemplateResult<1>;
+    private _handleClick;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-button': MacButton;
+    }
+}

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

@@ -0,0 +1,14 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-button';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Primary: Story;
+export declare const Secondary: Story;
+export declare const Text: Story;
+export declare const Small: Story;
+export declare const Large: Story;
+export declare const Disabled: Story;
+export declare const Loading: Story;
+export declare const WithSlots: Story;
+export declare const AllVariants: Story;

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

@@ -0,0 +1 @@
+export { MacCard } from './mac-card';

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

@@ -0,0 +1,38 @@
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-card
+ * @summary macOS 风格的卡片容器组件。
+ *
+ * @slot - 卡片的主体内容。
+ * @slot header - 卡片的头部。
+ * @slot footer - 卡片的底部。
+ * @slot media - 卡片的媒体区域（顶部）。
+ *
+ * @csspart base - 卡片的基础容器。
+ * @csspart header - 头部容器。
+ * @csspart body - 主体容器。
+ * @csspart footer - 底部容器。
+ * @csspart media - 媒体容器。
+ */
+export declare class MacCard extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 卡片的视觉变体。 */
+    variant: 'default' | 'elevated' | 'glass' | 'outlined' | 'gradient';
+    /** 卡片是否有悬停效果。 */
+    hoverable: boolean;
+    /** 卡片是否可点击。 */
+    clickable: boolean;
+    /** 显示加载状态。 */
+    loading: boolean;
+    /** 添加强调边框。 */
+    accent?: 'top' | 'left';
+    /** 媒体宽高比。 */
+    mediaRatio?: '16-9' | '4-3' | '1-1';
+    willUpdate(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-card': MacCard;
+    }
+}

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

@@ -0,0 +1,14 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-card';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const Variants: Story;
+export declare const WithMedia: Story;
+export declare const HoverableCards: Story;
+export declare const ClickableCards: Story;
+export declare const AccentBorders: Story;
+export declare const LoadingState: Story;
+export declare const CompleteCard: Story;
+export declare const DashboardCards: Story;

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

@@ -0,0 +1 @@
+export { MacCarousel, MacCarouselItem } from './mac-carousel';

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

@@ -0,0 +1,105 @@
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-carousel-item
+ * @summary mac-carousel 的幻灯片项。
+ *
+ * @slot - 幻灯片内容。
+ */
+export declare class MacCarouselItem extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    render(): import("lit").TemplateResult<1>;
+}
+/**
+ * @tag mac-carousel
+ * @summary 用于循环展示内容的轮播组件。
+ *
+ * @slot - 用于放置 mac-carousel-item 元素的默认插槽。
+ *
+ * @csspart base - 轮播的基础容器。
+ * @csspart track - 滑动轨道容器。
+ * @csspart arrow - 导航箭头。
+ * @csspart dots - 指示器圆点容器。
+ * @csspart dot - 单个指示器圆点。
+ *
+ * @event mac-carousel-change - 当前幻灯片变化时触发。`detail: { index: number, fromIndex: number }`
+ */
+export declare class MacCarousel extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 当前激活的幻灯片索引（受控模式）。 */
+    currentIndex: number;
+    /** 默认激活的幻灯片索引（非受控模式）。 */
+    defaultIndex: number;
+    /** 是否自动播放。 */
+    autoplay: boolean;
+    /** 自动播放间隔，单位为毫秒。 */
+    interval: number;
+    /** 是否循环播放。 */
+    loop: boolean;
+    /** 滑动方向。 */
+    direction: 'horizontal' | 'vertical';
+    /** 过渡效果。 */
+    effect: 'slide' | 'fade' | 'custom';
+    /** 每次显示的幻灯片数量。 */
+    slidesPerView: number;
+    /** 是否显示导航箭头。 */
+    showArrow: boolean;
+    /** 是否显示指示器圆点。 */
+    showDots: boolean;
+    /** 指示器圆点样式。 */
+    dotType: 'dot' | 'line';
+    /** 指示器圆点的位置。 */
+    dotPosition: 'top' | 'bottom' | 'left' | 'right';
+    /** 轮播是否可拖拽。 */
+    draggable: boolean;
+    /** 是否支持键盘导航。 */
+    keyboard: boolean;
+    /** 是否支持鼠标滚轮导航。 */
+    wheel: boolean;
+    /** 幻灯片过渡时长，单位为毫秒。 */
+    transitionDuration: number;
+    private _activeIndex;
+    private _slideCount;
+    private _isDragging;
+    private _dragOffset;
+    private _track;
+    private _autoplayTimer;
+    private _dragStartPos;
+    private _dragStartIndex;
+    private _isWheeling;
+    private get _isControlled();
+    get _resolvedIndex(): number;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    willUpdate(changed: Map<string, unknown>): void;
+    updated(changed: Map<string, unknown>): void;
+    private _getItems;
+    private _updateSlideCount;
+    private _initActiveIndex;
+    private _handleSlotChange;
+    private _applyTransform;
+    private _syncFadeActiveClass;
+    private _goTo;
+    private _prev;
+    private _next;
+    private _startAutoplay;
+    private _stopAutoplay;
+    private _handleMouseEnter;
+    private _handleMouseLeave;
+    private _startDrag;
+    private _moveDrag;
+    private _endDrag;
+    private _onPointerDown;
+    private _onPointerMove;
+    private _onPointerUp;
+    private _handleKeydown;
+    private _handleWheel;
+    private _renderArrow;
+    private _renderDots;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-carousel': MacCarousel;
+        'mac-carousel-item': MacCarouselItem;
+    }
+}

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

@@ -0,0 +1,18 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-carousel';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const Autoplay: Story;
+export declare const Vertical: Story;
+export declare const FadeEffect: Story;
+export declare const SlidesPerView: Story;
+export declare const DotPositionLeft: Story;
+export declare const NoLoop: Story;
+export declare const NoArrows: Story;
+export declare const NoDots: Story;
+export declare const LineDots: Story;
+export declare const Draggable: Story;
+export declare const Keyboard: Story;
+export declare const Wheel: Story;

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

@@ -0,0 +1,2 @@
+export { MacCheckbox, MacCheckboxGroup } from './mac-checkbox';
+export type { CheckboxOption } from './mac-checkbox';

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

@@ -0,0 +1,94 @@
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-checkbox
+ * @summary macOS 风格的复选框组件。
+ *
+ * @slot - 复选框的标签。
+ *
+ * @csspart base - 复选框的基础容器。
+ * @csspart control - 复选框的控制框。
+ * @csspart label - 标签元素。
+ */
+export declare class MacCheckbox extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 复选框的值。 */
+    value: string;
+    /** 复选框是否被选中（受控模式）。 */
+    checked: boolean;
+    /** 复选框默认是否被选中（非受控模式）。 */
+    defaultChecked: boolean;
+    /** 复选框是否处于半选状态。 */
+    indeterminate: boolean;
+    /** 禁用复选框。 */
+    disabled: boolean;
+    /** 复选框的标签文本。 */
+    label: string;
+    /** 复选框的尺寸。 */
+    size?: 'sm' | 'md' | 'lg';
+    private _groupValue?;
+    private get _isControlled();
+    private get _isChecked();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _registerToGroup;
+    private _unregisterFromGroup;
+    private _findGroup;
+    /** 由父组调用以同步值。 */
+    _setGroupValue(value: string[] | undefined): void;
+    private _handleClick;
+    private _handleKeydown;
+    render(): import("lit").TemplateResult<1>;
+}
+export interface CheckboxOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+/**
+ * @tag mac-checkbox-group
+ * @summary macOS 风格的复选框组组件。
+ *
+ * @slot - 用于放置 mac-checkbox 元素的默认插槽。
+ *
+ * @csspart base - 组的基础容器。
+ *
+ * @event mac-change - 选中值变化时触发。
+ */
+export declare class MacCheckboxGroup extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 组的值（受控模式）。 */
+    value: string[];
+    /** 默认值（非受控模式）。 */
+    defaultValue: string[];
+    /** 复选框的 name 属性。 */
+    name: string;
+    /** 组的尺寸。 */
+    size?: 'sm' | 'md' | 'lg';
+    /** 禁用组内所有复选框。 */
+    disabled: boolean;
+    /** 布局方向。 */
+    direction: 'horizontal' | 'vertical';
+    /** 简化用法时的选项数组。 */
+    options?: CheckboxOption[];
+    /** 最大可选数量。 */
+    max?: number;
+    private _checkboxes;
+    private get _isControlled();
+    private get _resolvedValue();
+    connectedCallback(): void;
+    updated(): void;
+    _registerCheckbox(checkbox: MacCheckbox): void;
+    private _applyGroupProps;
+    private _applyPropsToCheckbox;
+    _unregisterCheckbox(checkbox: MacCheckbox): void;
+    _toggleValue(value: string, checked: boolean): void;
+    private _syncCheckboxes;
+    private _handleSlotChange;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-checkbox': MacCheckbox;
+        'mac-checkbox-group': MacCheckboxGroup;
+    }
+}

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

@@ -0,0 +1,17 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-checkbox';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const Checked: Story;
+export declare const Indeterminate: Story;
+export declare const Disabled: Story;
+export declare const Sizes: Story;
+export declare const LabelProp: Story;
+export declare const GroupDefault: Story;
+export declare const GroupVertical: Story;
+export declare const GroupWithOptions: Story;
+export declare const GroupSizes: Story;
+export declare const GroupMax: Story;
+export declare const Controlled: Story;

package/dist/types/components/config-provider/index.d.ts

@@ -0,0 +1 @@
+export { MacConfigProvider } from './mac-config-provider';

package/dist/types/components/config-provider/mac-config-provider.d.ts

@@ -0,0 +1,23 @@
+import { BaseElement } from '../../internal/base-element';
+/**
+ * @tag mac-config-provider
+ * @summary 将主题和尺寸设置传递给子组件的配置提供者。
+ *
+ * @slot - 将继承配置的子组件。
+ */
+export declare class MacConfigProvider extends BaseElement {
+    static styles: import("lit").CSSResult[];
+    /** 全局主题：'light'、'dark' 或 'auto'（跟随系统偏好）。 */
+    theme: 'light' | 'dark';
+    /** 全局尺寸：'sm'、'md' 或 'lg'。 */
+    size: 'sm' | 'md' | 'lg';
+    connectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    private _updateDataAttributes;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'mac-config-provider': MacConfigProvider;
+    }
+}

package/dist/types/components/config-provider/mac-config-provider.stories.d.ts

@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+import './mac-config-provider';
+import '../button/mac-button';
+import '../input/mac-input';
+import '../select/mac-select';
+import '../number-animation/mac-number-animation';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+export declare const LargeSize: Story;
+export declare const DarkTheme: Story;

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

@@ -0,0 +1,2 @@
+export { MacConfirm } from './mac-confirm';
+export type { ConfirmOptions } from './mac-confirm';