@happyvertical/smrt-products 0.37.2 → 0.37.4

package/dist/lib/chunks/ProductForm-CU0UvKEF.js

@@ -1,430 +0,0 @@
-import "svelte/internal/disclose-version";
-import * as $ from "svelte/internal/client";
-import { Button } from "@happyvertical/smrt-ui/ui";
-import { Form, Input, Textarea } from "@happyvertical/smrt-ui/forms";
-import { useI18n } from "@happyvertical/smrt-ui/i18n";
-import { M } from "../lib/i18n.js";
-var root_1$1 = $.from_html(`<div class="product-manufacturer svelte-11ja2cl"> </div>`);
-var root_2$1 = $.from_html(`<div class="product-model svelte-11ja2cl"> </div>`);
-var root_3$1 = $.from_html(`<p class="product-description svelte-11ja2cl"> </p>`);
-var root_4 = $.from_html(`<div class="product-category svelte-11ja2cl"> </div>`);
-var root_6 = $.from_html(`<span class="tag svelte-11ja2cl"> </span>`);
-var root_5 = $.from_html(`<div class="product-tags svelte-11ja2cl"></div>`);
-var root$1 = $.from_html(`<div class="product-card svelte-11ja2cl"><div class="product-header svelte-11ja2cl"><h3 class="product-name svelte-11ja2cl"> </h3> <!></div> <!> <!> <div class="product-meta svelte-11ja2cl"><!> <!></div> <div class="product-actions svelte-11ja2cl"><!> <!></div></div>`);
-function ProductCard($$anchor, $$props) {
-  $.push($$props, true);
-  var div = root$1();
-  var div_1 = $.child(div);
-  var h3 = $.child(div_1);
-  var text = $.child(h3, true);
-  $.reset(h3);
-  var node = $.sibling(h3, 2);
-  {
-    var consequent = ($$anchor2) => {
-      var div_2 = root_1$1();
-      var text_1 = $.child(div_2, true);
-      $.reset(div_2);
-      $.template_effect(() => $.set_text(text_1, $$props.product.manufacturer));
-      $.append($$anchor2, div_2);
-    };
-    $.if(node, ($$render) => {
-      if ($$props.product.manufacturer) $$render(consequent);
-    });
-  }
-  $.reset(div_1);
-  var node_1 = $.sibling(div_1, 2);
-  {
-    var consequent_1 = ($$anchor2) => {
-      var div_3 = root_2$1();
-      var text_2 = $.child(div_3);
-      $.reset(div_3);
-      $.template_effect(() => $.set_text(text_2, `Model: ${$$props.product.model ?? ""}`));
-      $.append($$anchor2, div_3);
-    };
-    $.if(node_1, ($$render) => {
-      if ($$props.product.model) $$render(consequent_1);
-    });
-  }
-  var node_2 = $.sibling(node_1, 2);
-  {
-    var consequent_2 = ($$anchor2) => {
-      var p = root_3$1();
-      var text_3 = $.child(p, true);
-      $.reset(p);
-      $.template_effect(() => $.set_text(text_3, $$props.product.description));
-      $.append($$anchor2, p);
-    };
-    $.if(node_2, ($$render) => {
-      if ($$props.product.description) $$render(consequent_2);
-    });
-  }
-  var div_4 = $.sibling(node_2, 2);
-  var node_3 = $.child(div_4);
-  {
-    var consequent_3 = ($$anchor2) => {
-      var div_5 = root_4();
-      var text_4 = $.child(div_5);
-      $.reset(div_5);
-      $.template_effect(() => $.set_text(text_4, `Category: ${$$props.product.category ?? ""}`));
-      $.append($$anchor2, div_5);
-    };
-    $.if(node_3, ($$render) => {
-      if ($$props.product.category) $$render(consequent_3);
-    });
-  }
-  var node_4 = $.sibling(node_3, 2);
-  {
-    var consequent_4 = ($$anchor2) => {
-      var div_6 = root_5();
-      $.each(div_6, 21, () => $$props.product.tags, $.index, ($$anchor3, tag) => {
-        var span = root_6();
-        var text_5 = $.child(span, true);
-        $.reset(span);
-        $.template_effect(() => $.set_text(text_5, $.get(tag)));
-        $.append($$anchor3, span);
-      });
-      $.reset(div_6);
-      $.append($$anchor2, div_6);
-    };
-    $.if(node_4, ($$render) => {
-      if ($$props.product.tags && $$props.product.tags.length > 0) $$render(consequent_4);
-    });
-  }
-  $.reset(div_4);
-  var div_7 = $.sibling(div_4, 2);
-  var node_5 = $.child(div_7);
-  {
-    var consequent_5 = ($$anchor2) => {
-      Button($$anchor2, {
-        type: "button",
-        variant: "secondary",
-        size: "sm",
-        onclick: () => $$props.onEdit?.($$props.product),
-        children: ($$anchor3, $$slotProps) => {
-          $.next();
-          var text_6 = $.text("Edit");
-          $.append($$anchor3, text_6);
-        },
-        $$slots: { default: true }
-      });
-    };
-    $.if(node_5, ($$render) => {
-      if ($$props.onEdit) $$render(consequent_5);
-    });
-  }
-  var node_6 = $.sibling(node_5, 2);
-  {
-    var consequent_6 = ($$anchor2) => {
-      Button($$anchor2, {
-        type: "button",
-        variant: "danger",
-        size: "sm",
-        onclick: () => $$props.onDelete?.($$props.product.id),
-        children: ($$anchor3, $$slotProps) => {
-          $.next();
-          var text_7 = $.text("Delete");
-          $.append($$anchor3, text_7);
-        },
-        $$slots: { default: true }
-      });
-    };
-    $.if(node_6, ($$render) => {
-      if ($$props.onDelete) $$render(consequent_6);
-    });
-  }
-  $.reset(div_7);
-  $.reset(div);
-  $.template_effect(() => $.set_text(text, $$props.product.name));
-  $.append($$anchor, div);
-  $.pop();
-}
-var root_2 = $.from_html(`<span class="error-message svelte-1hh5ovx"> </span>`);
-var root_3 = $.from_html(`<span class="error-message svelte-1hh5ovx"> </span>`);
-var root_1 = $.from_html(`<div class="form-group svelte-1hh5ovx"><label for="name" class="svelte-1hh5ovx"> </label> <!> <!></div> <div class="form-group svelte-1hh5ovx"><label for="description" class="svelte-1hh5ovx">Description</label> <!></div> <div class="form-row svelte-1hh5ovx"><div class="form-group svelte-1hh5ovx"><label for="price" class="svelte-1hh5ovx">Price *</label> <!> <!></div> <div class="form-group svelte-1hh5ovx"><label for="category" class="svelte-1hh5ovx">Category</label> <!></div></div> <div class="form-group svelte-1hh5ovx"><label for="tags" class="svelte-1hh5ovx">Tags</label> <!> <small class="form-hint svelte-1hh5ovx"> </small></div> <div class="form-group svelte-1hh5ovx"><label class="checkbox-label svelte-1hh5ovx"><input type="checkbox" class="form-checkbox svelte-1hh5ovx"/> </label></div> <div class="form-actions svelte-1hh5ovx"><!> <!></div>`, 1);
-var root = $.from_html(`<div class="product-form-shell svelte-1hh5ovx"><!></div>`);
-function ProductForm($$anchor, $$props) {
-  $.push($$props, true);
-  const { t } = useI18n();
-  const product = $.prop($$props, "product", 19, () => ({})), loading = $.prop($$props, "loading", 3, false);
-  const formData = $.proxy({
-    name: product().name || "",
-    description: product().description || "",
-    price: product().price || 0,
-    inStock: product().inStock ?? true,
-    category: product().category || "",
-    tags: product().tags?.join(", ") || ""
-  });
-  let errors = $.state($.proxy({}));
-  function validateForm() {
-    $.set(errors, {}, true);
-    if (!formData.name.trim()) {
-      $.get(errors).name = "Product name is required";
-    }
-    if (formData.price < 0) {
-      $.get(errors).price = "Price must be non-negative";
-    }
-    return Object.keys($.get(errors)).length === 0;
-  }
-  function handleSubmit(event) {
-    event.preventDefault();
-    if (!validateForm()) {
-      return;
-    }
-    const productData = {
-      ...product(),
-      name: formData.name.trim(),
-      description: formData.description.trim() || void 0,
-      price: formData.price,
-      inStock: formData.inStock,
-      category: formData.category.trim(),
-      tags: formData.tags ? formData.tags.split(",").map((tag) => tag.trim()).filter(Boolean) : []
-    };
-    $$props.onSubmit(productData);
-  }
-  var div = root();
-  var node = $.child(div);
-  Form(node, {
-    onsubmit: handleSubmit,
-    class: "product-form",
-    children: ($$anchor2, $$slotProps) => {
-      var fragment = root_1();
-      var div_1 = $.first_child(fragment);
-      var label = $.child(div_1);
-      var text = $.child(label, true);
-      $.reset(label);
-      var node_1 = $.sibling(label, 2);
-      {
-        let $0 = $.derived(() => $.get(errors).name ? "error" : "");
-        let $1 = $.derived(() => t(M["products.product_form.name_placeholder"]));
-        Input(node_1, {
-          id: "name",
-          type: "text",
-          get disabled() {
-            return loading();
-          },
-          get class() {
-            return $.get($0);
-          },
-          get placeholder() {
-            return $.get($1);
-          },
-          get value() {
-            return formData.name;
-          },
-          set value($$value) {
-            formData.name = $$value;
-          }
-        });
-      }
-      var node_2 = $.sibling(node_1, 2);
-      {
-        var consequent = ($$anchor3) => {
-          var span = root_2();
-          var text_1 = $.child(span, true);
-          $.reset(span);
-          $.template_effect(() => $.set_text(text_1, $.get(errors).name));
-          $.append($$anchor3, span);
-        };
-        $.if(node_2, ($$render) => {
-          if ($.get(errors).name) $$render(consequent);
-        });
-      }
-      $.reset(div_1);
-      var div_2 = $.sibling(div_1, 2);
-      var node_3 = $.sibling($.child(div_2), 2);
-      {
-        let $0 = $.derived(() => t(M["products.product_form.description_placeholder"]));
-        Textarea(node_3, {
-          id: "description",
-          get disabled() {
-            return loading();
-          },
-          get placeholder() {
-            return $.get($0);
-          },
-          rows: 3,
-          get value() {
-            return formData.description;
-          },
-          set value($$value) {
-            formData.description = $$value;
-          }
-        });
-      }
-      $.reset(div_2);
-      var div_3 = $.sibling(div_2, 2);
-      var div_4 = $.child(div_3);
-      var node_4 = $.sibling($.child(div_4), 2);
-      {
-        let $0 = $.derived(() => $.get(errors).price ? "error" : "");
-        Input(node_4, {
-          id: "price",
-          type: "number",
-          step: "0.01",
-          min: "0",
-          get disabled() {
-            return loading();
-          },
-          get class() {
-            return $.get($0);
-          },
-          placeholder: "0.00",
-          get value() {
-            return formData.price;
-          },
-          set value($$value) {
-            formData.price = $$value;
-          }
-        });
-      }
-      var node_5 = $.sibling(node_4, 2);
-      {
-        var consequent_1 = ($$anchor3) => {
-          var span_1 = root_3();
-          var text_2 = $.child(span_1, true);
-          $.reset(span_1);
-          $.template_effect(() => $.set_text(text_2, $.get(errors).price));
-          $.append($$anchor3, span_1);
-        };
-        $.if(node_5, ($$render) => {
-          if ($.get(errors).price) $$render(consequent_1);
-        });
-      }
-      $.reset(div_4);
-      var div_5 = $.sibling(div_4, 2);
-      var node_6 = $.sibling($.child(div_5), 2);
-      {
-        let $0 = $.derived(() => t(M["products.product_form.category_placeholder"]));
-        Input(node_6, {
-          id: "category",
-          type: "text",
-          get disabled() {
-            return loading();
-          },
-          get placeholder() {
-            return $.get($0);
-          },
-          get value() {
-            return formData.category;
-          },
-          set value($$value) {
-            formData.category = $$value;
-          }
-        });
-      }
-      $.reset(div_5);
-      $.reset(div_3);
-      var div_6 = $.sibling(div_3, 2);
-      var node_7 = $.sibling($.child(div_6), 2);
-      {
-        let $0 = $.derived(() => t(M["products.product_form.tags_placeholder"]));
-        Input(node_7, {
-          id: "tags",
-          type: "text",
-          get disabled() {
-            return loading();
-          },
-          get placeholder() {
-            return $.get($0);
-          },
-          get value() {
-            return formData.tags;
-          },
-          set value($$value) {
-            formData.tags = $$value;
-          }
-        });
-      }
-      var small = $.sibling(node_7, 2);
-      var text_3 = $.child(small, true);
-      $.reset(small);
-      $.reset(div_6);
-      var div_7 = $.sibling(div_6, 2);
-      var label_1 = $.child(div_7);
-      var input = $.child(label_1);
-      $.remove_input_defaults(input);
-      var text_4 = $.sibling(input);
-      $.reset(label_1);
-      $.reset(div_7);
-      var div_8 = $.sibling(div_7, 2);
-      var node_8 = $.child(div_8);
-      {
-        var consequent_2 = ($$anchor3) => {
-          Button($$anchor3, {
-            type: "button",
-            variant: "secondary",
-            get onclick() {
-              return $$props.onCancel;
-            },
-            get disabled() {
-              return loading();
-            },
-            children: ($$anchor4, $$slotProps2) => {
-              $.next();
-              var text_5 = $.text("Cancel");
-              $.append($$anchor4, text_5);
-            },
-            $$slots: { default: true }
-          });
-        };
-        $.if(node_8, ($$render) => {
-          if ($$props.onCancel) $$render(consequent_2);
-        });
-      }
-      var node_9 = $.sibling(node_8, 2);
-      Button(node_9, {
-        type: "submit",
-        variant: "primary",
-        get disabled() {
-          return loading();
-        },
-        children: ($$anchor3, $$slotProps2) => {
-          var fragment_2 = $.comment();
-          var node_10 = $.first_child(fragment_2);
-          {
-            var consequent_3 = ($$anchor4) => {
-              var text_6 = $.text("Saving...");
-              $.append($$anchor4, text_6);
-            };
-            var alternate = ($$anchor4) => {
-              var text_7 = $.text();
-              $.template_effect(() => $.set_text(text_7, product().id ? "Update Product" : "Create Product"));
-              $.append($$anchor4, text_7);
-            };
-            $.if(node_10, ($$render) => {
-              if (loading()) $$render(consequent_3);
-              else $$render(alternate, -1);
-            });
-          }
-          $.append($$anchor3, fragment_2);
-        },
-        $$slots: { default: true }
-      });
-      $.reset(div_8);
-      $.template_effect(
-        ($0, $1, $2) => {
-          $.set_text(text, $0);
-          $.set_text(text_3, $1);
-          input.disabled = loading();
-          $.set_text(text_4, ` ${$2 ?? ""}`);
-        },
-        [
-          () => t(M["products.product_form.name_label"]),
-          () => t(M["products.product_form.tags_hint"]),
-          () => t(M["products.product_form.in_stock_label"])
-        ]
-      );
-      $.bind_checked(input, () => formData.inStock, ($$value) => formData.inStock = $$value);
-      $.append($$anchor2, fragment);
-    },
-    $$slots: { default: true }
-  });
-  $.reset(div);
-  $.append($$anchor, div);
-  $.pop();
-}
-export {
-  ProductCard as P,
-  ProductForm as a
-};
-//# sourceMappingURL=ProductForm-CU0UvKEF.js.map

