@ticatec/uniface-element 0.3.22 → 5.0.0

package/dist/layouts/page/README.md

@@ -0,0 +1,286 @@
+# Page Component
+
+A full-page container with a fixed-height header (title + comment + optional back/reload icon) and a flexible content area. The default styled shell for route-level views — rounded corners, soft shadow, theme tokens for every color.
+
+## Features
+
+- **Fixed 48px header**: title, optional comment (subtitle, truncated), optional back OR reload icon
+- **Flexible content area**: takes remaining height, clips overflow
+- **Optional rounded corners and shadow** (`round` / `shadow`, both on by default)
+- **Three header customization hooks**: text props (`title` / `comment`), `headerExt` snippet for extra header content, full `pageHeader` snippet for complete replacement
+- **Async-aware navigation actions**: `goBack` / `reload` are `() => any` (may be async) — forwarded to the Icon's debounced click handler
+- **Theme hook**: `data-theme="{theme}"` on the outer wrapper
+
+## Installation
+
+```bash
+npm install @ticatec/uniface-element
+```
+
+## Import
+
+```typescript
+import Page, { PageHeader, type PageAction } from '@ticatec/uniface-element/Page';
+```
+
+`PageHeader` is exported as a named export in case you want to use it standalone (the `pageHeader` snippet opt-out is usually enough).
+
+## Basic Usage
+
+```svelte
+<script>
+  import Page from '@ticatec/uniface-element/Page';
+</script>
+
+<Page title="My Page" comment="Page description">
+  <div>Page content goes here</div>
+</Page>
+```
+
+Renders a rounded, shadowed card with a 48px header ("My Page" + "Page description") and a flexible body.
+
+## Props
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `title` | `string` | `''` | Page title in the header (`font-weight: 600`, `1.1em`) |
+| `comment` | `string` | `''` | Subtitle to the right of the title. Truncates with `…` if long. |
+| `goBack` | `PageAction \| undefined` | `undefined` | **If provided, shows a back icon (`icon_google_keyboard_backspace`) as the leftmost header element. Wins over `reload` if both are set.** |
+| `reload` | `PageAction \| undefined` | `undefined` | If provided (and `goBack` is not), shows a refresh icon (`icon_google_refresh`). |
+| `round` | `boolean` | `true` | Apply `border-radius: var(--uniface-page-border-radius)` |
+| `shadow` | `boolean` | `true` | Apply `box-shadow: var(--uniface-page-box-shadow)` |
+| `content$style` | `string` | `''` | Inline CSS on the content area (e.g. `padding: 16px;`) |
+| `style` | `string` | `''` | Inline CSS on the outer wrapper |
+| `theme` | `string \| undefined` | `undefined` | Set as `data-theme` on the outer wrapper |
+| `pageHeader` | `Snippet<[string, string?, PageAction?, PageAction?]> \| undefined` | `undefined` | **Replaces** the default PageHeader. Snippet args: `(title, comment, goBack, reload)`. |
+| `headerExt` | `Snippet \| undefined` | `undefined` | Extra content rendered at the right of the default PageHeader. Ignored if `pageHeader` snippet is set (you handle layout yourself then). |
+| `children` | `Snippet \| undefined` | `undefined` | Body content |
+
+> **`goBack` and `reload` are mutually exclusive.** If both are provided, only `goBack` renders (the back icon). The `reload` icon only appears when `goBack` is absent. This is by design — the slot holds a single leading icon.
+
+## PageAction
+
+```ts
+type PageAction = () => any;
+```
+
+A zero-arg function that may return anything (including a `Promise`). The value is ignored; only the call matters. The Icon wrapper that handles the click awaits the result before re-enabling clicks.
+
+## Layout
+
+```text
+┌──────────────────────────────────────────────────────┐
+│ .uniface-page-wrapper (padding = page-margin-size)   │
+│  ┌────────────────────────────────────────────────┐  │
+│  │ .uniface-page (round + shadow)                 │  │
+│  │  ┌──────────────────────────────────────────┐  │  │
+│  │  │ .uniface-page-header (height: 48px)      │  │  │
+│  │  │ [← back] Title  Comment…   [headerExt]   │  │  │
+│  │  ├──────────────────────────────────────────┤  │  │
+│  │  │ .page-container (flex 1, overflow hidden)│  │  │
+│  │  │   {children}                             │  │  │
+│  │  └──────────────────────────────────────────┘  │  │
+│  └────────────────────────────────────────────────┘  │
+└──────────────────────────────────────────────────────┘
+```
+
+The outer wrapper fills its parent (`width: 100%`) with a margin-sized padding around the inner page card. The inner page is a flex-column: header (fixed height), content (flex 1, clips overflow).
+
+## Examples
+
+### Basic
+
+```svelte
+<Page title="Dashboard">
+  <h1>Welcome to the dashboard</h1>
+  <p>View your analytics and metrics here.</p>
+</Page>
+```
+
+### With Back Action
+
+```svelte
+<script>
+  import { goto } from '$app/navigation';
+
+  function goBack() {
+    goto('/dashboard');
+  }
+</script>
+
+<Page
+  title="User Profile"
+  comment="Manage your account settings"
+  goBack={goBack}
+>
+  <!-- form here -->
+</Page>
+```
+
+### With Reload Action
+
+```svelte
+<script>
+  async function reload() {
+    await refreshData();
+  }
+</script>
+
+<Page
+  title="Live Monitor"
+  comment="Auto-refreshed every 30s"
+  reload={reload}
+>
+  <!-- live data -->
+</Page>
+```
+
+### Header Extensions (headerExt snippet)
+
+Add action buttons to the right of the default header:
+
+```svelte
+<Page title="Settings">
+  {#snippet headerExt()}
+    <button onclick={save}>Save</button>
+    <button onclick={reset}>Reset</button>
+  {/snippet}
+
+  <!-- settings form -->
+</Page>
+```
+
+### Full Header Replacement (pageHeader snippet)
+
+Replace the entire header. The snippet receives `(title, comment, goBack, reload)`:
+
+```svelte
+<Page title="Search Results" goBack={() => history.back()}>
+  {#snippet pageHeader(title, comment, goBack, reload)}
+    <div style="display: flex; align-items: center; gap: 12px; padding: 0 16px;">
+      {#if goBack}
+        <Icon name="icon_google_keyboard_backspace" onclick={goBack} />
+      {/if}
+      <h2 style="margin: 0;">{title}</h2>
+      {#if comment}
+        <span style="color: #6b7280;">{comment}</span>
+      {/if}
+    </div>
+  {/snippet}
+
+  <!-- results list -->
+</Page>
+```
+
+> When you override with `pageHeader`, the `headerExt` snippet is **ignored** — you must render the extension content yourself inside the snippet.
+
+### Stripped-Down (no rounding, no shadow)
+
+```svelte
+<Page title="Edge-to-edge" round={false} shadow={false}>
+  <!-- content touches the borders -->
+</Page>
+```
+
+### Padded Content
+
+```svelte
+<Page
+  title="Card Content"
+  comment="With padded body"
+  content$style="padding: 20px;"
+>
+  <p>Body content with 20px padding.</p>
+</Page>
+```
+
+## DOM Structure & CSS
+
+```html
+<div class="uniface-page-wrapper" style="..." data-theme="...">
+  <div class="uniface-page" class:round class:shadow>
+    <div class="uniface-page-header">
+      <!-- pageHeader snippet OR default PageHeader -->
+    </div>
+    <div class="page-container" style="{content$style}">
+      <!-- children -->
+    </div>
+  </div>
+</div>
+```
+
+### Default PageHeader (when no `pageHeader` snippet)
+
+```html
+<!-- goBack OR reload icon, only one renders -->
+<div style="padding-right: 12px;">
+  <Icon name="icon_google_keyboard_backspace" onclick={goBack} />
+</div>
+
+<div class="page-topic"><span>{title}</span></div>
+<div class="page-comment"><span>{comment}</span></div>   <!-- only if comment non-empty -->
+
+<!-- headerExt snippet if provided -->
+```
+
+Built-in header element styles:
+
+```css
+.page-topic    { font-size: 1.1em; font-weight: 600; }
+.page-comment  {
+  flex: 1 1 auto;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;          /* single line */
+  color: var(--uniface-page-header-comment-color);
+  margin-left: 8px;
+  padding: 0 8px;
+}
+```
+
+### CSS Variables
+
+| Variable | Purpose |
+|----------|---------|
+| `--uniface-page-margin-size` | Outer wrapper padding (around the page card) |
+| `--uniface-page-color-margin-surface` | Outer wrapper background |
+| `--uniface-page-color-surface` | Inner page background |
+| `--uniface-page-text-color` | Inner page text color |
+| `--uniface-page-border-color` | Inner page border (1px) |
+| `--uniface-page-border-radius` | Border radius when `round=true` |
+| `--uniface-page-box-shadow` | Box shadow when `shadow=true` |
+| `--uniface-page-header-height` | Header height (default `48px`) |
+| `--uniface-page-header-margin` | Header horizontal padding |
+| `--uniface-page-color-header-bottom` | Header bottom border color |
+| `--uniface-page-header-comment-color` | Comment text color |
+
+## Behavior Notes
+
+- **`goBack` and `reload` are mutually exclusive.** Both set → only `goBack` renders.
+- **The header always renders**, even with empty title — it's just an empty 48px bar then.
+- **Comment truncates with `…`** (`white-space: nowrap; text-overflow: ellipsis`). Long comments are clipped without a tooltip.
+- **Content area clips overflow** (`overflow: hidden`) — it does not scroll. Wrap your content in its own `overflow: auto` container if needed.
+- **Page fills its parent**. The outer wrapper is `width: 100%`, the inner page is `width: 100%; height: 100%`. Put it in a sized parent.
+- **Click debouncing**: `goBack` / `reload` go through the [Icon](../../general/icon/README.md) wrapper, which awaits the handler and adds a 200ms cooldown. Rapid clicks won't fire repeatedly.
+- **`pageHeader` snippet args**: `(title, comment, goBack, reload)` — the same values you passed as props. Use them or ignore them.
+
+## Accessibility
+
+- The back/reload icons are `aria-hidden="true"` (decorative). The action is mouse-only — there's no keyboard activation. If keyboard support matters, render your own `<button>` in `headerExt`.
+- Title and comment are plain `<span>` text — no heading semantics. For document outline, wrap the title in `<h1>` inside the `pageHeader` snippet.
+- No `role="main"` or landmark — add `role="main"` on the wrapping element yourself if you want the page to be detected as the primary content area.
+
+## Best Practices
+
+1. **Pass `goBack` for nested routes**, `reload` for live-data pages — they share one slot, so don't set both.
+2. **Use `comment` for context** — page purpose, record count, last-updated time. Keep it short; it truncates.
+3. **Use `headerExt` for actions** (Save, Edit, Filter) rather than cramming them into the content area.
+4. **Override `pageHeader` only when you need a fundamentally different header** (e.g. tabs in the header). For simple additions, `headerExt` is enough.
+5. **Wrap scrollable content yourself** — Page's content area is `overflow: hidden`, not `auto`.
+6. **Pair with `Box` for sections** inside the page body — Page gives you the shell, Box gives you internal cards.
+
+## Related Components
+
+- [Box](../box/README.md) — section cards inside a Page body
+- [Icon](../../general/icon/README.md) — what renders the back/reload icons
+- [AppTopBar](../app_top_bar/README.md) — app-shell top bar (sibling concept at a higher level)

