fds-vue-core 1.0.2 → 1.2.0

package/README.md

@@ -1,7 +1,5 @@
 # FDS Vue Core
 
-A Vue 3 component library with FDS Core integration, built with TypeScript for excellent developer experience.
-
 ## Installation
 
 ```bash
@@ -16,177 +14,18 @@ Make sure you have the required peer dependencies installed:
 npm install vue@^3.5.0 fds-core@^3.8.0
 ```
 
-## Styling
-
-This library is **style-free** and designed to work with your existing CSS framework. The components use standard HTML classes that you can style with:
-
-- **Tailwind CSS** (recommended)
-- **CSS Modules**
-- **Styled Components**
-- **Any CSS framework**
-
-The components will inherit your project's styling automatically.
-
-## Usage
+## Consume
 
-### Global Registration
-
-```typescript
-import { createApp } from 'vue'
+```js
 import FdsVueCore from 'fds-vue-core'
-
-const app = createApp(App)
-app.use(FdsVueCore)
-app.mount('#app')
-```
-
-### Individual Component Import
-
-```typescript
-import { FdsTreeView } from 'fds-vue-core'
-import 'fds-vue-core/style.css'
-```
-
-## Components
-
-### FdsTreeView
-
-A hierarchical tree view component with full TypeScript support.
-
-#### Basic Usage
-
-```vue
-<template>
-  <FdsTreeView
-    :nodes="treeData"
-    :nodeId="'root'"
-    :nodeExpandIcon="'arrowDown'"
-    :nodeCollapseIcon="'arrowUp'"
-    :indentation="20"
-    :showNodeDescription="true"
-    :showChildrenCount="true"
-    :showIndeterminate="true"
-  />
-</template>
-
-<script setup lang="ts">
-import { FdsTreeView, type TreeNode } from 'fds-vue-core'
-
-const treeData: TreeNode[] = [
-  {
-    nodeId: 'root-1',
-    title: 'Documents',
-    children: [
-      {
-        nodeId: 'doc-1',
-        title: 'Work',
-        children: [
-          {
-            nodeId: 'work-1',
-            title: 'Projects',
-            data: { type: 'folder', count: 5 }
-          }
-        ]
-      }
-    ]
-  }
-]
-</script>
-```
-
-#### TypeScript Support
-
-The library provides full TypeScript support with comprehensive type definitions:
-
-```typescript
-import type {
-  TreeNode,
-  TreeNodeArray,
-  TreeNodeItem,
-  TreeViewProps,
-  NodeId,
-  TreeViewEvents,
-  ComponentSize,
-  ComponentVariant
-} from 'fds-vue-core'
-
-// Typed tree data
-interface ProjectData {
-  type: 'project'
-  status: 'active' | 'completed' | 'planning'
-  priority: number
-}
-
-const typedTreeData: TreeNode<ProjectData>[] = [
-  {
-    nodeId: 'proj-1',
-    title: 'My Project',
-    data: {
-      type: 'project',
-      status: 'active',
-      priority: 1
-    }
-  }
-]
 ```
 
-#### Props
-
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| `nodes` | `TreeNode[]` | `[]` | Array of tree nodes |
-| `nodeId` | `string` | - | Unique identifier for the current node |
-| `nodeExpandIcon` | `string` | - | Icon name for expanded state |
-| `nodeCollapseIcon` | `string` | - | Icon name for collapsed state |
-| `indentation` | `number` | - | Indentation level in pixels |
-| `showNodeDescription` | `boolean` | `false` | Show node descriptions |
-| `showChildrenCount` | `boolean` | `false` | Show children count |
-| `showIndeterminate` | `boolean` | `false` | Show indeterminate state for partial selections |
-
-#### Events
-
-| Event | Payload | Description |
-|-------|---------|-------------|
-| `node-select` | `TreeNode` | Fired when a node is selected |
-| `node-expand` | `TreeNode` | Fired when a node is expanded |
-| `node-collapse` | `TreeNode` | Fired when a node is collapsed |
-| `selection-change` | `TreeNode[]` | Fired when selection changes |
-
-## Development
-
-```bash
-# Install dependencies
-npm install
-
-# Start development server
-npm run dev
-
-# Build library
-npm run build
-
-# Type checking
-npm run type-check
-
-# Linting
-npm run lint
+```js
+.use(FdsVueCore)
 ```
 
