@iris-ui-kit/vue 0.2.0 → 0.2.2

package/dist/index.d.cts

@@ -4248,7 +4248,8 @@ type IrisTableColumnWidths = Record<string, number>;
  * are wired explicitly for screen readers.
  *
  * **Features**:
- *   - Column-driven rendering with optional `#cell.<key>` slots
+ *   - Column-driven rendering with optional `#header.<key>` and `#cell.<key>` slots
+ *   - Row activation via `rowClick` and `rowDblclick` events
  *   - Sorting (controlled or uncontrolled, cycles `none → asc → desc → none`)
  *   - Row selection (single / multi) with master checkbox + indeterminate
  *   - **Column resize** (`resizable-columns`) — draggable handle on each
@@ -4397,6 +4398,7 @@ declare const IrisTable: vue.DefineComponent<vue.ExtractPropTypes<{
     'update:sort': (_value: IrisTableSortState | null) => true;
     'update:columnWidths': (_value: IrisTableColumnWidths) => true;
     rowClick: (_row: Record<string, unknown>, _index: number) => true;
+    rowDblclick: (_row: Record<string, unknown>, _index: number) => true;
     cellEdit: (_payload: IrisTableCellEditEvent<Record<string, unknown>>) => true;
     expandedRowsChange: (_keys: Array<string | number>) => true;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
@@ -4530,6 +4532,7 @@ declare const IrisTable: vue.DefineComponent<vue.ExtractPropTypes<{
     onCellEdit?: ((_payload: IrisTableCellEditEvent<Record<string, unknown>>) => any) | undefined;
     "onUpdate:columnWidths"?: ((_value: IrisTableColumnWidths) => any) | undefined;
     onRowClick?: ((_row: Record<string, unknown>, _index: number) => any) | undefined;
+    onRowDblclick?: ((_row: Record<string, unknown>, _index: number) => any) | undefined;
 }>, {
     sort: IrisTableSortState | null;
     error: boolean;

package/dist/index.d.ts

@@ -4248,7 +4248,8 @@ type IrisTableColumnWidths = Record<string, number>;
  * are wired explicitly for screen readers.
  *
  * **Features**:
- *   - Column-driven rendering with optional `#cell.<key>` slots
+ *   - Column-driven rendering with optional `#header.<key>` and `#cell.<key>` slots
+ *   - Row activation via `rowClick` and `rowDblclick` events
  *   - Sorting (controlled or uncontrolled, cycles `none → asc → desc → none`)
  *   - Row selection (single / multi) with master checkbox + indeterminate
  *   - **Column resize** (`resizable-columns`) — draggable handle on each
@@ -4397,6 +4398,7 @@ declare const IrisTable: vue.DefineComponent<vue.ExtractPropTypes<{
     'update:sort': (_value: IrisTableSortState | null) => true;
     'update:columnWidths': (_value: IrisTableColumnWidths) => true;
     rowClick: (_row: Record<string, unknown>, _index: number) => true;
+    rowDblclick: (_row: Record<string, unknown>, _index: number) => true;
     cellEdit: (_payload: IrisTableCellEditEvent<Record<string, unknown>>) => true;
     expandedRowsChange: (_keys: Array<string | number>) => true;
 }, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
@@ -4530,6 +4532,7 @@ declare const IrisTable: vue.DefineComponent<vue.ExtractPropTypes<{
     onCellEdit?: ((_payload: IrisTableCellEditEvent<Record<string, unknown>>) => any) | undefined;
     "onUpdate:columnWidths"?: ((_value: IrisTableColumnWidths) => any) | undefined;
     onRowClick?: ((_row: Record<string, unknown>, _index: number) => any) | undefined;
+    onRowDblclick?: ((_row: Record<string, unknown>, _index: number) => any) | undefined;
 }>, {
     sort: IrisTableSortState | null;
     error: boolean;

package/dist/index.js

@@ -228,39 +228,37 @@ var IrisPopoverContent = defineComponent({
         target?.focus();
       }
     });
-    const contentVNode = computed(
-      () => h(
-        "div",
-        {
-          ...attrs,
-          ref: (el) => {
-            innerRef.value = el ?? null;
-          },
-          id: ctx.contentId,
-          role: "dialog",
-          tabindex: -1,
-          "data-state": ctx.open.value ? "open" : "closed",
-          "data-placement": ctx.placement,
-          style: {
-            ...floatingStyles.value,
-            background: "var(--iris-surface)",
-            color: "var(--iris-foreground)",
-            border: "1px solid var(--iris-border)",
-            borderRadius: "var(--iris-radius-md)",
-            padding: "var(--iris-padding-md)",
-            boxShadow: "0 8px 24px -8px rgba(0, 0, 0, 0.16), 0 4px 8px -2px rgba(0, 0, 0, 0.08)",
-            fontSize: "14px",
-            zIndex: "1000",
-            outline: "none",
-            ...attrs.style ?? {}
-          }
+    const renderContent = () => h(
+      "div",
+      {
+        ...attrs,
+        ref: (el) => {
+          innerRef.value = el ?? null;
         },
-        slots.default?.()
-      )
+        id: ctx.contentId,
+        role: "dialog",
+        tabindex: -1,
+        "data-state": ctx.open.value ? "open" : "closed",
+        "data-placement": ctx.placement,
+        style: {
+          ...floatingStyles.value,
+          background: "var(--iris-surface)",
+          color: "var(--iris-foreground)",
+          border: "1px solid var(--iris-border)",
+          borderRadius: "var(--iris-radius-md)",
+          padding: "var(--iris-padding-md)",
+          boxShadow: "0 8px 24px -8px rgba(0, 0, 0, 0.16), 0 4px 8px -2px rgba(0, 0, 0, 0.08)",
+          fontSize: "14px",
+          zIndex: "1000",
+          outline: "none",
+          ...attrs.style ?? {}
+        }
+      },
+      slots.default?.()
     );
     return () => {
       if (!ctx.open.value) return null;
-      const node = contentVNode.value;
+      const node = renderContent();
       if (props.teleport === false) return node;
       return h(Teleport, { to: props.teleport }, [node]);
     };
@@ -5425,6 +5423,7 @@ var IrisTable = defineComponent({
     "update:sort": (_value) => true,
     "update:columnWidths": (_value) => true,
     rowClick: (_row, _index) => true,
+    rowDblclick: (_row, _index) => true,
     cellEdit: (_payload) => true,
     expandedRowsChange: (_keys) => true
   },
@@ -5831,6 +5830,8 @@ var IrisTable = defineComponent({
             const isLeaf = !col.children || col.children.length === 0;
             const sortable = isLeaf && col.sortable;
             const align = col.align ?? "left";
+            const headerSlot = slots[`header.${col.key}`];
+            const title = headerSlot?.({ column: col }) ?? col.title;
             cells.push(
               h(
                 "div",
@@ -5861,7 +5862,7 @@ var IrisTable = defineComponent({
                     textOverflow: "ellipsis"
                   }
                 },
-                [col.title, sortable ? sortIndicator(col) : null]
+                [title, sortable ? sortIndicator(col) : null]
               )
             );
           }
@@ -5931,6 +5932,8 @@ var IrisTable = defineComponent({
         const col = props.columns[ci];
         if (visibleColSet.value && !visibleColSet.value.has(ci)) continue;
         const align = col.align ?? "left";
+        const headerSlot = slots[`header.${col.key}`];
+        const title = headerSlot?.({ column: col }) ?? col.title;
         wireResize(col);
         const handle = props.resizableColumns ? h("span", {
           ref: (el) => {
@@ -5998,7 +6001,7 @@ var IrisTable = defineComponent({
               },
               "aria-sort": internalSort.value?.key === col.key ? internalSort.value.direction === "asc" ? "ascending" : "descending" : col.sortable ? "none" : void 0
             },
-            [col.title, sortIndicator(col), handle]
+            [title, sortIndicator(col), handle]
           )
         );
       }
@@ -6274,6 +6277,7 @@ var IrisTable = defineComponent({
             "data-iris-table-row": "",
             "data-state": selected ? "selected" : void 0,
             onClick: () => emit("rowClick", row, index),
+            onDblclick: () => emit("rowDblclick", row, index),
             style: {
               display: "grid",
               gridTemplateColumns: gridTemplate.value,