@ticatec/uniface-element 0.3.23 → 5.0.1

package/dist/unit-number-editor/UnitNumberEditor.svelte.d.ts

@@ -1,46 +0,0 @@
-import { DisplayMode } from "../common/DisplayMode";
-import type { OnChangeHandler } from "../common/OnChangeHandler";
-import type UnitOption from "./UnitOption";
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const UnitNumberEditor: $$__sveltets_2_IsomorphicComponent<{
-    disabled?: boolean;
-    readonly?: boolean;
-    variant?: "" | "plain" | "outlined" | "filled";
-    compact?: boolean;
-    class?: string;
-    style?: string;
-    value: number | null;
-    prefix?: string;
-    allowNegative?: boolean;
-    displayMode?: DisplayMode;
-    removable?: boolean;
-    unitCode?: string;
-    onchange?: OnChangeHandler<number | null>;
-    onfocus?: ((event: FocusEvent) => void) | null;
-    onblur?: ((event: FocusEvent) => void) | null;
-    units: Array<UnitOption>;
-    menu$height?: number;
-    placeholder?: string;
-    setFocus?: () => void;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    'leading-icon': {};
-}, {
-    class: string;
-    setFocus: () => void;
-}, string>;
-type UnitNumberEditor = InstanceType<typeof UnitNumberEditor>;
-export default UnitNumberEditor;

package/dist/unit-number-editor/UnitOption.d.ts

@@ -1,26 +0,0 @@
-export default interface UnitOption {
-    /**
-     * 单位编码
-     */
-    code: string;
-    /**
-     * 单位文字
-     */
-    text?: string;
-    /**
-     * 标准比例
-     */
-    ratio?: number;
-    /**
-     * 小数位
-     */
-    precision?: number | null;
-    /**
-     * 最大值
-     */
-    max?: number | null;
-    /**
-     * 最小值
-     */
-    min?: number | null;
-}

package/docs/buttons/cn/ActionBar.md

