@lumen-design/button 0.0.2

package/dist/Button.svelte

@@ -0,0 +1,61 @@
+<script lang="ts">
+    import Icon from '@lumen-design/icon'
+    import { LoaderCircle } from 'lucide'
+    import type { ButtonProps } from './types'
+
+    let {
+        type = 'default',
+        size = 'medium',
+        disabled = false,
+        plain = false,
+        round = false,
+        circle = false,
+        loading = false,
+        children,
+        onclick,
+        class: cls = '',
+        'aria-label': ariaLabel,
+        'aria-current': ariaCurrent,
+        'aria-expanded': ariaExpanded,
+        'aria-haspopup': ariaHaspopup,
+        'aria-controls': ariaControls,
+        ...attrs
+    }: ButtonProps = $props()
+
+    const classes = $derived(
+        `lm-button lm-button--${type} lm-button--${size}${disabled ? ' is-disabled' : ''}${loading ? ' is-loading' : ''}${plain ? ' is-plain' : ''}${round ? ' is-round' : ''}${circle ? ' is-circle' : ''}${cls ? ` ${cls}` : ''}`
+    )
+
+    const handleClick = (e: MouseEvent): void => {
+        if (disabled || loading) {
+            e.preventDefault()
+            e.stopPropagation()
+            return
+        }
+        onclick?.(e)
+    }
+</script>
+
+<button
+    {...attrs}
+    class={classes}
+    type="button"
+    aria-disabled={disabled || loading || undefined}
+    aria-label={ariaLabel}
+    aria-current={ariaCurrent}
+    aria-expanded={ariaExpanded}
+    aria-haspopup={ariaHaspopup}
+    aria-controls={ariaControls}
+    disabled={disabled || loading}
+    onclick={handleClick}
+>
+    {#if loading}
+        <span class="lm-button__loading" aria-hidden="true">
+            <Icon icon={LoaderCircle} size={16} />
+        </span>
+    {/if}
+
+    {#if children && !loading}
+        {@render children()}
+    {/if}
+</button>

package/dist/Button.svelte.d.ts

@@ -0,0 +1,5 @@
+import type { ButtonProps } from './types';
+declare const Button: import("svelte").Component<ButtonProps, {}, "">;
+type Button = ReturnType<typeof Button>;
+export default Button;
+//# sourceMappingURL=Button.svelte.d.ts.map

package/dist/Button.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.svelte.d.ts","sourceRoot":"","sources":["Button.svelte.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAsD3C,QAAA,MAAM,MAAM,iDAAwC,CAAC;AACrD,KAAK,MAAM,GAAG,UAAU,CAAC,OAAO,MAAM,CAAC,CAAC;AACxC,eAAe,MAAM,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+import Button from './Button.svelte';
+export { Button };
+export type { ButtonProps, ButtonSize, ButtonType } from './types';
+export default Button;

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,iBAAiB,CAAA;AAEpC,OAAO,EAAE,MAAM,EAAE,CAAA;AACjB,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAClE,eAAe,MAAM,CAAA"}

package/dist/index.js

@@ -0,0 +1,3 @@
+import Button from './Button.svelte';
+export { Button };
+export default Button;

package/dist/types.d.ts

@@ -0,0 +1,42 @@
+import type { Snippet } from 'svelte';
+/** Button 尺寸 */
+export type ButtonSize = 'small' | 'medium' | 'large';
+/** Button 类型 */
+export type ButtonType = 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
+/** Button 属性 */
+export interface ButtonProps {
+    /** 按钮类型 */
+    type?: ButtonType;
+    /** 按钮尺寸 */
+    size?: ButtonSize;
+    /** 是否朴素按钮 */
+    plain?: boolean;
+    /** 是否圆角按钮 */
+    round?: boolean;
+    /** 是否圆形按钮 */
+    circle?: boolean;
+    /** 是否加载中 */
+    loading?: boolean;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 图标 */
+    icon?: string;
+    /** 子内容 */
+    children?: Snippet;
+    /** 自定义类名 */
+    class?: string;
+    /** 原生样式字符串（透传到 button） */
+    style?: string;
+    /** 点击事件 */
+    onclick?: (event: MouseEvent) => void;
+    /** 无障碍标签 */
+    'aria-label'?: string;
+    /** 当前状态（用于分页等） */
+    'aria-current'?: 'page' | 'step' | 'location' | 'date' | 'time' | 'true' | 'false' | boolean;
+    /** 是否展开（用于可折叠区域） */
+    'aria-expanded'?: boolean;
+    /** 弹出窗口类型 */
+    'aria-haspopup'?: boolean | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';
+    /** 控制的元素 ID */
+    'aria-controls'?: string;
+}

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAA;AAErC,gBAAgB;AAChB,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;AAErD,gBAAgB;AAChB,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAA;AAE1F,gBAAgB;AAChB,MAAM,WAAW,WAAW;IACxB,WAAW;IACX,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,WAAW;IACX,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,aAAa;IACb,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,aAAa;IACb,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,aAAa;IACb,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,YAAY;IACZ,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,WAAW;IACX,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS;IACT,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,UAAU;IACV,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,0BAA0B;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW;IACX,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;IACrC,YAAY;IACZ,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,kBAAkB;IAClB,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,CAAA;IAC5F,oBAAoB;IACpB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,aAAa;IACb,eAAe,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAA;IAC3E,eAAe;IACf,eAAe,CAAC,EAAE,MAAM,CAAA;CAC3B"}

package/dist/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@lumen-design/button",
+  "version": "0.0.2",
+  "description": "Button component for Lumen UI",
+  "type": "module",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "svelte": "./dist/index.js",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "svelte-package -i src -o dist --types",
+    "build:watch": "svelte-package -i src -o dist --types -w"
+  },
+  "devDependencies": {
+    "@sveltejs/package": "^2.5.7",
+    "svelte": "5.48.2"
+  },
+  "peerDependencies": {
+    "svelte": "^5.0.0"
+  },
+  "dependencies": {
+    "lucide": "^0.563.0"
+  }
+}