@moving-walls/design-system 1.0.13 → 1.0.15

package/dist/index.js

@@ -12246,7 +12246,7 @@ const ImageUpscale = createLucideIcon("ImageUpscale", [
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const Image = createLucideIcon("Image", [
+const Image$1 = createLucideIcon("Image", [
     ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", ry: "2", key: "1m3agn" }],
     ["circle", { cx: "9", cy: "9", r: "2", key: "af1f0g" }],
     ["path", { d: "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21", key: "1xmnt7" }]
@@ -24716,7 +24716,7 @@ var index$1 = /*#__PURE__*/Object.freeze({
     IceCreamBowl: IceCreamBowl,
     IceCreamCone: IceCreamCone,
     IdCard: IdCard,
-    Image: Image,
+    Image: Image$1,
     ImageDown: ImageDown,
     ImageMinus: ImageMinus,
     ImageOff: ImageOff,
@@ -27235,10 +27235,10 @@ var LucideIcons = /*#__PURE__*/Object.freeze({
     Icon: Icon$1,
     IdCard: IdCard,
     IdCardIcon: IdCard,
-    Image: Image,
+    Image: Image$1,
     ImageDown: ImageDown,
     ImageDownIcon: ImageDown,
-    ImageIcon: Image,
+    ImageIcon: Image$1,
     ImageMinus: ImageMinus,
     ImageMinusIcon: ImageMinus,
     ImageOff: ImageOff,
@@ -28313,7 +28313,7 @@ var LucideIcons = /*#__PURE__*/Object.freeze({
     LucideIceCreamBowl: IceCreamBowl,
     LucideIceCreamCone: IceCreamCone,
     LucideIdCard: IdCard,
-    LucideImage: Image,
+    LucideImage: Image$1,
     LucideImageDown: ImageDown,
     LucideImageMinus: ImageMinus,
     LucideImageOff: ImageOff,
@@ -37588,7 +37588,8 @@ function Form(_ref) {
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 'md' : _ref$size,
     _ref$layout = _ref.layout,
-    layout = _ref$layout === void 0 ? 'vertical' : _ref$layout;
+    layout = _ref$layout === void 0 ? 'vertical' : _ref$layout,
+    id = _ref.id;
   var handleSubmit = function handleSubmit(event) {
     if (onSubmit) {
       event.preventDefault();
@@ -37601,6 +37602,7 @@ function Form(_ref) {
       size: size
     },
     children: require$$1.jsx("form", {
+      id: id,
       onSubmit: handleSubmit,
       className: cn$m(formLayouts[layout], formSizes[size], className),
       children: children
@@ -37773,7 +37775,7 @@ function formatFileSize(bytes) {
 }
 function getFileIcon$1(file) {
   if (file.type.startsWith('image/')) {
-    return require$$1.jsx(Image, {
+    return require$$1.jsx(Image$1, {
       className: "w-4 h-4"
     });
   }
@@ -39992,7 +39994,7 @@ function RichTextEditor(_ref2) {
       }), require$$1.jsx(ToolbarButton, {
         onClick: formatCommands.image,
         title: "Insert Image",
-        children: require$$1.jsx(Image, {
+        children: require$$1.jsx(Image$1, {
           className: "w-4 h-4"
         })
       })]
@@ -42506,7 +42508,7 @@ var emptyStateIcons = {
   folder: require$$1.jsx(FolderOpen, {
     className: "w-12 h-12 text-mw-neutral-400"
   }),
-  image: require$$1.jsx(Image, {
+  image: require$$1.jsx(Image$1, {
     className: "w-12 h-12 text-mw-neutral-400"
   }),
   document: require$$1.jsx(FileText, {
@@ -45797,6 +45799,101 @@ function SheetDescription(_a) {
   }));
 }
 
+var variantConfig = {
+  destructive: {
+    icon: Trash2,
+    iconClass: "text-red-500",
+    bgClass: "bg-red-50 dark:bg-red-950/30",
+    buttonClass: "bg-red-600 hover:bg-red-700 text-white border-transparent"
+  },
+  warning: {
+    icon: TriangleAlert,
+    iconClass: "text-amber-500",
+    bgClass: "bg-amber-50 dark:bg-amber-950/30",
+    buttonClass: "bg-amber-500 hover:bg-amber-600 text-white border-transparent"
+  },
+  "default": {
+    icon: Info,
+    iconClass: "text-mw-primary-500",
+    bgClass: "bg-mw-primary-50 dark:bg-mw-primary-950/30",
+    buttonClass: undefined // uses Button variant="primary"
+  }
+};
+function ConfirmSheet(_ref) {
+  var open = _ref.open,
+    onOpenChange = _ref.onOpenChange,
+    title = _ref.title,
+    description = _ref.description,
+    children = _ref.children,
+    _ref$confirmLabel = _ref.confirmLabel,
+    confirmLabel = _ref$confirmLabel === void 0 ? "Confirm" : _ref$confirmLabel,
+    _ref$cancelLabel = _ref.cancelLabel,
+    cancelLabel = _ref$cancelLabel === void 0 ? "Cancel" : _ref$cancelLabel,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? "default" : _ref$variant,
+    _ref$isLoading = _ref.isLoading,
+    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
+    onConfirm = _ref.onConfirm,
+    onCancel = _ref.onCancel;
+  var config = variantConfig[variant];
+  var Icon = config.icon;
+  var handleCancel = function handleCancel() {
+    if (onCancel) {
+      onCancel();
+    } else {
+      onOpenChange(false);
+    }
+  };
+  return require$$1.jsx(Sheet, {
+    open: open,
+    onOpenChange: onOpenChange,
+    children: require$$1.jsxs(SheetContent, {
+      side: "right",
+      size: "sm",
+      className: "flex flex-col p-0",
+      children: [require$$1.jsx(SheetHeader, {
+        className: "px-6 py-5 border-b border-mw-neutral-200 dark:border-mw-neutral-700 flex-shrink-0",
+        children: require$$1.jsx(SheetTitle, {
+          children: title
+        })
+      }), require$$1.jsxs("div", {
+        className: "flex-1 overflow-auto min-h-0 px-6 py-5 space-y-4",
+        children: [require$$1.jsxs("div", {
+          className: clsx("flex items-start gap-3 rounded-lg p-4", config.bgClass),
+          children: [require$$1.jsx(Icon, {
+            className: clsx("h-5 w-5 mt-0.5 flex-shrink-0", config.iconClass)
+          }), description && require$$1.jsx("div", {
+            className: "text-sm text-mw-neutral-700 dark:text-mw-neutral-300",
+            children: description
+          })]
+        }), children && require$$1.jsx("div", {
+          className: "text-sm text-mw-neutral-600 dark:text-mw-neutral-400",
+          children: children
+        })]
+      }), require$$1.jsxs(SheetFooter, {
+        className: "flex-shrink-0 border-t border-mw-neutral-200 dark:border-mw-neutral-700 px-6 py-4",
+        children: [require$$1.jsx(Button, {
+          variant: "outline",
+          onClick: handleCancel,
+          disabled: isLoading,
+          children: cancelLabel
+        }), variant === "default" ? require$$1.jsx(Button, {
+          variant: "primary",
+          onClick: onConfirm,
+          disabled: isLoading,
+          children: isLoading ? "Loading..." : confirmLabel
+        }) : require$$1.jsx("button", {
+          onClick: onConfirm,
+          disabled: isLoading,
+          className: clsx("inline-flex items-center justify-center gap-2 rounded-md px-4 py-2 text-sm font-medium transition-colors", "disabled:opacity-50 disabled:cursor-not-allowed", config.buttonClass),
+          children: isLoading ? "Loading..." : confirmLabel
+        })]
+      })]
+    })
+  });
+}
+ConfirmSheet.displayName = "ConfirmSheet";
+
 var PopoverContext = /*#__PURE__*/React.createContext(null);
 function Popover(_ref) {
   var _ref$open = _ref.open,
@@ -48327,6 +48424,24 @@ function ThumbnailGallery(_ref2) {
   });
 }
 
+/**
+ * Design system Image component.
+ * - Wraps native <img> so alt is a required prop (accessibility enforcement)
+ * - Defaults to loading="lazy" for performance
+ * - Use this instead of native <img> anywhere in the application
+ */
+function Image(_a) {
+  var alt = _a.alt,
+    _a$loading = _a.loading,
+    loading = _a$loading === void 0 ? 'lazy' : _a$loading,
+    props = __rest$1(_a, ["alt", "loading"]);
+  return require$$1.jsx("img", Object.assign({
+    alt: alt,
+    loading: loading
+  }, props));
+}
+Image.displayName = 'Image';
+
 function cn$3() {
   for (var _len = arguments.length, classes = new Array(_len), _key = 0; _key < _len; _key++) {
     classes[_key] = arguments[_key];
@@ -48432,7 +48547,7 @@ function useDragDrop(_ref) {
 function getFileIcon(file) {
   var type = file.type;
   var name = file.name.toLowerCase();
-  if (type.startsWith('image/')) return require$$1.jsx(Image, {
+  if (type.startsWith('image/')) return require$$1.jsx(Image$1, {
     className: "w-6 h-6"
   });
   if (type.startsWith('video/')) return require$$1.jsx(Video, {
@@ -57094,6 +57209,7 @@ exports.Command = Command;
 exports.CommandGroup = CommandGroup;
 exports.CommandItem = CommandItem;
 exports.CommandSeparator = CommandSeparator;
+exports.ConfirmSheet = ConfirmSheet;
 exports.Container = Container;
 exports.CounterAnimation = CounterAnimation;
 exports.DataGrid = DataGrid;
@@ -57144,6 +57260,7 @@ exports.GridContainer = GridContainer;
 exports.HStack = HStack;
 exports.Heading = Heading;
 exports.Icon = Icon$2;
+exports.Image = Image;
 exports.ImageCarousel = ImageCarousel;
 exports.ImageThumbnail = ImageThumbnail;
 exports.InfoIcon = InfoIcon;