@multiplatform.one/table 6.0.0

package/dist/cjs/components/DataTableToolbar/DataTableToolbar.stories.native.js

@@ -0,0 +1,56 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var DataTableToolbar_stories_exports = {};
+__export(DataTableToolbar_stories_exports, {
+  Default: () => Default,
+  default: () => DataTableToolbar_stories_default
+});
+module.exports = __toCommonJS(DataTableToolbar_stories_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_tamagui = require("tamagui");
+var meta = {
+  title: "Table/DataTableToolbar",
+  parameters: {
+    status: {
+      type: "stable"
+    }
+  }
+};
+var DataTableToolbar_stories_default = meta;
+var Default = {
+  name: "Main",
+  render: function render() {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+      padding: "$4",
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+        fontSize: "$2",
+        color: "$color10",
+        marginBottom: "$2",
+        children: "The DataTableToolbar integrates with DataTable to provide search, filters, and view options. See DataTable stories for full integration examples."
+      })
+    });
+  }
+};
+//# sourceMappingURL=DataTableToolbar.stories.native.js.map

package/dist/cjs/components/DataTableToolbar/DataTableToolbar.stories.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","DataTableToolbar_stories_exports","__export","Default","default","DataTableToolbar_stories_default","module","exports","import_jsx_runtime","require","import_tamagui","meta","title","parameters","status","type"],"sources":["../../../../src/components/DataTableToolbar/DataTableToolbar.stories.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,gCAAA;AAAAC,QAAA,CAAAD,gCAAA;EAAAE,OAAA,EAAAA,CAAA,KAAAA,OAAA;EAAAC,OAAA,EAAAA,CAAA,KAAAC;AAAA;AACAC,MAAA,CAAAC,OAAA,GAAAX,YAA6B,CAAAK,gCAAA;AAevB,IAAAO,kBAAA,GAAAC,OAAA;AAbN,IAAAC,cAAmB,GAAAD,OAAA;AAAA,IACjBE,IAAA,GAAO;EACPC,KAAA,0BAAY;EAAAC,UACF,EAAE;IACZC,MAAA;MACFC,IAAA;IAEO;EAEA;AAAgB;AACf,IACNV,gCACE,GAAAM,IAAA;AAOJ,IAAAR,OAAA","ignoreList":[]}

package/dist/cjs/components/DataTableToolbar/index.cjs

