@iris-ui-kit/vue 0.2.6 → 0.2.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -4359,6 +4359,16 @@ declare const IrisTable: vue.DefineComponent<vue.ExtractPropTypes<{
4359
4359
  type: PropType<(row: Record<string, unknown>) => Array<Record<string, unknown>> | undefined>;
4360
4360
  default: undefined;
4361
4361
  };
4362
+ /**
4363
+ * Cascade multi-row selection through the complete tree supplied by
4364
+ * `getSubRows`. Selecting a branch selects every descendant (including
4365
+ * collapsed rows); partially selected branches render indeterminate.
4366
+ * Ignored outside tree mode and for non-multi selection.
4367
+ */
4368
+ treeSelectionCascade: {
4369
+ type: BooleanConstructor;
4370
+ default: boolean;
4371
+ };
4362
4372
  selectable: {
4363
4373
  type: PropType<"none" | "single" | "multi">;
4364
4374
  default: string;
@@ -4493,6 +4503,16 @@ declare const IrisTable: vue.DefineComponent<vue.ExtractPropTypes<{
4493
4503
  type: PropType<(row: Record<string, unknown>) => Array<Record<string, unknown>> | undefined>;
4494
4504
  default: undefined;
4495
4505
  };
4506
+ /**
4507
+ * Cascade multi-row selection through the complete tree supplied by
4508
+ * `getSubRows`. Selecting a branch selects every descendant (including
4509
+ * collapsed rows); partially selected branches render indeterminate.
4510
+ * Ignored outside tree mode and for non-multi selection.
4511
+ */
4512
+ treeSelectionCascade: {
4513
+ type: BooleanConstructor;
4514
+ default: boolean;
4515
+ };
4496
4516
  selectable: {
4497
4517
  type: PropType<"none" | "single" | "multi">;
4498
4518
  default: string;
@@ -4550,6 +4570,7 @@ declare const IrisTable: vue.DefineComponent<vue.ExtractPropTypes<{
4550
4570
  rowExpandable: IrisTableRowExpandable<Record<string, unknown>>;
4551
4571
  defaultExpandedRowKeys: (string | number)[];
4552
4572
  getSubRows: (row: Record<string, unknown>) => Array<Record<string, unknown>> | undefined;
4573
+ treeSelectionCascade: boolean;
4553
4574
  selectable: "none" | "single" | "multi";
4554
4575
  selection: (string | number)[];
4555
4576
  defaultSelection: (string | number)[];
package/dist/index.d.ts CHANGED
@@ -4359,6 +4359,16 @@ declare const IrisTable: vue.DefineComponent<vue.ExtractPropTypes<{
4359
4359
  type: PropType<(row: Record<string, unknown>) => Array<Record<string, unknown>> | undefined>;
4360
4360
  default: undefined;
4361
4361
  };
4362
+ /**
4363
+ * Cascade multi-row selection through the complete tree supplied by
4364
+ * `getSubRows`. Selecting a branch selects every descendant (including
4365
+ * collapsed rows); partially selected branches render indeterminate.
4366
+ * Ignored outside tree mode and for non-multi selection.
4367
+ */
4368
+ treeSelectionCascade: {
4369
+ type: BooleanConstructor;
4370
+ default: boolean;
4371
+ };
4362
4372
  selectable: {
4363
4373
  type: PropType<"none" | "single" | "multi">;
4364
4374
  default: string;
@@ -4493,6 +4503,16 @@ declare const IrisTable: vue.DefineComponent<vue.ExtractPropTypes<{
4493
4503
  type: PropType<(row: Record<string, unknown>) => Array<Record<string, unknown>> | undefined>;
4494
4504
  default: undefined;
4495
4505
  };
4506
+ /**
4507
+ * Cascade multi-row selection through the complete tree supplied by
4508
+ * `getSubRows`. Selecting a branch selects every descendant (including
4509
+ * collapsed rows); partially selected branches render indeterminate.
4510
+ * Ignored outside tree mode and for non-multi selection.
4511
+ */
4512
+ treeSelectionCascade: {
4513
+ type: BooleanConstructor;
4514
+ default: boolean;
4515
+ };
4496
4516
  selectable: {
4497
4517
  type: PropType<"none" | "single" | "multi">;
4498
4518
  default: string;
@@ -4550,6 +4570,7 @@ declare const IrisTable: vue.DefineComponent<vue.ExtractPropTypes<{
4550
4570
  rowExpandable: IrisTableRowExpandable<Record<string, unknown>>;
4551
4571
  defaultExpandedRowKeys: (string | number)[];
4552
4572
  getSubRows: (row: Record<string, unknown>) => Array<Record<string, unknown>> | undefined;
4573
+ treeSelectionCascade: boolean;
4553
4574
  selectable: "none" | "single" | "multi";
4554
4575
  selection: (string | number)[];
4555
4576
  defaultSelection: (string | number)[];
package/dist/index.js CHANGED
@@ -12,7 +12,7 @@ import { IrisCheckbox } from './chunk-QLUIKEMJ.js';
12
12
  export { IrisAlert, IrisButton, IrisCheckbox, IrisDashboardTemplate, IrisDivider, IrisFormField, IrisInput, IrisLoginTemplate, IrisPasswordInput } from './chunk-QLUIKEMJ.js';
13
13
  export { IrisContainer, IrisDashboardCard, IrisDashboardGrid, IrisStack } from './chunk-3R3QDLJC.js';
14
14
  export { IrisSkinKey, SkinProvider, SkinResolutionError, applySkin, builtinSkins, createSkinCatalog, createSkinEngine, createSkinRegistry, darkSkin, lightSkin, loadSkin, localStorageSkinStorage, memorySkinStorage, renderSkinStyle, resolveSkin, skinBootScript, skinError, skinToCssEntries, useSkin, useSkinContext, validateSkin } from './chunk-H7HVVPYR.js';
15
- export { DropdownContextKey, IrisAdminBreadcrumb, IrisAdminLayout, IrisAdminTabs, IrisBreadcrumb, IrisBreadcrumbItem, IrisDropdown, IrisDropdownItem, IrisDropdownMenu, IrisDropdownSeparator, IrisDropdownTrigger, IrisIcon, IrisNavMenu, createAdminPreferences, createTabsNav, filterNavByAccess, findNavNode, findNavPath, firstLeaf, flattenNav, isBranch, isClosable, localStorageAdminPreferencesStorage, nodeAllowsRoles, useAdminPreferences, useAdminShell, useTabsNav, visibleNav } from './chunk-NI5QJ6SZ.js';
15
+ export { DropdownContextKey, IrisAdminBreadcrumb, IrisAdminLayout, IrisAdminTabs, IrisBreadcrumb, IrisBreadcrumbItem, IrisDropdown, IrisDropdownItem, IrisDropdownMenu, IrisDropdownSeparator, IrisDropdownTrigger, IrisIcon, IrisNavMenu, createAdminPreferences, createTabsNav, filterNavByAccess, findNavNode, findNavPath, firstLeaf, flattenNav, isBranch, isClosable, localStorageAdminPreferencesStorage, nodeAllowsRoles, useAdminPreferences, useAdminShell, useTabsNav, visibleNav } from './chunk-PX6PTIWU.js';
16
16
  import { useFloating, useDismiss } from './chunk-3FJUCHCC.js';
17
17
  export { useDismiss, useFloating } from './chunk-3FJUCHCC.js';
18
18
  import { useMachine } from './chunk-TQB5LVOH.js';
@@ -33,7 +33,7 @@ export { FormInjectionKey, IrisForm, useField, useFieldArray, useForm, useFormCo
33
33
  import { useI18n } from './chunk-TCAXRWT6.js';
34
34
  export { I18nInjectionKey, IrisI18nProvider, useI18n } from './chunk-TCAXRWT6.js';
35
35
  import { defineComponent, computed, watch, ref, useId, provide, inject, h, nextTick, Teleport, onScopeDispose, Fragment, onMounted, onBeforeUnmount, onBeforeMount, shallowRef, toValue, Comment, onUnmounted } from 'vue';
36
- import { createFloatingMachine, createHoverIntent, createKeyboardNav, getPageRange, createSelectionModel, flattenLeafColumns, buildHeaderMatrix, createExpansion, flattenTree, withSortedChildren, createCellRange, computeVirtualRange, aggregate, createStore, createTreeSelection, firstEnabledIndex, startOfMonth, clampDate, isSameMonth, buildMonthMatrix, getWeekdayNames, formatMonthYear, startOfDay, endOfMonth, isSameDay, isOutOfRange, formatLocalISO, hexToRgba, rgbaToHsva, hsvaToRgba, rgbToHex, addMonths, createVirtualizer, compareValues, nextGridCell, nextEnabledIndex, copyText, addDays, clamp01, createAutoDismiss, createReconnectingSource, createResilientFetcher, createDisposableScope, toCsv, downloadFile, toSpreadsheetXml, generateId } from '@iris-ui-kit/core';
36
+ import { createFloatingMachine, createHoverIntent, createKeyboardNav, getPageRange, createSelectionModel, flattenLeafColumns, buildHeaderMatrix, createExpansion, flattenTree, withSortedChildren, createTreeSelection, createCellRange, computeVirtualRange, aggregate, createStore, firstEnabledIndex, startOfMonth, clampDate, isSameMonth, buildMonthMatrix, getWeekdayNames, formatMonthYear, startOfDay, endOfMonth, isSameDay, isOutOfRange, formatLocalISO, hexToRgba, rgbaToHsva, hsvaToRgba, rgbToHex, addMonths, createVirtualizer, compareValues, nextGridCell, nextEnabledIndex, copyText, addDays, clamp01, createAutoDismiss, createReconnectingSource, createResilientFetcher, createDisposableScope, toCsv, downloadFile, toSpreadsheetXml, generateId } from '@iris-ui-kit/core';
37
37
  export { addDays, addMonths, buildMonthMatrix, clamp01, clampDate, composeEventHandlers, createFloatingMachine, createMachine, createStore, endOfMonth, formatLocalISO, formatMonthYear, generateId, getPageRange, getWeekdayNames, hexToRgba, hsvToRgb, hsvaToRgba, isOutOfRange, isSameDay, isSameMonth, mergeProps, rgbToHex, rgbToHsv, rgbaToHsva, startOfDay, startOfMonth } from '@iris-ui-kit/core';
38
38
  import { getDirection } from '@iris-ui-kit/theme';
39
39
  export { applyTheme, createThemeStore, getCssVar, toCssVarName } from '@iris-ui-kit/theme';
@@ -5422,7 +5422,14 @@ var IrisTable = defineComponent({
5422
5422
  getSubRows: {
5423
5423
  type: Function,
5424
5424
  default: void 0
5425
- }
5425
+ },
5426
+ /**
5427
+ * Cascade multi-row selection through the complete tree supplied by
5428
+ * `getSubRows`. Selecting a branch selects every descendant (including
5429
+ * collapsed rows); partially selected branches render indeterminate.
5430
+ * Ignored outside tree mode and for non-multi selection.
5431
+ */
5432
+ treeSelectionCascade: { type: Boolean, default: false }
5426
5433
  },
5427
5434
  emits: {
5428
5435
  "update:selection": (_value) => true,
@@ -5508,27 +5515,75 @@ var IrisTable = defineComponent({
5508
5515
  const bodyData = computed(
5509
5516
  () => flatTree.value ? flatTree.value.map((t2) => t2.row) : sortedRows.value
5510
5517
  );
5511
- const isSelected = (id) => displaySelection.value.includes(id);
5512
- const allRowIds = computed(() => bodyData.value.map((r, i) => rowId(r, i)));
5518
+ const cascadingTreeSelection = computed(
5519
+ () => props.treeSelectionCascade && props.selectable === "multi" && treeMode.value
5520
+ );
5521
+ const treeSelectionNodes = computed(() => {
5522
+ const getChildren = props.getSubRows;
5523
+ if (!cascadingTreeSelection.value || !getChildren) return [];
5524
+ const nodes = [];
5525
+ const seen = /* @__PURE__ */ new Set();
5526
+ let rowIndex = 0;
5527
+ const walk = (rows, parentKey) => {
5528
+ for (const row of rows) {
5529
+ const key = rowId(row, rowIndex);
5530
+ rowIndex += 1;
5531
+ if (seen.has(key)) continue;
5532
+ seen.add(key);
5533
+ nodes.push({ key, parentKey });
5534
+ const children = getChildren(row);
5535
+ if (children && children.length > 0) walk(children, key);
5536
+ }
5537
+ };
5538
+ walk(sortedRows.value);
5539
+ return nodes;
5540
+ });
5541
+ const resolvedTreeSelection = computed(
5542
+ () => cascadingTreeSelection.value ? createTreeSelection({
5543
+ nodes: treeSelectionNodes.value,
5544
+ defaultChecked: displaySelection.value
5545
+ }) : null
5546
+ );
5547
+ const isSelected = (id) => resolvedTreeSelection.value?.isChecked(id) ?? displaySelection.value.includes(id);
5548
+ const isSelectionIndeterminate = (id) => resolvedTreeSelection.value?.isIndeterminate(id) ?? false;
5549
+ const allRowIds = computed(
5550
+ () => cascadingTreeSelection.value ? treeSelectionNodes.value.map((node) => node.key) : bodyData.value.map((row, index) => rowId(row, index))
5551
+ );
5513
5552
  const allSelected = computed(() => {
5514
- const sel = displaySelection.value;
5515
- return allRowIds.value.length > 0 && allRowIds.value.every((id) => sel.includes(id));
5553
+ return allRowIds.value.length > 0 && allRowIds.value.every((id) => isSelected(id));
5516
5554
  });
5517
5555
  const someSelected = computed(() => {
5518
- const sel = displaySelection.value;
5519
- return !allSelected.value && allRowIds.value.some((id) => sel.includes(id));
5556
+ return !allSelected.value && allRowIds.value.some((id) => isSelected(id) || isSelectionIndeterminate(id));
5520
5557
  });
5521
5558
  const toggleRow = (id) => {
5522
5559
  rebaseToProp();
5523
5560
  if (props.selectable === "single") {
5524
5561
  selectionModel.set(selectionModel.isSelected(id) ? [] : [id]);
5525
5562
  } else if (props.selectable === "multi") {
5526
- selectionModel.toggle(id);
5563
+ const treeSelection = resolvedTreeSelection.value;
5564
+ if (treeSelection) {
5565
+ treeSelection.toggle(id);
5566
+ selectionModel.set(treeSelection.getChecked());
5567
+ } else {
5568
+ selectionModel.toggle(id);
5569
+ }
5527
5570
  }
5528
5571
  };
5529
5572
  const toggleAll = () => {
5530
5573
  rebaseToProp();
5531
- selectionModel.set(allSelected.value ? [] : [...allRowIds.value]);
5574
+ if (allSelected.value) {
5575
+ selectionModel.set([]);
5576
+ return;
5577
+ }
5578
+ if (cascadingTreeSelection.value) {
5579
+ const treeSelection = createTreeSelection({
5580
+ nodes: treeSelectionNodes.value,
5581
+ defaultChecked: allRowIds.value
5582
+ });
5583
+ selectionModel.set(treeSelection.getChecked());
5584
+ return;
5585
+ }
5586
+ selectionModel.set([...allRowIds.value]);
5532
5587
  };
5533
5588
  const editingCellId = ref(null);
5534
5589
  const editingDraft = ref("");
@@ -6090,7 +6145,7 @@ var IrisTable = defineComponent({
6090
6145
  },
6091
6146
  [
6092
6147
  h(IrisCheckbox, {
6093
- modelValue: selected,
6148
+ modelValue: isSelectionIndeterminate(id) ? "indeterminate" : selected,
6094
6149
  size: "sm",
6095
6150
  ariaLabel: t("table.selectRow", { key: id }),
6096
6151
  "onUpdate:modelValue": () => toggleRow(id),