@@ -1,459 +0,0 @@
-# ActionBar 组件
-
-`ActionBar` 组件提供了一个容器，用于组织多个按钮操作，确保一致的间距和布局。
-
-## 基础用法
-
-```svelte
-<script lang="ts">
-  import ActionBar from '@ticatec/uniface-element/ActionBar';
-  import type { ButtonActions } from '@ticatec/uniface-element';
-  
-  const actions: ButtonActions = [
-    {
-      label: "保存",
-      type: "primary",
-      icon: "icon_google_save",
-      handler: async () => {
-        await saveChanges();
-      }
-    },
-    {
-      label: "取消",
-      type: "secondary",
-      handler: async () => {
-        closeDialog();
-      }
-    }
-  ];
-</script>
-
-<ActionBar buttons={actions} />
-```
-
-## 高级用法
-
-```svelte
-<script lang="ts">
-  import ActionBar from '@ticatec/uniface-element/ActionBar';
-  import type { ButtonActions } from '@ticatec/uniface-element';
-  
-  let isProcessing = false;
-  
-  const formActions: ButtonActions = [
-    {
-      label: "重置",
-      type: "default",
-      icon: "icon_google_undo",
-      handler: async () => {
-        resetForm();
-      }
-    },
-    null, // 分隔符
-    {
-      label: "预览",
-      type: "secondary",
-      icon: "icon_google_visibility",
-      handler: async () => {
-        showPreview();
-      }
-    },
-    {
-      label: isProcessing ? "处理中..." : "提交",
-      type: "primary",
-      icon: "icon_google_send",
-      disabled: isProcessing,
-      handler: async () => {
-        isProcessing = true;
-        try {
-          await submitForm();
-        } finally {
-          isProcessing = false;
-        }
-      }
-    }
-  ];
-</script>
-
-<ActionBar 
-  buttons={formActions} 
-  gap={12}
-  style="padding: 16px; justify-content: flex-end;"
-/>
-```
-
-## 带自定义内容的 ActionBar
-
-```svelte
-<script lang="ts">
-  import ActionBar from '@ticatec/uniface-element/ActionBar';
-  import Button from '@ticatec/uniface-element/Button';
-</script>
-
-<!-- 当没有提供 buttons 属性时，使用插槽内容 -->
-<ActionBar gap={16} style="padding: 20px;">
-  <Button label="自定义操作 1" type="primary" onClick={action1} />
-  <Button label="自定义操作 2" type="secondary" onClick={action2} />
-  <Button label="自定义操作 3" type="default" onClick={action3} />
-</ActionBar>
-```
-
-## 属性
-
-| 属性 | 类型 | 默认值 | 描述 |
-|------|------|--------|------|
-| `buttons` | `ButtonActions` | `[]` | 按钮配置数组 |
-| `style` | `string` | `''` | 自定义 CSS 样式 |
-| `gap` | `number` | `8` | 按钮间距，单位像素 |
-
-## API 参考
-
-### ButtonAction 接口
-
-```typescript
-interface ButtonAction {
-  /** 按钮标签文本 */
-  label: string;
-  
-  /** 按钮是否禁用 */
-  disabled?: boolean;
-  
-  /** 图标类（如 Google Material Icons） */
-  icon?: string;
-  
-  /** 按钮类型用于样式设置 */
-  type?: ButtonType;
-  
-  /** 点击事件处理器 */
-  handler?: MouseClickHandler;
-}
-
-type ButtonActions = Array<ButtonAction | null>;
-```
-
-### MouseClickHandler 类型
-
-```typescript
-type MouseClickHandler = (event: MouseEvent) => Promise<void>;
-```
-
-## 使用示例
-
-### 对话框操作
-
-```svelte
-<script lang="ts">
-  import ActionBar from '@ticatec/uniface-element/ActionBar';
-  import type { ButtonActions } from '@ticatec/uniface-element';
-  
-  export let onSave: () => Promise<void>;
-  export let onCancel: () => void;
-  
-  const dialogActions: ButtonActions = [
-    {
-      label: "取消",
-      type: "secondary",
-      handler: async () => {
-        onCancel();
-      }
-    },
-    {
-      label: "保存更改",
-      type: "primary",
-      icon: "icon_google_save",
-      handler: async () => {
-        await onSave();
-      }
-    }
-  ];
-</script>
-
-<div class="dialog-footer">
-  <ActionBar buttons={dialogActions} style="justify-content: flex-end;" />
-</div>
-```
-
-### 表单操作栏
-
-```svelte
-<script lang="ts">
-  import ActionBar from '@ticatec/uniface-element/ActionBar';
-  import type { ButtonActions } from '@ticatec/uniface-element';
-  
-  let formData = {};
-  let isSubmitting = false;
-  let isDraft = false;
-  
-  const formActions: ButtonActions = [
-    {
-      label: "重置",
-      type: "default",
-      handler: async () => {
-        formData = {};
-      }
-    },
-    null, // 分隔符
-    {
-      label: isDraft ? "保存中..." : "保存草稿",
-      type: "secondary",
-      icon: "icon_google_save",
-      disabled: isDraft,
-      handler: async () => {
-        isDraft = true;
-        try {
-          await saveDraft(formData);
-        } finally {
-          isDraft = false;
-        }
-      }
-    },
-    {
-      label: isSubmitting ? "提交中..." : "提交",
-      type: "primary",
-      icon: "icon_google_send",
-      disabled: isSubmitting,
-      handler: async () => {
-        isSubmitting = true;
-        try {
-          await submitForm(formData);
-        } finally {
-          isSubmitting = false;
-        }
-      }
-    }
-  ];
-</script>
-
-<form>
-  <!-- 表单字段在此 -->
-  
-  <div class="form-footer">
-    <ActionBar 
-      buttons={formActions} 
-      gap={12}
-      style="justify-content: flex-end; margin-top: 24px;"
-    />
-  </div>
-</form>
-```
-
-### 工具栏实现
-
-```svelte
-<script lang="ts">
-  import ActionBar from '@ticatec/uniface-element/ActionBar';
-  import type { ButtonActions } from '@ticatec/uniface-element';
-  
-  let selectedItems = [];
-  
-  const toolbarActions: ButtonActions = [
-    {
-      label: "全选",
-      icon: "icon_google_check_box",
-      type: "default",
-      handler: async () => {
-        selectAll();
-      }
-    },
-    null, // 分隔符
-    {
-      label: "导出",
-      icon: "icon_google_download",
-      type: "secondary",
-      disabled: selectedItems.length === 0,
-      handler: async () => {
-        await exportItems(selectedItems);
-      }
-    },
-    {
-      label: "删除选中",
-      icon: "icon_google_delete",
-      type: "third",
-      disabled: selectedItems.length === 0,
-      handler: async () => {
-        if (confirm(`删除 ${selectedItems.length} 个项目?`)) {
-          await deleteItems(selectedItems);
-        }
-      }
-    }
-  ];
-</script>
-
-<div class="toolbar">
-  <div class="toolbar-info">
-    已选择 {selectedItems.length} 个项目
-  </div>
-  <ActionBar buttons={toolbarActions} />
-</div>
-
-<style>
-  .toolbar {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 12px;
-    border-bottom: 1px solid #eee;
-  }
-  
-  .toolbar-info {
-    color: #666;
-    font-size: 14px;
-  }
-</style>
-```
-
-### 卡片操作栏
-
-```svelte
-<script lang="ts">
-  import ActionBar from '@ticatec/uniface-element/ActionBar';
-  import type { ButtonActions } from '@ticatec/uniface-element';
-  
-  export let item: any;
-  export let onEdit: (item: any) => Promise<void>;
-  export let onShare: (item: any) => Promise<void>;
-  export let onDelete: (item: any) => Promise<void>;
-  
-  const cardActions: ButtonActions = [
-    {
-      label: "编辑",
-      icon: "icon_google_edit",
-      type: "primary",
-      handler: async () => {
-        await onEdit(item);
-      }
-    },
-    {
-      label: "分享",
-      icon: "icon_google_share",
-      type: "secondary",
-      handler: async () => {
-        await onShare(item);
-      }
-    },
-    {
-      label: "删除",
-      icon: "icon_google_delete",
-      type: "third",
-      handler: async () => {
-        if (confirm("确定要删除此项目吗？")) {
-          await onDelete(item);
-        }
-      }
-    }
-  ];
-</script>
-
-<div class="card">
-  <div class="card-content">
-    <!-- 卡片内容 -->
-  </div>
-  
-  <div class="card-actions">
-    <ActionBar buttons={cardActions} gap={8} />
-  </div>
-</div>
-
-<style>
-  .card {
-    border: 1px solid #e0e0e0;
-    border-radius: 8px;
-    overflow: hidden;
-  }
-  
-  .card-content {
-    padding: 16px;
-  }
-  
-  .card-actions {
-    padding: 12px 16px;
-    background: #f8f9fa;
-    border-top: 1px solid #e0e0e0;
-  }
-</style>
-```
-
-## 最佳实践
-
-### 使用分隔符组织操作
-
-使用 `null` 值作为分隔符来组织相关操作：
-
-```svelte
-<script lang="ts">
-  const editorActions: ButtonActions = [
-    // 文件操作组
-    { label: "新建", icon: "icon_google_add", handler: newFile },
-    { label: "打开", icon: "icon_google_folder_open", handler: openFile },
-    { label: "保存", icon: "icon_google_save", handler: saveFile },
-    
-    null, // 分隔符
-    
-    // 编辑操作组
-    { label: "撤销", icon: "icon_google_undo", handler: undo },
-    { label: "重做", icon: "icon_google_redo", handler: redo },
-    
-    null, // 分隔符
-    
-    // 主要操作
-    { label: "发布", type: "primary", icon: "icon_google_publish", handler: publish }
-  ];
-</script>
-```
-
-### 使用合适的间距
-
-根据界面密度调整按钮间距：
-
-```svelte
-<!-- 紧凑界面 -->
-<ActionBar buttons={actions} gap={4} />
-
-<!-- 标准界面 -->
-<ActionBar buttons={actions} gap={8} />
-
-<!-- 宽松界面 -->
-<ActionBar buttons={actions} gap={16} />
-```
-
-### 响应式设计
-
-考虑在小屏幕上隐藏或简化操作：
-
-```svelte
-<script lang="ts">
-  import { onMount } from 'svelte';
-  
-  let isMobile = false;
-  
-  onMount(() => {
-    const checkMobile = () => {
-      isMobile = window.innerWidth < 768;
-    };
-    
-    checkMobile();
-    window.addEventListener('resize', checkMobile);
-    
-    return () => window.removeEventListener('resize', checkMobile);
-  });
-  
-  $: responsiveActions = isMobile 
-    ? [
-        { label: "保存", type: "primary", handler: save },
-        { label: "取消", type: "secondary", handler: cancel }
-      ]
-    : [
-        { label: "重置", type: "default", handler: reset },
-        null,
-        { label: "预览", type: "secondary", handler: preview },
-        { label: "保存", type: "primary", handler: save },
-        { label: "取消", type: "secondary", handler: cancel }
-      ];
-</script>
-
-<ActionBar buttons={responsiveActions} />
-```
-
-## 点击节流
-
-ActionBar 中的所有按钮都实现了自动点击节流，具有 500ms 冷却时间，以防止意外的双击并确保正确的异步操作处理。