@@ -0,0 +1,249 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var DataTableToolbar_exports = {};
+__export(DataTableToolbar_exports, {
+  DataTableToolbar: () => DataTableToolbar,
+  DataTableToolbarActions: () => DataTableToolbarActions,
+  DataTableToolbarSeparator: () => DataTableToolbarSeparator
+});
+module.exports = __toCommonJS(DataTableToolbar_exports);
+var import_react = require("@phosphor-icons/react");
+var import_theme = require("@multiplatform.one/theme");
+var import_roving_focus = require("@tamagui/roving-focus");
+var import_react2 = require("react");
+var import_forms = require("@multiplatform.one/forms");
+var import_tamagui = require("tamagui");
+var import_DataTableStateContext = require("../DataTable/DataTableStateContext.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+const SearchIconWrapperFrame = (0, import_tamagui.styled)(import_tamagui.View, {
+  name: "DataTableSearchIconFrame",
+  paddingLeft: "$3",
+  alignItems: "center",
+  justifyContent: "center"
+});
+const ClearButtonWrapperFrame = (0, import_tamagui.styled)(import_tamagui.View, {
+  name: "DataTableClearButtonFrame",
+  paddingRight: "$2",
+  alignItems: "center",
+  justifyContent: "center"
+});
+const ToolbarDividerFrame = (0, import_tamagui.styled)(import_tamagui.View, {
+  name: "DataTableToolbarDividerFrame",
+  width: 1,
+  alignSelf: "stretch",
+  backgroundColor: "$color6"
+});
+function DataTableToolbar(props) {
+  const ctx = (0, import_DataTableStateContext.useDataTableState)();
+  const globalFilter = props.globalFilter ?? ctx?.state.globalFilter ?? "";
+  const onGlobalFilterChange = props.onGlobalFilterChange ?? ctx?.actions.setGlobalFilter ?? (() => {});
+  const onClearFilters = props.onClearFilters ?? ctx?.actions.clearFilters ?? (() => {});
+  const onSaveView = props.onSaveView ?? ctx?.actions.saveView ?? (() => {});
+  const views = props.views ?? ctx?.state.views ?? [];
+  const activeViewId = props.activeViewId ?? ctx?.state.activeViewId;
+  const {
+    enableViews = false,
+    enableGlobalSearch = true,
+    enableFiltering: _enableFiltering = true,
+    showFilterCount: _showFilterCount = true,
+    showViewSelector = true,
+    customActions,
+    size,
+    compact: _compact = true
+  } = props;
+  const [showSaveViewDialog, setShowSaveViewDialog] = (0, import_react2.useState)(false);
+  const [newViewName, setNewViewName] = (0, import_react2.useState)("");
+  const activeView = views.find(v => v.id === activeViewId);
+  const handleSaveView = () => {
+    if (newViewName.trim()) {
+      onSaveView(newViewName.trim());
+      setNewViewName("");
+      setShowSaveViewDialog(false);
+    }
+  };
+  const {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)({
+    size,
+    compact: true
+  });
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+    alignItems: "stretch",
+    backgroundColor: "$color3",
+    borderWidth: 1,
+    borderBottomWidth: 0,
+    borderColor: "$color6",
+    borderTopLeftRadius: knobProps.borderRadius.borderRadius,
+    borderTopRightRadius: knobProps.borderRadius.borderRadius,
+    overflow: "hidden",
+    role: "toolbar",
+    "aria-label": "Table toolbar",
+    children: [enableGlobalSearch && /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+      flex: 1,
+      alignItems: "center",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(SearchIconWrapperFrame, {
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.MagnifyingGlassIcon, {
+          size: 16
+        })
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+        flex: 1,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Input, {
+          value: globalFilter,
+          onChangeText: onGlobalFilterChange,
+          placeholder: "Search...",
+          "aria-label": "Search table data",
+          chromeless: true,
+          compact: true,
+          size: "$3"
+        })
+      }), globalFilter && /* @__PURE__ */(0, import_jsx_runtime.jsx)(ClearButtonWrapperFrame, {
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+          chromeless: true,
+          circular: true,
+          size: "$2",
+          padding: "$1",
+          onPress: () => {
+            onGlobalFilterChange("");
+            onClearFilters();
+          },
+          icon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.XIcon, {
+            size: 14
+          }),
+          "aria-label": "Clear search"
+        })
+      })]
+    }), (customActions || enableViews) && /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(ToolbarDividerFrame, {}), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_roving_focus.RovingFocusGroup, {
+        orientation: "horizontal",
+        loop: true,
+        asChild: true,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+          alignItems: "center",
+          paddingHorizontal: "$2",
+          gap: "$1",
+          children: [customActions, enableViews && showViewSelector && /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+            children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_roving_focus.RovingFocusGroup.Item, {
+              focusable: true,
+              asChild: true,
+              children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.Popover, {
+                open: showSaveViewDialog,
+                onOpenChange: setShowSaveViewDialog,
+                children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Popover.Trigger, {
+                  asChild: true,
+                  children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+                    chromeless: true,
+                    size: "$2",
+                    icon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.FloppyDiskIcon, {
+                      size: 16
+                    }),
+                    "aria-label": "Save view",
+                    focusStyle: {
+                      outlineColor: "$accentBackground",
+                      outlineWidth: 2
+                    }
+                  })
+                }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Popover.Content, {
+                  ...knobProps.borderRadius,
+                  borderColor: "$color6",
+                  enterStyle: {
+                    x: 0,
+                    y: -10,
+                    opacity: 0
+                  },
+                  exitStyle: {
+                    x: 0,
+                    y: -10,
+                    opacity: 0
+                  },
+                  children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+                    ...knobProps.gap,
+                    ...knobProps.panelPadding,
+                    minWidth: 250,
+                    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+                      fontWeight: "600",
+                      children: "Save Current View"
+                    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Input, {
+                      placeholder: "Enter view name...",
+                      value: newViewName,
+                      onChangeText: setNewViewName,
+                      size: "$3",
+                      compact: true,
+                      inputProps: {
+                        onKeyDown: e => {
+                          if (e.key === "Enter") handleSaveView();
+                        }
+                      }
+                    }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+                      gap: "$2",
+                      justifyContent: "flex-end",
+                      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+                        size: "$2",
+                        variant: "outlined",
+                        onPress: () => setShowSaveViewDialog(false),
+                        children: "Cancel"
+                      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+                        size: "$2",
+                        onPress: handleSaveView,
+                        disabled: !newViewName.trim(),
+                        children: "Save"
+                      })]
+                    })]
+                  })
+                })]
+              })
+            }), activeView && /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+              alignItems: "center",
+              gap: "$1",
+              paddingHorizontal: "$2",
+              children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EyeIcon, {
+                size: 14
+              }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+                fontSize: "$2",
+                color: "$color10",
+                children: activeView.name
+              })]
+            })]
+          })]
+        })
+      })]
+    })]
+  });
+}
+function DataTableToolbarActions({
+  children
+}) {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.XStack, {
+    alignItems: "center",
+    gap: "$1",
+    children
+  });
+}
+function DataTableToolbarSeparator({
+  orientation = "vertical"
+}) {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Separator, {
+    vertical: orientation === "vertical",
+    marginHorizontal: orientation === "vertical" ? "$1" : 0,
+    marginVertical: orientation === "horizontal" ? "$1" : 0
+  });
+}