package/dist/layouts/page/README_CN.md

@@ -0,0 +1,286 @@
+# Page 页面组件
+
+整页容器：固定高度的 header（标题 + 注释 + 可选的 back/reload 图标）+ 弹性的内容区。路由级视图的默认带样式外壳 —— 圆角、柔和阴影、每个颜色都有主题令牌。
+
+## 功能特性
+
+- **固定 48px header**：标题、可选注释（副标题，截断）、可选 back 或 reload 图标
+- **弹性内容区**：占满剩余高度，裁剪溢出
+- **可选圆角和阴影**（`round` / `shadow`，默认都开）
+- **三种 header 定制钩子**：文本 props（`title` / `comment`）、`headerExt` snippet 加额外 header 内容、完整 `pageHeader` snippet 完全替换
+- **异步感知的导航动作**：`goBack` / `reload` 是 `() => any`（可为 async） —— 透传给 Icon 的防抖点击处理器
+- **主题钩子**：外层 wrapper 暴露 `data-theme="{theme}"`
+
+## 安装
+
+```bash
+npm install @ticatec/uniface-element
+```
+
+## 导入
+
+```typescript
+import Page, { PageHeader, type PageAction } from '@ticatec/uniface-element/Page';
+```
+
+`PageHeader` 是命名导出，需要单独用时可以导入（多数场景下用 `pageHeader` snippet 覆盖就够了）。
+
+## 基本用法
+
+```svelte
+<script>
+  import Page from '@ticatec/uniface-element/Page';
+</script>
+
+<Page title="我的页面" comment="页面描述">
+  <div>页面内容</div>
+</Page>
+```
+
+渲染一个带圆角和阴影的卡片，48px header（"我的页面" + "页面描述"）+ 弹性 body。
+
+## 属性
+
+| 属性 | 类型 | 默认值 | 描述 |
+|------|------|---------|-------------|
+| `title` | `string` | `''` | header 中的页面标题（`font-weight: 600`、`1.1em`） |
+| `comment` | `string` | `''` | 标题右侧的副标题。长了用 `…` 截断 |
+| `goBack` | `PageAction \| undefined` | `undefined` | **提供时，显示 back 图标（`icon_google_keyboard_backspace`）作为 header 最左侧元素。与 `reload` 同时设置时 `goBack` 胜出** |
+| `reload` | `PageAction \| undefined` | `undefined` | 提供 `goBack` 时无效；否则显示刷新图标（`icon_google_refresh`） |
+| `round` | `boolean` | `true` | 应用 `border-radius: var(--uniface-page-border-radius)` |
+| `shadow` | `boolean` | `true` | 应用 `box-shadow: var(--uniface-page-box-shadow)` |
+| `content$style` | `string` | `''` | 内容区的内联 CSS（如 `padding: 16px;`） |
+| `style` | `string` | `''` | 外层 wrapper 的内联 CSS |
+| `theme` | `string \| undefined` | `undefined` | 设为外层 wrapper 的 `data-theme` |
+| `pageHeader` | `Snippet<[string, string?, PageAction?, PageAction?]> \| undefined` | `undefined` | **替换**默认 PageHeader。Snippet 参数：`(title, comment, goBack, reload)` |
+| `headerExt` | `Snippet \| undefined` | `undefined` | 默认 PageHeader 右侧的额外内容。设置了 `pageHeader` snippet 时被忽略（那时布局你自己控） |
+| `children` | `Snippet \| undefined` | `undefined` | body 内容 |
+
+> **`goBack` 和 `reload` 互斥。** 两者都设 → 只渲染 `goBack`（back 图标）。`reload` 图标只在 `goBack` 缺席时出现。这是设计如此 —— 该槽位只装一个前置图标。
+
+## PageAction
+
+```ts
+type PageAction = () => any;
+```
+
+零参函数，可返回任何东西（包括 `Promise`）。返回值被忽略，只在乎调用。处理点击的 Icon wrapper 会 await 结果再放行下次点击。
+
+## 布局
+
+```text
+┌──────────────────────────────────────────────────────┐
+│ .uniface-page-wrapper (padding = page-margin-size)   │
+│  ┌────────────────────────────────────────────────┐  │
+│  │ .uniface-page (round + shadow)                 │  │
+│  │  ┌──────────────────────────────────────────┐  │  │
+│  │  │ .uniface-page-header (height: 48px)      │  │  │
+│  │  │ [← back] 标题  注释…     [headerExt]      │  │  │
+│  │  ├──────────────────────────────────────────┤  │  │
+│  │  │ .page-container (flex 1, overflow hidden)│  │  │
+│  │  │   {children}                             │  │  │
+│  │  └──────────────────────────────────────────┘  │  │
+│  └────────────────────────────────────────────────┘  │
+└──────────────────────────────────────────────────────┘
+```
+
+外层 wrapper 占满父容器（`width: 100%`），内层 page 卡片四周有 margin-size 的留白。内层 page 是 flex-column：header（固定高）+ 内容（flex 1，裁剪溢出）。
+
+## 示例
+
+### 基础
+
+```svelte
+<Page title="仪表板">
+  <h1>欢迎使用仪表板</h1>
+  <p>在此查看分析和指标。</p>
+</Page>
+```
+
+### 带 back 动作
+
+```svelte
+<script>
+  import { goto } from '$app/navigation';
+
+  function goBack() {
+    goto('/dashboard');
+  }
+</script>
+
+<Page
+  title="用户资料"
+  comment="管理账户设置"
+  goBack={goBack}
+>
+  <!-- 表单 -->
+</Page>
+```
+
+### 带 reload 动作
+
+```svelte
+<script>
+  async function reload() {
+    await refreshData();
+  }
+</script>
+
+<Page
+  title="实时监控"
+  comment="每 30 秒自动刷新"
+  reload={reload}
+>
+  <!-- 实时数据 -->
+</Page>
+```
+
+### Header 扩展（headerExt snippet）
+
+在默认 header 右侧加操作按钮：
+
+```svelte
+<Page title="设置">
+  {#snippet headerExt()}
+    <button onclick={save}>保存</button>
+    <button onclick={reset}>重置</button>
+  {/snippet}
+
+  <!-- 设置表单 -->
+</Page>
+```
+
+### 完全替换 header（pageHeader snippet）
+
+替换整个 header。snippet 接收 `(title, comment, goBack, reload)`：
+
+```svelte
+<Page title="搜索结果" goBack={() => history.back()}>
+  {#snippet pageHeader(title, comment, goBack, reload)}
+    <div style="display: flex; align-items: center; gap: 12px; padding: 0 16px;">
+      {#if goBack}
+        <Icon name="icon_google_keyboard_backspace" onclick={goBack} />
+      {/if}
+      <h2 style="margin: 0;">{title}</h2>
+      {#if comment}
+        <span style="color: #6b7280;">{comment}</span>
+      {/if}
+    </div>
+  {/snippet}
+
+  <!-- 结果列表 -->
+</Page>
+```
+
+> 用 `pageHeader` 覆盖时，`headerExt` snippet **被忽略** —— 扩展内容由你在 snippet 里自己渲染
+
+### 极简（无圆角、无阴影）
+
+```svelte
+<Page title="贴边内容" round={false} shadow={false}>
+  <!-- 内容贴着边框 -->
+</Page>
+```
+
+### 内容加 padding
+
+```svelte
+<Page
+  title="卡片内容"
+  comment="body 带 padding"
+  content$style="padding: 20px;"
+>
+  <p>body 内容有 20px 内边距。</p>
+</Page>
+```
+
+## DOM 结构与 CSS
+
+```html
+<div class="uniface-page-wrapper" style="..." data-theme="...">
+  <div class="uniface-page" class:round class:shadow>
+    <div class="uniface-page-header">
+      <!-- pageHeader snippet 或默认 PageHeader -->
+    </div>
+    <div class="page-container" style="{content$style}">
+      <!-- children -->
+    </div>
+  </div>
+</div>
+```
+
+### 默认 PageHeader（未提供 `pageHeader` snippet 时）
+
+```html
+<!-- goBack 或 reload 图标，只渲染一个 -->
+<div style="padding-right: 12px;">
+  <Icon name="icon_google_keyboard_backspace" onclick={goBack} />
+</div>
+
+<div class="page-topic"><span>{title}</span></div>
+<div class="page-comment"><span>{comment}</span></div>   <!-- 仅 comment 非空时 -->
+
+<!-- 提供了 headerExt snippet 时 -->
+```
+
+header 元素内置样式：
+
+```css
+.page-topic    { font-size: 1.1em; font-weight: 600; }
+.page-comment  {
+  flex: 1 1 auto;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;          /* 单行 */
+  color: var(--uniface-page-header-comment-color);
+  margin-left: 8px;
+  padding: 0 8px;
+}
+```
+
+### CSS 变量
+
+| 变量 | 用途 |
+|------|------|
+| `--uniface-page-margin-size` | 外层 wrapper 的 padding（page 卡片四周） |
+| `--uniface-page-color-margin-surface` | 外层 wrapper 背景 |
+| `--uniface-page-color-surface` | 内层 page 背景 |
+| `--uniface-page-text-color` | 内层 page 文字色 |
+| `--uniface-page-border-color` | 内层 page 边框（1px） |
+| `--uniface-page-border-radius` | `round=true` 时的圆角半径 |
+| `--uniface-page-box-shadow` | `shadow=true` 时的阴影 |
+| `--uniface-page-header-height` | header 高度（默认 `48px`） |
+| `--uniface-page-header-margin` | header 水平 padding |
+| `--uniface-page-color-header-bottom` | header 底部分隔线颜色 |
+| `--uniface-page-header-comment-color` | 注释文字色 |
+
+## 行为说明
+
+- **`goBack` 和 `reload` 互斥。** 两者都设 → 只渲染 `goBack`
+- **header 总是渲染**，即使 title 为空 —— 那时就是一个空的 48px 条
+- **注释用 `…` 截断**（`white-space: nowrap; text-overflow: ellipsis`）。长注释被裁掉，无 tooltip
+- **内容区裁剪溢出**（`overflow: hidden`）—— 不滚动。需要滚动自己包 `overflow: auto` 容器
+- **Page 占满父容器**。外层 wrapper 是 `width: 100%`，内层 page 是 `width: 100%; height: 100%`。放在有尺寸的父容器里
+- **点击防抖**：`goBack` / `reload` 走 [Icon](../../general/icon/README_CN.md) wrapper，会 await handler 后再加 200ms 冷却。快速连击不会重复触发
+- **`pageHeader` snippet 参数**：`(title, comment, goBack, reload)` —— 跟你传的 props 同值。用不用由你
+
+## 无障碍访问
+
+- back / reload 图标是 `aria-hidden="true"`（装饰性）。动作仅鼠标触发 —— 没有键盘激活。需要键盘支持就在 `headerExt` 里渲染自己的 `<button>`
+- 标题和注释是普通 `<span>` 文字 —— 无 heading 语义。需要文档大纲在 `pageHeader` snippet 里用 `<h1>` 包标题
+- 没有 `role="main"` 或 landmark —— 想让 page 被识别为主内容区，自己在外层元素加 `role="main"`
+
+## 最佳实践
+
+1. **嵌套路由传 `goBack`，实时数据页传 `reload`** —— 两者共用一个槽位，不要同时设
+2. **`comment` 用于上下文** —— 页面用途、记录数、最后更新时间。保持简短，会被截断
+3. **`headerExt` 用于操作**（保存、编辑、筛选），别挤进内容区
+4. **只在需要根本性不同的 header 时才覆盖 `pageHeader`**（比如 header 里放 tabs）。简单加东西用 `headerExt` 就够
+5. **可滚动内容自己包** —— Page 的内容区是 `overflow: hidden`，不是 `auto`
+6. **配合 `Box` 在 page body 里分块** —— Page 给外壳，Box 给内部卡片
+
+## 相关组件
+
+- [Box](../box/README_CN.md) —— Page body 内的区块卡片
+- [Icon](../../general/icon/README_CN.md) —— 渲染 back/reload 图标的组件
+- [AppTopBar](../app_top_bar/README_CN.md) —— app 外壳的顶栏（更高层级的同类概念）