package/dist/lib/chunks/ProductForm-CU0UvKEF.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ProductForm-CU0UvKEF.js","sources":["../../../src/lib/components/ProductCard.svelte","../../../src/lib/components/ProductForm.svelte"],"sourcesContent":["<script lang=\"ts\">\nimport { Button } from '@happyvertical/smrt-ui/ui';\nimport type { ProductData } from '../types';\n\ninterface Props {\n  product: ProductData;\n  onEdit?: (product: ProductData) => void;\n  onDelete?: (id: string) => void;\n}\n\nconst { product, onEdit, onDelete }: Props = $props();\n</script>\n\n<div class=\"product-card\">\n  <div class=\"product-header\">\n    <h3 class=\"product-name\">{product.name}</h3>\n    {#if product.manufacturer}\n      <div class=\"product-manufacturer\">{product.manufacturer}</div>\n    {/if}\n  </div>\n\n  {#if product.model}\n    <div class=\"product-model\">Model: {product.model}</div>\n  {/if}\n\n  {#if product.description}\n    <p class=\"product-description\">{product.description}</p>\n  {/if}\n\n  <div class=\"product-meta\">\n    {#if product.category}\n      <div class=\"product-category\">Category: {product.category}</div>\n    {/if}\n    \n    {#if product.tags && product.tags.length > 0}\n      <div class=\"product-tags\">\n        {#each product.tags as tag}\n          <span class=\"tag\">{tag}</span>\n        {/each}\n      </div>\n    {/if}\n  </div>\n  \n  <div class=\"product-actions\">\n    {#if onEdit}\n      <Button type=\"button\" variant=\"secondary\" size=\"sm\" onclick={() => onEdit?.(product)}>\n        Edit\n      </Button>\n    {/if}\n\n    {#if onDelete}\n      <Button type=\"button\" variant=\"danger\" size=\"sm\" onclick={() => onDelete?.(product.id)}>\n        Delete\n      </Button>\n    {/if}\n  </div>\n</div>\n\n<style>\n  .product-card {\n    border: 1px solid var(--smrt-color-outline-variant, #e2e8f0);\n    border-radius: var(--smrt-radius-md, 8px);\n    padding: 1rem;\n    background: var(--smrt-color-surface, #fff);\n    box-shadow: var(--smrt-elevation-1, 0 1px 3px color-mix(in srgb, var(--smrt-color-shadow, #000) 10%, transparent));\n    transition: box-shadow 0.2s;\n  }\n\n  .product-card:hover {\n    box-shadow: var(--smrt-elevation-2, 0 4px 6px color-mix(in srgb, var(--smrt-color-shadow, #000) 10%, transparent));\n  }\n  \n  .product-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    margin-bottom: 0.5rem;\n  }\n  \n  .product-name {\n    margin: 0;\n    font-size: var(--smrt-typography-title-medium-size, 1.125rem);\n    font-weight: var(--smrt-typography-weight-semibold, 600);\n    color: var(--smrt-color-on-surface, #1f2937);\n  }\n\n  .product-manufacturer {\n    font-size: var(--smrt-typography-title-small-size, 0.875rem);\n    font-weight: var(--smrt-typography-weight-medium, 500);\n    color: var(--smrt-color-on-surface-variant, #6b7280);\n  }\n\n  .product-model {\n    font-size: var(--smrt-typography-body-medium-size, 0.875rem);\n    color: var(--smrt-color-on-surface-variant, #6b7280);\n    margin-bottom: 0.5rem;\n  }\n\n  .product-category {\n    font-size: var(--smrt-typography-label-medium-size, 0.75rem);\n    font-weight: var(--smrt-typography-weight-medium, 500);\n    color: var(--smrt-color-on-surface, #374151);\n    background: var(--smrt-color-surface-container, #f3f4f6);\n    padding: 0.25rem 0.5rem;\n    border-radius: var(--smrt-radius-sm, 4px);\n    display: inline-block;\n    margin-bottom: 0.5rem;\n  }\n  \n  .product-description {\n    margin: 0.5rem 0;\n    color: var(--smrt-color-on-surface-variant, #6b7280);\n    font-size: var(--smrt-typography-body-medium-size, 0.875rem);\n    line-height: var(--smrt-typography-body-medium-line-height, 1.4);\n  }\n  \n  .product-meta {\n    margin: 0.75rem 0;\n  }\n  \n  \n  .product-tags {\n    margin-top: 0.5rem;\n    display: flex;\n    flex-wrap: wrap;\n    gap: 0.25rem;\n  }\n  \n  .tag {\n    background: var(--smrt-color-surface-container, #f3f4f6);\n    color: var(--smrt-color-on-surface, #374151);\n    padding: 0.125rem 0.5rem;\n    border-radius: var(--smrt-radius-full, 9999px);\n    font-size: var(--smrt-typography-label-medium-size, 0.75rem);\n  }\n\n  .product-actions {\n    display: flex;\n    gap: 0.5rem;\n    margin-top: 1rem;\n    padding-top: 0.75rem;\n    border-top: 1px solid var(--smrt-color-outline-variant, #f3f4f6);\n  }\n</style>","<script lang=\"ts\">\nimport { Form, Input, Textarea } from '@happyvertical/smrt-ui/forms';\nimport { useI18n } from '@happyvertical/smrt-ui/i18n';\nimport { Button } from '@happyvertical/smrt-ui/ui';\nimport { M } from '../i18n.js';\nimport type { ProductData } from '../types';\n\nconst { t } = useI18n();\n\ninterface Props {\n  product?: Partial<ProductData>;\n  onSubmit: (product: Partial<ProductData>) => void;\n  onCancel?: () => void;\n  loading?: boolean;\n}\n\nconst { product = {}, onSubmit, onCancel, loading = false }: Props = $props();\n\nconst formData = $state({\n  name: product.name || '',\n  description: product.description || '',\n  price: product.price || 0,\n  inStock: product.inStock ?? true,\n  category: product.category || '',\n  tags: product.tags?.join(', ') || '',\n});\n\nlet errors = $state<Record<string, string>>({});\n\nfunction validateForm() {\n  errors = {};\n\n  if (!formData.name.trim()) {\n    errors.name = 'Product name is required';\n  }\n\n  if (formData.price < 0) {\n    errors.price = 'Price must be non-negative';\n  }\n\n  return Object.keys(errors).length === 0;\n}\n\nfunction handleSubmit(event: Event) {\n  event.preventDefault();\n\n  if (!validateForm()) {\n    return;\n  }\n\n  const productData: Partial<ProductData> = {\n    ...product,\n    name: formData.name.trim(),\n    description: formData.description.trim() || undefined,\n    price: formData.price,\n    inStock: formData.inStock,\n    category: formData.category.trim(),\n    tags: formData.tags\n      ? formData.tags\n          .split(',')\n          .map((tag) => tag.trim())\n          .filter(Boolean)\n      : [],\n  };\n\n  onSubmit(productData);\n}\n</script>\n\n<div class=\"product-form-shell\">\n  <Form onsubmit={handleSubmit} class=\"product-form\">\n    <div class=\"form-group\">\n      <label for=\"name\">{t(M['products.product_form.name_label'])}</label>\n      <Input\n        id=\"name\"\n        type=\"text\"\n        bind:value={formData.name}\n        disabled={loading}\n        class={errors.name ? 'error' : ''}\n        placeholder={t(M['products.product_form.name_placeholder'])}\n      />\n      {#if errors.name}\n        <span class=\"error-message\">{errors.name}</span>\n      {/if}\n    </div>\n\n    <div class=\"form-group\">\n      <label for=\"description\">Description</label>\n      <Textarea\n        id=\"description\"\n        bind:value={formData.description}\n        disabled={loading}\n        placeholder={t(M['products.product_form.description_placeholder'])}\n        rows={3}\n      ></Textarea>\n    </div>\n\n    <div class=\"form-row\">\n      <div class=\"form-group\">\n        <label for=\"price\">Price *</label>\n        <Input\n          id=\"price\"\n          type=\"number\"\n          step=\"0.01\"\n          min=\"0\"\n          bind:value={formData.price}\n          disabled={loading}\n          class={errors.price ? 'error' : ''}\n          placeholder=\"0.00\"\n        />\n        {#if errors.price}\n          <span class=\"error-message\">{errors.price}</span>\n        {/if}\n      </div>\n\n      <div class=\"form-group\">\n        <label for=\"category\">Category</label>\n        <Input\n          id=\"category\"\n          type=\"text\"\n          bind:value={formData.category}\n          disabled={loading}\n          placeholder={t(M['products.product_form.category_placeholder'])}\n        />\n      </div>\n    </div>\n\n    <div class=\"form-group\">\n      <label for=\"tags\">Tags</label>\n      <Input\n        id=\"tags\"\n        type=\"text\"\n        bind:value={formData.tags}\n        disabled={loading}\n        placeholder={t(M['products.product_form.tags_placeholder'])}\n      />\n      <small class=\"form-hint\">{t(M['products.product_form.tags_hint'])}</small>\n    </div>\n\n    <div class=\"form-group\">\n      <label class=\"checkbox-label\">\n        <!-- raw-primitive-allow: native checkbox; no Provider-free checkbox primitive (Toggle is a switch with different semantics, CheckboxInput requires a Provider) -->\n        <input\n          type=\"checkbox\"\n          bind:checked={formData.inStock}\n          disabled={loading}\n          class=\"form-checkbox\"\n        />\n        {t(M['products.product_form.in_stock_label'])}\n      </label>\n    </div>\n\n    <div class=\"form-actions\">\n      {#if onCancel}\n        <Button type=\"button\" variant=\"secondary\" onclick={onCancel} disabled={loading}>\n          Cancel\n        </Button>\n      {/if}\n\n      <Button type=\"submit\" variant=\"primary\" disabled={loading}>\n        {#if loading}\n          Saving...\n        {:else}\n          {product.id ? 'Update Product' : 'Create Product'}\n        {/if}\n      </Button>\n    </div>\n  </Form>\n</div>\n\n<style>\n  .product-form-shell :global(.product-form) {\n    max-width: 500px;\n    padding: 1.5rem;\n    background: var(--smrt-color-surface, #fff);\n    border-radius: var(--smrt-radius-md, 8px);\n    border: 1px solid var(--smrt-color-outline-variant, #e2e8f0);\n  }\n\n  .form-group {\n    margin-bottom: 1rem;\n  }\n\n  .form-row {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 1rem;\n  }\n\n  label {\n    display: block;\n    margin-bottom: 0.25rem;\n    font-weight: var(--smrt-typography-weight-medium, 500);\n    color: var(--smrt-color-on-surface, #374151);\n    font-size: var(--smrt-typography-label-large-size, 0.875rem);\n  }\n\n  /* Error border on the migrated <Input>. The primitive renders the inner\n     <input class=\"input error\"> inside its own component, so the scoped class\n     can't reach it without :global (#1589). */\n  .product-form-shell :global(.input.error) {\n    border-color: var(--smrt-color-error, #dc2626);\n  }\n\n  .checkbox-label {\n    display: flex;\n    align-items: center;\n    gap: 0.5rem;\n    cursor: pointer;\n  }\n  \n  .form-checkbox {\n    width: auto;\n  }\n  \n  .form-hint {\n    color: var(--smrt-color-on-surface-variant, #6b7280);\n    font-size: var(--smrt-typography-body-small-size, 0.75rem);\n    margin-top: 0.25rem;\n  }\n\n  .error-message {\n    color: var(--smrt-color-error, #dc2626);\n    font-size: var(--smrt-typography-label-medium-size, 0.75rem);\n    margin-top: 0.25rem;\n    display: block;\n  }\n\n  .form-actions {\n    display: flex;\n    gap: 0.75rem;\n    justify-content: flex-end;\n    margin-top: 1.5rem;\n    padding-top: 1rem;\n    border-top: 1px solid var(--smrt-color-outline-variant, #f3f4f6);\n  }\n</style>"],"names":["root","root_1","root_2","root_3","$$anchor"],"mappings":"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"}