package/dist/cjs/components/DataTableToolbar/index.native.js

@@ -0,0 +1,265 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var DataTableToolbar_exports = {};
+__export(DataTableToolbar_exports, {
+  DataTableToolbar: () => DataTableToolbar,
+  DataTableToolbarActions: () => DataTableToolbarActions,
+  DataTableToolbarSeparator: () => DataTableToolbarSeparator
+});
+module.exports = __toCommonJS(DataTableToolbar_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("@phosphor-icons/react");
+var import_theme = require("@multiplatform.one/theme");
+var import_roving_focus = require("@tamagui/roving-focus");
+var import_react2 = require("react");
+var import_forms = require("@multiplatform.one/forms");
+var import_tamagui = require("tamagui");
+var import_DataTableStateContext = require("../DataTable/DataTableStateContext.native.js");
+var SearchIconWrapperFrame = (0, import_tamagui.styled)(import_tamagui.View, {
+  name: "DataTableSearchIconFrame",
+  paddingLeft: "$3",
+  alignItems: "center",
+  justifyContent: "center"
+});
+var ClearButtonWrapperFrame = (0, import_tamagui.styled)(import_tamagui.View, {
+  name: "DataTableClearButtonFrame",
+  paddingRight: "$2",
+  alignItems: "center",
+  justifyContent: "center"
+});
+var ToolbarDividerFrame = (0, import_tamagui.styled)(import_tamagui.View, {
+  name: "DataTableToolbarDividerFrame",
+  width: 1,
+  alignSelf: "stretch",
+  backgroundColor: "$color6"
+});
+function DataTableToolbar(props) {
+  var _ref, _props_globalFilter, _ref1, _props_onGlobalFilterChange, _ref2, _props_onClearFilters, _ref3, _props_onSaveView, _ref4, _props_views, _props_activeViewId;
+  var ctx = (0, import_DataTableStateContext.useDataTableState)();
+  var globalFilter = (_ref = (_props_globalFilter = props.globalFilter) !== null && _props_globalFilter !== void 0 ? _props_globalFilter : ctx === null || ctx === void 0 ? void 0 : ctx.state.globalFilter) !== null && _ref !== void 0 ? _ref : "";
+  var onGlobalFilterChange = (_ref1 = (_props_onGlobalFilterChange = props.onGlobalFilterChange) !== null && _props_onGlobalFilterChange !== void 0 ? _props_onGlobalFilterChange : ctx === null || ctx === void 0 ? void 0 : ctx.actions.setGlobalFilter) !== null && _ref1 !== void 0 ? _ref1 : function () {};
+  var onClearFilters = (_ref2 = (_props_onClearFilters = props.onClearFilters) !== null && _props_onClearFilters !== void 0 ? _props_onClearFilters : ctx === null || ctx === void 0 ? void 0 : ctx.actions.clearFilters) !== null && _ref2 !== void 0 ? _ref2 : function () {};
+  var onSaveView = (_ref3 = (_props_onSaveView = props.onSaveView) !== null && _props_onSaveView !== void 0 ? _props_onSaveView : ctx === null || ctx === void 0 ? void 0 : ctx.actions.saveView) !== null && _ref3 !== void 0 ? _ref3 : function () {};
+  var views = (_ref4 = (_props_views = props.views) !== null && _props_views !== void 0 ? _props_views : ctx === null || ctx === void 0 ? void 0 : ctx.state.views) !== null && _ref4 !== void 0 ? _ref4 : [];
+  var activeViewId = (_props_activeViewId = props.activeViewId) !== null && _props_activeViewId !== void 0 ? _props_activeViewId : ctx === null || ctx === void 0 ? void 0 : ctx.state.activeViewId;
+  var {
+    enableViews = false,
+    enableGlobalSearch = true,
+    enableFiltering: _enableFiltering = true,
+    showFilterCount: _showFilterCount = true,
+    showViewSelector = true,
+    customActions,
+    size,
+    compact: _compact = true
+  } = props;
+  var [showSaveViewDialog, setShowSaveViewDialog] = (0, import_react2.useState)(false);
+  var [newViewName, setNewViewName] = (0, import_react2.useState)("");
+  var activeView = views.find(function (v) {
+    return v.id === activeViewId;
+  });
+  var handleSaveView = function handleSaveView2() {
+    if (newViewName.trim()) {
+      onSaveView(newViewName.trim());
+      setNewViewName("");
+      setShowSaveViewDialog(false);
+    }
+  };
+  var {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)({
+    size,
+    compact: true
+  });
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+    alignItems: "stretch",
+    backgroundColor: "$color3",
+    borderWidth: 1,
+    borderBottomWidth: 0,
+    borderColor: "$color6",
+    borderTopLeftRadius: knobProps.borderRadius.borderRadius,
+    borderTopRightRadius: knobProps.borderRadius.borderRadius,
+    overflow: "hidden",
+    role: "toolbar",
+    "aria-label": "Table toolbar",
+    children: [/* Search Section - fills available space */
+    enableGlobalSearch && /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+      flex: 1,
+      alignItems: "center",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(SearchIconWrapperFrame, {
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.MagnifyingGlassIcon, {
+          size: 16
+        })
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+        flex: 1,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Input, {
+          value: globalFilter,
+          onChangeText: onGlobalFilterChange,
+          placeholder: "Search...",
+          "aria-label": "Search table data",
+          chromeless: true,
+          compact: true,
+          size: "$3"
+        })
+      }), globalFilter && /* @__PURE__ */(0, import_jsx_runtime.jsx)(ClearButtonWrapperFrame, {
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+          chromeless: true,
+          circular: true,
+          size: "$2",
+          padding: "$1",
+          onPress: function onPress() {
+            onGlobalFilterChange("");
+            onClearFilters();
+          },
+          icon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.XIcon, {
+            size: 14
+          }),
+          "aria-label": "Clear search"
+        })
+      })]
+    }), /* Right Section - Actions with roving focus for keyboard navigation */
+    (customActions || enableViews) && /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(ToolbarDividerFrame, {}), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_roving_focus.RovingFocusGroup, {
+        orientation: "horizontal",
+        loop: true,
+        asChild: true,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+          alignItems: "center",
+          paddingHorizontal: "$2",
+          gap: "$1",
+          children: [/* Custom Actions */
+          customActions, /* View Management */
+          enableViews && showViewSelector && /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+            children: [/* Save View Button */
+            /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_roving_focus.RovingFocusGroup.Item, {
+              focusable: true,
+              asChild: true,
+              children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.Popover, {
+                open: showSaveViewDialog,
+                onOpenChange: setShowSaveViewDialog,
+                children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Popover.Trigger, {
+                  asChild: true,
+                  children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+                    chromeless: true,
+                    size: "$2",
+                    icon: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.FloppyDiskIcon, {
+                      size: 16
+                    }),
+                    "aria-label": "Save view",
+                    focusStyle: {
+                      outlineColor: "$accentBackground",
+                      outlineWidth: 2
+                    }
+                  })
+                }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Popover.Content, {
+                  ...knobProps.borderRadius,
+                  borderColor: "$color6",
+                  enterStyle: {
+                    x: 0,
+                    y: -10,
+                    opacity: 0
+                  },
+                  exitStyle: {
+                    x: 0,
+                    y: -10,
+                    opacity: 0
+                  },
+                  children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+                    ...knobProps.gap,
+                    ...knobProps.panelPadding,
+                    minWidth: 250,
+                    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+                      fontWeight: "600",
+                      children: "Save Current View"
+                    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Input, {
+                      placeholder: "Enter view name...",
+                      value: newViewName,
+                      onChangeText: setNewViewName,
+                      size: "$3",
+                      compact: true,
+                      inputProps: {
+                        onKeyDown: function onKeyDown(e) {
+                          if (e.key === "Enter") handleSaveView();
+                        }
+                      }
+                    }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+                      gap: "$2",
+                      justifyContent: "flex-end",
+                      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+                        size: "$2",
+                        variant: "outlined",
+                        onPress: function onPress() {
+                          return setShowSaveViewDialog(false);
+                        },
+                        children: "Cancel"
+                      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Button, {
+                        size: "$2",
+                        onPress: handleSaveView,
+                        disabled: !newViewName.trim(),
+                        children: "Save"
+                      })]
+                    })]
+                  })
+                })]
+              })
+            }), /* Active View Indicator */
+            activeView && /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
+              alignItems: "center",
+              gap: "$1",
+              paddingHorizontal: "$2",
+              children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react.EyeIcon, {
+                size: 14
+              }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+                fontSize: "$2",
+                color: "$color10",
+                children: activeView.name
+              })]
+            })]
+          })]
+        })
+      })]
+    })]
+  });
+}
+function DataTableToolbarActions(param) {
+  var {
+    children
+  } = param;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.XStack, {
+    alignItems: "center",
+    gap: "$1",
+    children
+  });
+}
+function DataTableToolbarSeparator(param) {
+  var {
+    orientation = "vertical"
+  } = param;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Separator, {
+    vertical: orientation === "vertical",
+    marginHorizontal: orientation === "vertical" ? "$1" : 0,
+    marginVertical: orientation === "horizontal" ? "$1" : 0
+  });
+}
+//# sourceMappingURL=index.native.js.map