package/dist/layouts/page/index.d.ts

@@ -0,0 +1,6 @@
+import PageHeader from "./PageHeader.svelte";
+import Page from "./Page.svelte";
+import type { PageAction } from "../../types";
+export default Page;
+export { PageHeader };
+export type { PageAction };

package/dist/lib/index.d.ts

@@ -1,10 +1,7 @@
-import TreeNodes from "./TreeNodes";
-import type { ITreeNode } from "./TreeNodes";
-import type { CheckIsRoot, CompareFun, GetText, CheckIsDirectory, TreeNodeOptions } from "./TreeNodes";
-import { MenuNodes } from "./TreeNodes";
-import { compareNumber } from "./TreeNodes";
-export default TreeNodes;
-export { compareNumber };
-export { MenuNodes };
-export type { ITreeNode };
-export type { CheckIsRoot, CompareFun, GetText, CheckIsDirectory, TreeNodeOptions };
+import { HierarchyTree, HierarchyDepthExceededError } from "@ticatec/hierarchy-data";
+import type { IHierarchyData, HierarchyTreeOptions, HierarchyDiagnosticEvent } from "@ticatec/hierarchy-data";
+export { HierarchyTree };
+export { HierarchyDepthExceededError };
+export type { IHierarchyData };
+export type { HierarchyTreeOptions };
+export type { HierarchyDiagnosticEvent };

package/dist/lib/index.js

@@ -1,6 +1,3 @@
-import TreeNodes from "./TreeNodes";
-import { MenuNodes } from "./TreeNodes";
-import { compareNumber } from "./TreeNodes";
-export default TreeNodes;
-export { compareNumber };
-export { MenuNodes };
+import { HierarchyTree, HierarchyDepthExceededError } from "@ticatec/hierarchy-data";
+export { HierarchyTree };
+export { HierarchyDepthExceededError };