-## Building for Production
+## How to use
 
-```bash
-npm run build
+```js
+<FdsTreeView />
 ```
-
-This will generate:
-- `dist/fds-vue-core.es.js` - ES module build
-- `dist/fds-vue-core.cjs.js` - CommonJS build
-- `dist/index.d.ts` - TypeScript declarations
-- `dist/style.css` - Styles
-
-## TypeScript
-
-This library is built with TypeScript and provides comprehensive type definitions. All components, props, events, and utilities are fully typed for excellent developer experience.
-
-## License
-
-MIT

package/dist/App.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"App.vue.d.ts","sourceRoot":"","sources":["../src/App.vue"],"names":[],"mappings":";AAwSA,wBACG"}
+{"version":3,"file":"App.vue.d.ts","sourceRoot":"","sources":["../src/App.vue"],"names":[],"mappings":";AAiTA,wBACG"}

package/dist/components/fds-tree-view/FdsTreeView.vue.d.ts

@@ -1,14 +1,19 @@
-import type { TreeNode } from './types';
-import type { FdsTreeViewProps } from '../../types';
-type Props<T = Record<string, unknown>> = FdsTreeViewProps<T>;
+import type { TreeViewProps } from './types.ts';
+type Props<T = Record<string, unknown>> = TreeViewProps<T>;
 type __VLS_Props = Props;
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
-    nodes: TreeNode<Record<string, unknown>>[];
+    nodes: import("./types.ts").TreeNode<Record<string, unknown>>[];
     depth: number;
     showNodeDescription: boolean;
     showChildrenCount: boolean;
     expandChildrenOnSelect: boolean;
     showIndeterminate: boolean;
+    showIndeterminateOnlyOnChildrenSelection: boolean;
+    expandChildrenOnParentCheck: boolean;
+    expandAllChildrenOnParentCheck: boolean;
+    searchEnabled: boolean;
+    searchMatchParams: string[];
+    searchExpandNodes: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;
 //# sourceMappingURL=FdsTreeView.vue.d.ts.map

package/dist/components/fds-tree-view/FdsTreeView.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FdsTreeView.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fds-tree-view/FdsTreeView.vue"],"names":[],"mappings":"AA+MA,OAAO,KAAK,EAAE,QAAQ,EAA+B,MAAM,SAAS,CAAA;AACpE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAEnD,KAAK,KAAK,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI,gBAAgB,CAAC,CAAC,CAAC,CAAA;AAE7D,KAAK,WAAW,GAAG,KAAK,CAAC;;;;;;;;;AAiXzB,wBAGG"}
+{"version":3,"file":"FdsTreeView.vue.d.ts","sourceRoot":"","sources":["../../../src/components/fds-tree-view/FdsTreeView.vue"],"names":[],"mappings":"AAqMA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE/C,KAAK,KAAK,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI,aAAa,CAAC,CAAC,CAAC,CAAA;AAE1D,KAAK,WAAW,GAAG,KAAK,CAAC;;;;;;;;;;;;;;;AA8ZzB,wBAGG"}

package/dist/components/fds-tree-view/types.d.ts

@@ -0,0 +1,73 @@
+/**
+ * Unique identifier for tree nodes
+ */
+export type NodeId = string;
+/**
+ * Represents a single node in the tree structure
+ * @template T - The type of data associated with the node
+ */
+export interface TreeNode<T = Record<string, unknown>> {
+    /** Unique identifier for the node */
+    nodeId: string;
+    /** Display title for the node */
+    title?: string;
+    /** Child nodes of this node */
+    children?: TreeNode<T>[];
+    /** Optional data object associated with the node */
+    data?: T;
+}
+/**
+ * Array of tree nodes
+ */
+export type TreeNodeArray = TreeNode<Record<string, unknown>>[];
+/**
+ * Single tree node item
+ */
+export type TreeNodeItem = TreeNode<Record<string, unknown>>;
+/**
+ * Props for the FdsTreeView component
+ * @template T - The type of data associated with tree nodes
+ */
+export interface TreeViewProps<T = Record<string, unknown>> {
+    /** The tree data structure containing nodes and their children */
+    nodes: TreeNode<T>[];
+    /** The current depth level in the tree (used internally for indentation) */
+    depth?: number;
+    /** Icon name to display when a node is collapsed */
+    nodeExpandIcon: string;
+    /** Icon name to display when a node is expanded */
+    nodeCollapseIcon: string;
+    /** Number of pixels to indent each level of the tree */
+    indentation: number;
+    /** Unique identifier for the current node */
+    nodeId: string;
+    /** Optional data object associated with the node */
+    data?: T;
+    /** Display title for the node */
+    title?: string;
+    /** Whether to show the node description (nodeId) below the title */
+    showNodeDescription?: boolean;
+    /** Whether to show the count of children next to the node title */
+    showChildrenCount?: boolean;
+    /** Whether to expand children when a node is selected */
+    expandChildrenOnSelect?: boolean;
+    /** Whether to show indeterminate state for partially selected nodes */
+    showIndeterminate?: boolean;
+    /** Whether to only show indeterminate when parent is not selected but children are */
+    showIndeterminateOnlyOnChildrenSelection?: boolean;
+    /** Whether to expand children when parent is checked */
+    expandChildrenOnParentCheck?: boolean;
+    /** Whether to expand all children recursively when parent is checked */
+    expandAllChildrenOnParentCheck?: boolean;
+    /** Whether to show search functionality */
+    searchEnabled?: boolean;
+    /** Label for the search input */
+    searchLabel?: string;
+    /** Parameters to match when searching -
+     * Defaults to ['title', 'nodeId']
+     * */
+    searchMatchParams?: string[];
+    /** Whether to expand nodes when searching */
+    searchExpandNodes?: boolean;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/components/fds-tree-view/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/fds-tree-view/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,MAAM,MAAM,GAAG,MAAM,CAAA;AAE3B;;;GAGG;AACH,MAAM,WAAW,QAAQ,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACnD,qCAAqC;IACrC,MAAM,EAAE,MAAM,CAAA;IACd,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAA;IACxB,oDAAoD;IACpD,IAAI,CAAC,EAAE,CAAC,CAAA;CACT;AAED;;GAEG;AACH,MAAM,MAAM,aAAa,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,EAAE,CAAA;AAE/D;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAA;AAE5D;;;GAGG;AACH,MAAM,WAAW,aAAa,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACxD,kEAAkE;IAClE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAA;IACpB,4EAA4E;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oDAAoD;IACpD,cAAc,EAAE,MAAM,CAAA;IACtB,mDAAmD;IACnD,gBAAgB,EAAE,MAAM,CAAA;IACxB,wDAAwD;IACxD,WAAW,EAAE,MAAM,CAAA;IACnB,6CAA6C;IAC7C,MAAM,EAAE,MAAM,CAAA;IACd,oDAAoD;IACpD,IAAI,CAAC,EAAE,CAAC,CAAA;IACR,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,oEAAoE;IACpE,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,mEAAmE;IACnE,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,yDAAyD;IACzD,sBAAsB,CAAC,EAAE,OAAO,CAAA;IAChC,uEAAuE;IACvE,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,sFAAsF;IACtF,wCAAwC,CAAC,EAAE,OAAO,CAAA;IAClD,wDAAwD;IACxD,2BAA2B,CAAC,EAAE,OAAO,CAAA;IACrC,wEAAwE;IACxE,8BAA8B,CAAC,EAAE,OAAO,CAAA;IACxC,2CAA2C;IAC3C,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,iCAAiC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;SAEK;IACL,iBAAiB,CAAC,EAAE,MAAM,EAAE,CAAA;IAC5B,6CAA6C;IAC7C,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B"}

package/dist/components/fds-tree-view/useTreeState.d.ts

@@ -1,18 +1,35 @@
-import type { TreeNode, NodeId } from './types';
-declare const useTreeState: () => {
+import type { TreeNode, NodeId, TreeNodeArray, TreeNodeItem } from './types';
+interface TreeStateOptions {
+    expandChildrenOnParentCheck?: boolean;
+    expandAllChildrenOnParentCheck?: boolean;
+    showIndeterminateOnlyOnChildrenSelection?: boolean;
+}
+declare const useTreeState: (options?: TreeStateOptions) => {
     selectedNodes: import("vue").Reactive<Set<string>>;
     selectedNodeObjects: import("vue").Reactive<TreeNode<Record<string, unknown>>[]>;
     expandedNodes: import("vue").Reactive<Set<string>>;
-    clearSelection: () => void;
-    clearExpanded: () => void;
-    isSelected: (nodeId: NodeId) => boolean;
-    isExpanded: (nodeId: NodeId) => boolean;
-    select: (nodeObject: TreeNode) => void;
+    searchTerm: import("vue").Ref<string, string>;
+    clearAllSelectedNodes: () => void;
+    collapseAllExpandedNodes: () => void;
+    isNodeSelected: (nodeId: NodeId) => boolean;
+    isNodeExpanded: (nodeId: NodeId) => boolean;
+    injectNode: (nodeObject: TreeNode) => void;
     selectAllChildren: (node: TreeNode) => void;
-    deselect: (nodeId: NodeId) => void;
+    deselectNode: (nodeId: NodeId) => void;
     deselectAllChildren: (node: TreeNode) => void;
-    expand: (nodeId: NodeId) => import("vue").Reactive<Set<string>>;
-    collapse: (nodeId: NodeId) => boolean;
+    expandNode: (nodeId: NodeId) => import("vue").Reactive<Set<string>>;
+    collapseNode: (nodeId: NodeId) => boolean;
+    expandAllChildren: (node: TreeNode) => void;
+    findNodeById: (nodes: TreeNodeArray, nodeId: string) => TreeNodeItem | null;
+    hasChildrenNodes: (nodes: TreeNodeArray) => boolean;
+    isNodeIndeterminate: (nodes: TreeNodeArray, parentNodeId?: string) => boolean;
+    toggleSelectNode: (nodes: TreeNodeArray, nodeId: string, title?: string, data?: Record<string, unknown>) => void;
+    toggleExpandNode: (nodeId: NodeId, nodes: TreeNodeArray) => void;
+    getNodeIcon: (nodeId: NodeId, nodes: TreeNodeArray, expandIcon: string, collapseIcon: string) => string;
+    nodeMatchesSearch: (node: TreeNode, term: string, searchParams?: string[]) => boolean;
+    filterNodes: (nodes: TreeNodeArray, term: string, searchParams?: string[]) => TreeNodeArray;
+    setSearchTerm: (term: string) => void;
+    clearSearch: () => void;
 };
 export default useTreeState;
 //# sourceMappingURL=useTreeState.d.ts.map

package/dist/components/fds-tree-view/useTreeState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTreeState.d.ts","sourceRoot":"","sources":["../../../src/components/fds-tree-view/useTreeState.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,SAAS,CAAA;AAE/C,QAAA,MAAM,YAAY;;;;;;yBAWY,MAAM;yBACN,MAAM;yBAEN,QAAQ;8BAKH,QAAQ;uBAaf,MAAM;gCAQG,QAAQ;qBAUnB,MAAM;uBACJ,MAAM;CAiBjC,CAAA;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"useTreeState.d.ts","sourceRoot":"","sources":["../../../src/components/fds-tree-view/useTreeState.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAE5E,UAAU,gBAAgB;IACxB,2BAA2B,CAAC,EAAE,OAAO,CAAA;IACrC,8BAA8B,CAAC,EAAE,OAAO,CAAA;IACxC,wCAAwC,CAAC,EAAE,OAAO,CAAA;CACnD;AAED,QAAA,MAAM,YAAY,GAAI,UAAS,gBAAqB;;;;;;;6BAkClB,MAAM;6BAKN,MAAM;6BAgBN,QAAQ;8BAkBP,QAAQ;2BAsBX,MAAM;gCAYD,QAAQ;yBA/Df,MAAM;2BAKJ,MAAM;8BAcH,QAAQ;0BAyDZ,aAAa,UAAU,MAAM,KAAG,YAAY,GAAG,IAAI;8BAgB/C,aAAa;iCAKV,aAAa,iBAAiB,MAAM,KAAG,OAAO;8BAuCzE,aAAa,UACZ,MAAM,UACN,MAAM,SACP,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;+BAiCE,MAAM,SAAS,aAAa;0BAapD,MAAM,SACP,aAAa,cACR,MAAM,gBACJ,MAAM;8BAQW,QAAQ,QAAQ,MAAM,iBAAiB,MAAM,EAAE,KAAG,OAAO;yBAwBjF,aAAa,QACd,MAAM,iBACG,MAAM,EAAE,KACtB,aAAa;0BAwBa,MAAM;;CAsCpC,CAAA;AAED,eAAe,YAAY,CAAA"}