package/dist/cjs/components/DataTableToolbar/index.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","DataTableToolbar_exports","__export","DataTableToolbar","DataTableToolbarActions","DataTableToolbarSeparator","module","exports","import_jsx_runtime","require","import_react","import_theme","import_roving_focus","import_react2","import_forms","import_tamagui","import_DataTableStateContext","SearchIconWrapperFrame","styled","View","name","paddingLeft","alignItems","justifyContent","ClearButtonWrapperFrame","paddingRight","ToolbarDividerFrame","width","alignSelf","backgroundColor","props","_ref","_props_globalFilter","_ref1","_props_onGlobalFilterChange","_ref2","_props_onClearFilters","_ref3","_props_onSaveView","_ref4","_props_views","_props_activeViewId","ctx","useDataTableState","globalFilter","state","onGlobalFilterChange","actions","setGlobalFilter","onClearFilters","clearFilters","onSaveView","saveView","views","activeViewId","enableViews","enableGlobalSearch","enableFiltering","_enableFiltering","showFilterCount","_showFilterCount","showViewSelector","customActions","size","compact","_compact","showSaveViewDialog","setShowSaveViewDialog","useState","newViewName","setNewViewName","activeView","find","v","id","handleSaveView","handleSaveView2","trim","knobProps","useResolvedKnobs","jsxs","XStack","borderWidth","borderBottomWidth","borderColor","borderTopLeftRadius","borderRadius","borderTopRightRadius","overflow","role","children","flex","jsx","MagnifyingGlassIcon","Input","onChangeText","placeholder","chromeless","Button","circular","padding","onPress","icon","XIcon","Fragment","RovingFocusGroup","orientation","loop","asChild","paddingHorizontal","gap","Item","focusable","Popover","open","onOpenChange","Trigger","FloppyDiskIcon","focusStyle","outlineColor","outlineWidth","Content","enterStyle","x","y","opacity","exitStyle","YStack","panelPadding","minWidth","Text","fontWeight","inputProps","onKeyDown","e","key","variant"],"sources":["../../../../src/components/DataTableToolbar/index.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}