@foxy.io/elements 1.29.0-beta.3 → 1.29.0-beta.5

package/dist/cdn/translations/item-category-form/en.json

@@ -16,19 +16,23 @@
       "done": "Copied to clipboard"
     }
   },
-  "name": {
-    "label": "Name",
-    "placeholder": "Books",
-    "helper_text": "Category description for admins.",
-    "v8n_required": "Item category name is required",
-    "v8n_too_long": "Item category name can't exceed 50 characters"
-  },
-  "code": {
-    "label": "Code",
-    "placeholder": "MY_BOOKS_CATEGORY",
-    "helper_text": "Unique identifier for the cart.",
-    "v8n_required": "Item category code is required",
-    "v8n_too_long": "Item categoty code can't exceed 50 characters"
+  "general": {
+    "label": "",
+    "helper_text": "",
+    "name": {
+      "label": "Name",
+      "placeholder": "Books",
+      "helper_text": "",
+      "v8n_required": "Item category name is required",
+      "v8n_too_long": "Item category name can't exceed 50 characters"
+    },
+    "code": {
+      "label": "Code",
+      "placeholder": "MY_BOOKS_CATEGORY",
+      "helper_text": "",
+      "v8n_required": "Item category code is required",
+      "v8n_too_long": "Item categoty code can't exceed 50 characters"
+    }
   },
   "taxes": {
     "label": "Taxes",
@@ -54,146 +58,175 @@
     },
     "helper_text": "Select taxes that will apply to the products in this category. Changes here are saved immediately."
   },
-  "item-delivery-type": {
-    "label": "Delivery",
-    "option_shipped": "Shipped using live rates",
-    "option_flat_rate": "Shipped using a flat rate",
-    "option_downloaded": "Downloaded by the customer",
-    "option_pickup": "Picked up by the customer",
-    "option_notshipped": "Not shipped",
-    "placeholder": "Select...",
-    "helper_text": "",
-    "v8n_required": "Please select a delivery type"
-  },
-  "default-weight": {
-    "label": "Default weight",
-    "placeholder": "1",
-    "helper_text": "",
-    "v8n_required": "This field is required",
-    "v8n_negative": "Please enter a positive number"
-  },
-  "default-weight-unit": {
-    "label": "Default weight unit",
-    "placeholder": "Select...",
-    "option_kgs": "KG",
-    "option_lbs": "LG",
-    "helper_text": "",
-    "v8n_required": "Please select a unit"
-  },
-  "default-length-unit": {
-    "label": "Default length unit",
-    "placeholder": "Select...",
-    "option_cm": "CM",
-    "option_in": "IN",
-    "helper_text": "",
-    "v8n_required": "Please select a unit"
-  },
-  "max-downloads-per-customer": {
-    "label": "Max downloads",
-    "placeholder": "3",
-    "helper_text": "",
-    "v8n_required": "This field is required",
-    "v8n_negative": "Please enter a positive number"
-  },
-  "max-downloads-time-period": {
-    "label": "Access duration (hrs)",
-    "placeholder": "24",
-    "helper_text": "",
-    "v8n_required": "This field is required",
-    "v8n_negative": "Please enter a positive number"
-  },
-  "shipping-flat-rate": {
-    "label": "Rate",
-    "placeholder": "0",
-    "helper_text": "",
-    "v8n_required": "This field is required",
-    "v8n_negative": "Please enter a positive number"
-  },
-  "shipping-flat-rate-type": {
-    "label": "Applies",
-    "placeholder": "Select...",
-    "option_per_order": "Per order",
-    "option_per_shipment": "Per shipment",
-    "helper_text": "",
-    "v8n_required": "Please select a value"
-  },
-  "customs-value": {
-    "label": "Customs value",
-    "placeholder": "0",
-    "helper_text": "Enter a dollar amount here for the declared customs value for international shipments. If you leave this blank, the sale price of the item will be used.",
-    "v8n_negative": "Please enter a positive number"
-  },
-  "handling-fee-type": {
-    "label": "Handling fee",
-    "option_none": "No handling fee",
-    "option_flat_per_order": "Flat fee per shipment",
-    "option_flat_per_item": "Flat fee per product",
-    "option_flat_percent": "Flat fee per shipment + % of price",
-    "option_flat_percent_with_minimum": "Flat fee per shipment or % of price, whichever is greater",
-    "placeholder": "Select...",
-    "helper_text": "",
-    "v8n_required": "Please select a value"
-  },
-  "handling-fee": {
-    "label": "Amount",
-    "placeholder": "0",
-    "helper_text": "",
-    "v8n_required": "This field is required",
-    "v8n_negative": "Please enter a positive number"
-  },
-  "handling-fee-minimum": {
-    "label": "Minimum fee",
-    "placeholder": "0",
+  "delivery": {
+    "label": "Delivery Options",
     "helper_text": "",
-    "v8n_required": "This field is required",
-    "v8n_negative": "Please enter a positive number"
+    "item-delivery-type": {
+      "label": "Delivery type",
+      "option_shipped": "Shipped using live rates",
+      "option_flat_rate": "Shipped using a flat rate",
+      "option_downloaded": "Downloaded by the customer",
+      "option_pickup": "Picked up by the customer",
+      "option_notshipped": "Not shipped",
+      "placeholder": "Select...",
+      "helper_text": "",
+      "v8n_required": "Please select a delivery type"
+    },
+    "max-downloads-per-customer": {
+      "label": "Max downloads",
+      "placeholder": "3",
+      "helper_text": "",
+      "v8n_required": "This field is required",
+      "v8n_negative": "Please enter a positive number"
+    },
+    "max-downloads-time-period": {
+      "label": "Access duration (hrs)",
+      "placeholder": "24",
+      "helper_text": "",
+      "v8n_required": "This field is required",
+      "v8n_negative": "Please enter a positive number"
+    },
+    "shipping-flat-rate": {
+      "label": "Shipping rate",
+      "placeholder": "0",
+      "helper_text": "",
+      "v8n_required": "This field is required",
+      "v8n_negative": "Please enter a positive number"
+    },
+    "shipping-flat-rate-type": {
+      "label": "Flat rate applies",
+      "placeholder": "Select...",
+      "option_per_order": "Per order",
+      "option_per_shipment": "Per shipment",
+      "helper_text": "",
+      "v8n_required": "Please select a value"
+    },
+    "customs-value": {
+      "label": "Customs value",
+      "placeholder": "0",
+      "helper_text": "Enter a dollar amount here for the declared customs value for international shipments. If you leave this blank, the sale price of the item will be used.",
+      "v8n_negative": "Please enter a positive number"
+    },
+    "default-weight": {
+      "label": "Default weight",
+      "placeholder": "1",
+      "helper_text": "",
+      "v8n_required": "This field is required",
+      "v8n_negative": "Please enter a positive number"
+    },
+    "default-weight-unit": {
+      "label": "Default weight unit",
+      "placeholder": "Select...",
+      "option_kgs": "KG",
+      "option_lbs": "LG",
+      "helper_text": "",
+      "v8n_required": "Please select a unit"
+    },
+    "default-length-unit": {
+      "label": "Default length unit",
+      "placeholder": "Select...",
+      "option_cm": "CM",
+      "option_in": "IN",
+      "helper_text": "",
+      "v8n_required": "Please select a unit"
+    }
   },
-  "handling-fee-percentage": {
-    "label": "Percentage of price",
-    "placeholder": "0",
+  "handling-and-discount": {
+    "label": "Handling Fees and Discounts",
     "helper_text": "",
-    "v8n_required": "This field is required",
-    "v8n_negative": "Please enter a positive number"
-  },
-  "discount-name": {
-    "label": "Discount",
-    "placeholder": "Name your discount to open the builder",
-    "helper_text": ""
-  },
-  "discount-builder": {
-    "tier": "Tier",
-    "tier_by": "by",
-    "tier_if": "if",
-    "tier_allunits": "price of each item",
-    "tier_incremental": "price of additional items",
-    "tier_repeat": "price of next item",
-    "tier_single": "order total",
-    "tier_then": "then",
-    "quantity": "quantity",
-    "total": "total",
-    "reduce": "reduce",
-    "increase": "increase"
-  },
-  "admin-email-template-uri": {
-    "label": "Message to admin",
-    "placeholder": "None (don't send)",
-    "helper_text": ""
+    "handling-fee-type": {
+      "label": "Handling fee type",
+      "option_none": "No handling fee",
+      "option_flat_per_order": "Flat fee per shipment",
+      "option_flat_per_item": "Flat fee per product",
+      "option_flat_percent": "Flat fee per shipment + % of price",
+      "option_flat_percent_with_minimum": "Flat fee per shipment or % of price, whichever is greater",
+      "placeholder": "Select...",
+      "helper_text": "",
+      "v8n_required": "Please select a value"
+    },
+    "handling-fee": {
+      "label": "Handling fee amount",
+      "placeholder": "0",
+      "helper_text": "",
+      "v8n_required": "This field is required",
+      "v8n_negative": "Please enter a positive number"
+    },
+    "handling-fee-minimum": {
+      "label": "Minimum fee",
+      "placeholder": "0",
+      "helper_text": "",
+      "v8n_required": "This field is required",
+      "v8n_negative": "Please enter a positive number"
+    },
+    "handling-fee-percentage": {
+      "label": "Percentage of price",
+      "placeholder": "0",
+      "helper_text": "",
+      "v8n_required": "This field is required",
+      "v8n_negative": "Please enter a positive number"
+    },
+    "discount-name": {
+      "label": "Discount",
+      "placeholder": "None",
+      "helper_text": "Enter a name for the discount to open the discount builder."
+    },
+    "discount-builder": {
+      "tier": "Tier",
+      "tier_by": "by",
+      "tier_if": "if",
+      "tier_allunits": "price of each item",
+      "tier_incremental": "price of additional items",
+      "tier_repeat": "price of next item",
+      "tier_single": "order total",
+      "tier_then": "then",
+      "quantity": "quantity",
+      "total": "total",
+      "reduce": "reduce",
+      "increase": "increase"
+    }
   },
-  "admin-email": {
-    "label": "Send to",
-    "placeholder": "admin@example.com",
+  "emails": {
+    "label": "Emails",
     "helper_text": "",
-    "v8n_required": "Please enter an email"
-  },
-  "customer-email-template-uri": {
-    "label": "Message to customer",
-    "placeholder": "None (don't send)",
-    "helper_text": ""
-  },
-  "gift-recipient-email-template-uri": {
-    "label": "Message to gift recipient",
-    "placeholder": "None (don't send)",
-    "helper_text": ""
+    "wip_message": "We are making changes to our API to support setting email messages for admin and customers from the category. For now, please use the legacy Foxy administration to make changes to category-specific emails for admins and customers.",
+    "gift-recipient-email-template-uri": {
+      "label": "Message to gift recipient",
+      "helper_text": "",
+      "value": "{{ resource.description }}",
+      "value_busy": "Loading...",
+      "value_fail": "Failed to load",
+      "placeholder": "None",
+      "dialog": {
+        "cancel": "Cancel",
+        "close": "Close",
+        "header": "Select an email template",
+        "selection": {
+          "label": "Email templates",
+          "helper_text": "",
+          "pagination": {
+            "search_button_text": "Search",
+            "first": "First",
+            "last": "Last",
+            "next": "Next",
+            "pagination": "{{from}}-{{to}} out of {{total}}",
+            "previous": "Previous",
+            "card": {
+              "type_custom_url": "Custom (URL)",
+              "type_custom_text": "Custom (Text)",
+              "type_custom_html": "Custom (HTML)",
+              "type_mixed": "Mixed",
+              "type_default": "Default",
+              "spinner": {
+                "loading_busy": "Loading",
+                "loading_empty": "No email templates found",
+                "loading_error": "Unknown error"
+              }
+            }
+          }
+        }
+      }
+    }
   },
   "timestamps": {
     "date_created": "Created on",

package/dist/cdn/translations/native-integration-form/en.json

@@ -248,12 +248,6 @@
     "helper_text": "The name of the inventory field in your products collection.",
     "v8n_required": "Please enter an inventory field name."
   },
-  "webflow-auth": {
-    "label": "Token",
-    "placeholder": "Required",
-    "helper_text": "The OAuth2 authorization token for your Webflow site.",
-    "v8n_required": "Please enter an authorization token."
-  },
   "zapier-event": {
     "label": "Event",
     "placeholder": "Defined by Zapier",

package/dist/cdn/translations/store-form/en.json

@@ -253,10 +253,9 @@
   "custom-display-id-config-transaction-journal-entries-void-example": "When voided:",
   "custom-display-id-config-transaction-journal-entries-refund-example": "When refunded:",
   "webhook-url": {
-    "label": "XML webhook endpoint",
-    "placeholder": "https://example.com/xml-webhook",
-    "helper_text": "Foxy will encrypt order info and POST it to this URL on each purchase as XML. When using this webhook, make sure to configure the encryption key for your store.",
-    "v8n_required": "Please enter the XML webhook endpoint",
+    "label": "XML Datafeed",
+    "placeholder": "https://example.com/my-xml-datafeed",
+    "helper_text": "The XML datafeed is a deprecated webhook that should only be used for third-party integrations that still require it. For any new integrations where you need to trigger a webhook for each transaction on your store, we strongly recommend using the JSON webhooks.",
     "v8n_too_long": "Please shorten this URL to 300 characters or less"
   },
   "webhook-key-cart-signing": {

package/dist/cdn/translations/webhook-form/en.json

@@ -3,6 +3,8 @@
     "title_new": "New webhook",
     "title_existing": "Webhook #{{ id }}",
     "subtitle": "",
+    "subtitle_webflow": "Webflow webhook",
+    "subtitle_zapier": "Zapier webhook",
     "subtitle_transaction": "Transaction webhook",
     "subtitle_subscription": "Subscription webhook",
     "subtitle_customer": "Customer webhook",
@@ -26,17 +28,6 @@
     "v8n_required": "Webhook name is required",
     "v8n_too_long": "Webhook name cannot exceed 255 characters"
   },
-  "format": {
-    "label": "Format",
-    "helper_text": "The type of this webhook.",
-    "v8n_required": "Please select a format"
-  },
-  "version": {
-    "label": "Version",
-    "placeholder": "2",
-    "helper_text": "Version of the webhook. Enter 2 for latest or use other if you have specific instructions from Foxy.",
-    "v8n_required": "Version is required"
-  },
   "url": {
     "label": "URL",
     "placeholder": "https://example.com/webhook",
@@ -53,6 +44,7 @@
     "label": "Encryption key",
     "placeholder": "HNL978XVXXCM66DM5N2T78D5MT66BC6D",
     "helper_text": "The JSON webhooks are encrypted in certain situations. This key is also used to generate a signature to verify the integrity of the payload.",
+    "v8n_required": "Encryption key is required. Use the ✨ button to generate a new key.",
     "v8n_too_long": "Encryption key cannot exceed 1000 characters"
   },
   "event-resource": {

package/dist/elements/internal/InternalEditableListControl/InternalEditableListControl.js

@@ -150,7 +150,7 @@ div:has(> select)::after{
             'flex': !this.readonly,
             'hidden': this.readonly,
             'rounded-s border border-contrast-10': isSummaryItem,
-            'mt-s': this._value.length > 0,
+            'mt-s': isSummaryItem && this._value.length > 0,
         })}
           >
             ${this.range

package/dist/elements/internal/InternalEditableListControl/InternalEditableListControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalEditableListControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalEditableListControl/InternalEditableListControl.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,uBAAuB,EAAE,8DAA2D;AAC7F,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,oCAAiC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AACpD,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,IAAI,EAAE,MAAM,0BAA0B,CAAC;AAEhD,MAAM,OAAO,2BAA4B,SAAQ,uBAAuB;IAAxE;;QAsCE,gBAAW,GAA4B,EAAE,CAAC;QAE1C,YAAO,GAAa,EAAE,CAAC;QAEvB,WAAM,GAAyC,IAAI,CAAC;QAEpD,UAAK,GAAW,EAAE,CAAC;QAEnB,UAAK,GAAsB,IAAI,CAAC;QAExB,qBAAgB,GAAG,KAAK,CAAC;QAEzB,cAAS,GAAG,EAAE,CAAC;IAqSzB,CAAC;IAtVC,MAAM,KAAK,UAAU;QACnB,OAAO;YACL,GAAG,KAAK,CAAC,UAAU;YACnB,WAAW,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;YACjC,OAAO,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YACxB,MAAM,EAAE,EAAE;YACV,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;YACtB,KAAK,EAAE,EAAE;YACT,gBAAgB,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;YACtC,SAAS,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;SAChC,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO;YACL,GAAG,KAAK,CAAC,MAAM;YACf,GAAG;;;;;;;;;;;;;;;;OAiBF;SACF,CAAC;IACJ,CAAC;IAgBD,MAAM;;QACJ,MAAM,aAAa,GAAG,IAAI,CAAC,MAAM,KAAK,cAAc,CAAC;QACrD,MAAM,aAAa,GAAG,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;QAEvD,MAAM,iBAAiB,GAAG,QAAQ,CAAC;YACjC,qDAAqD,EAAE,IAAI;YAC3D,0DAA0D,EAAE,IAAI;YAChE,kDAAkD,EAAE,CAAC,IAAI,CAAC,QAAQ;YAClE,8BAA8B,EAAE,IAAI,CAAC,QAAQ;YAC7C,kCAAkC,EAAE,CAAC,IAAI,CAAC,QAAQ;YAClD,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,OAAO,EAAE,CAAC,aAAa;SACxB,CAAC,CAAC;QAEH,MAAM,SAAS,GAAG,QAAQ,CAAC;YACzB,qCAAqC,EAAE,IAAI;YAC3C,gBAAgB,EAAE,IAAI,CAAC,QAAQ;YAC/B,eAAe,EAAE,IAAI,CAAC,QAAQ;YAC9B,gCAAgC,EAAE,CAAC,aAAa,IAAI,aAAa;YACjE,0CAA0C,EAAE,aAAa;YACzD,UAAU,EAAE,CAAC,aAAa;SAC3B,CAAC,CAAC;QAEH,MAAM,mBAAmB,GAAG,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;QAE7D,MAAM,OAAO,GAAG,GAAG,EAAE;;YACnB,MAAM,QAAQ,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC;YAClC,MAAM,IAAI,SAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,0CAAE,KAAK,CAAC;YAE5D,IAAI,CAAC,SAAS;iBACX,KAAK,CAAC,IAAI,CAAC;iBACX,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;iBACxB,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;iBAC/B,OAAO,CAAC,KAAK,CAAC,EAAE;gBACf,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,EAAE;oBAChD,QAAQ,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;iBAChC;YACH,CAAC,CAAC,CAAC;YAEL,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC;YACvB,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC;QACtB,CAAC,CAAC;QAEF,OAAO,IAAI,CAAA;;;kBAGG,QAAQ,CAAC;YACf,yBAAyB,EAAE,IAAI;YAC/B,sCAAsC,EAAE,CAAC,aAAa,IAAI,aAAa;YACvE,eAAe,EAAE,CAAC,aAAa,IAAI,IAAI,CAAC,QAAQ;YAChD,oBAAoB,EAAE,CAAC,aAAa;YACpC,QAAQ,EAAE,aAAa;SACxB,CAAC;;YAEA,IAAI,CAAC,KAAK;;;;kBAIJ,QAAQ,CAAC;YACf,mBAAmB,EAAE,IAAI;YACzB,mCAAmC,EAAE,CAAC,aAAa;YACnD,gCAAgC,EAAE,CAAC,aAAa,IAAI,aAAa;SAClE,CAAC;;;oBAGQ,QAAQ,CAAC;YACf,+BAA+B,EAAE,IAAI;YACrC,6BAA6B,EAAE,CAAC,aAAa;YAC7C,sBAAsB,EAAE,aAAa;SACtC,CAAC;;cAEA,MAAM,CACN,IAAI,CAAC,MAAM,EACX,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAClB,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;;YACd,OAAO,IAAI,CAAA;8BACG,SAAS;+CACQ,MAAA,IAAI,CAAC,KAAK,mCAAI,IAAI,CAAC,KAAK;;;mCAGpC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC;8BACrB,iBAAiB;kCACb,IAAI,CAAC,QAAQ;+BAChB,GAAG,EAAE;gBACZ,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC;YAC1D,CAAC;;;;;iBAKN,CAAC;QACJ,CAAC,CACF;;;;oBAIO,aAAa;YACnB,CAAC,CAAC,EAAE;YACJ,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC;gBAC1B,CAAC,CAAC,wDAAwD;gBAC1D,CAAC,CAAC,oGAAoG;oBAChG,QAAQ,CAAC;YACf,qDAAqD,EAAE,IAAI;YAC3D,kDAAkD,EAAE,CAAC,aAAa;YAClE,2CAA2C,EAAE,CAAC,aAAa,IAAI,aAAa;YAC5E,eAAe,EAAE,CAAC,aAAa,IAAI,IAAI,CAAC,QAAQ;YAChD,MAAM,EAAE,CAAC,IAAI,CAAC,QAAQ;YACtB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,qCAAqC,EAAE,aAAa;YACpD,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC;SAC/B,CAAC;;cAEA,IAAI,CAAC,KAAK;YACV,CAAC,CAAC,IAAI,CAAA;;;;;kCAKc,IAAI,CAAC,WAAW;4BACtB,QAAQ,CAAC;gBACf,mEAAmE,EAAE,IAAI;gBACzE,eAAe,EAAE,IAAI,CAAC,QAAQ;aAC/B,CAAC;;0BAEI,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;6BACrB,IAAI,OAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,mCAAI,EAAE,CAAC;gCACtC,IAAI,CAAC,QAAQ;gCACb,IAAI,CAAC,QAAQ;+BACd,CAAC,GAAkB,EAAE,EAAE,CAAC,GAAG,CAAC,GAAG,KAAK,OAAO,IAAI,OAAO,EAAE;8BACzD,CAAC,GAAU,EAAE,EAAE,CAAC,GAAG,CAAC,eAAe,EAAE;6BACtC,CAAC,GAAe,EAAE,EAAE;;gBAC3B,MAAM,OAAO,GAAI,GAAG,CAAC,aAAkC,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;gBACrE,MAAM,KAAK,SAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,mCAAI,EAAE,CAAC;gBAClD,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,OAAO,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC;YAC5D,CAAC;6BACQ,CAAC,GAAmB,EAAE,EAAE;;gBAC/B,GAAG,CAAC,cAAc,EAAE,CAAC;gBAErB,MAAM,OAAO,eAAG,GAAG,CAAC,aAAa,0CAAE,OAAO,CAAC,MAAM,oCAAK,EAAE,CAAC;gBACzD,MAAM,KAAK,SAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,mCAAI,EAAE,CAAC;gBAClD,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,OAAO,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC;gBAE1D,OAAO,EAAE,CAAC;YACZ,CAAC;4BACO,GAAG,EAAE;gBACX,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;YAC/B,CAAC;;;;;;kCAMa,IAAI,CAAC,WAAW;4BACtB,QAAQ,CAAC;gBACf,mEAAmE,EAAE,IAAI;gBACzE,eAAe,EAAE,IAAI,CAAC,QAAQ;aAC/B,CAAC;;0BAEI,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;6BACrB,IAAI,OAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,mCAAI,EAAE,CAAC;gCACtC,IAAI,CAAC,QAAQ;gCACb,IAAI,CAAC,QAAQ;+BACd,CAAC,GAAkB,EAAE,EAAE,CAAC,GAAG,CAAC,GAAG,KAAK,OAAO,IAAI,OAAO,EAAE;8BACzD,CAAC,GAAU,EAAE,EAAE,CAAC,GAAG,CAAC,eAAe,EAAE;6BACtC,CAAC,GAAe,EAAE,EAAE;;gBAC3B,MAAM,KAAK,GAAI,GAAG,CAAC,aAAkC,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;gBACnE,MAAM,OAAO,SAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,mCAAI,EAAE,CAAC;gBACpD,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC;YAC5D,CAAC;6BACQ,CAAC,GAAmB,EAAE,EAAE;;gBAC/B,GAAG,CAAC,cAAc,EAAE,CAAC;gBAErB,MAAM,KAAK,eAAG,GAAG,CAAC,aAAa,0CAAE,OAAO,CAAC,MAAM,oCAAK,EAAE,CAAC;gBACvD,MAAM,OAAO,SAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,mCAAI,EAAE,CAAC;gBACpD,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC;gBAE1D,OAAO,EAAE,CAAC;YACZ,CAAC;4BACO,GAAG,EAAE;gBACX,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;YAC/B,CAAC;;iBAEJ;YACH,CAAC,CAAC,IAAI,CAAA;;kCAEc,IAAI,CAAC,WAAW;4BACtB,QAAQ,CAAC;gBACf,0EAA0E,EACxE,IAAI;gBACN,eAAe,EAAE,IAAI,CAAC,QAAQ;aAC/B,CAAC;;0BAEI,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC;6BACrB,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC;gCACjB,IAAI,CAAC,QAAQ;gCACb,IAAI,CAAC,QAAQ;+BACd,CAAC,GAAkB,EAAE,EAAE,CAAC,GAAG,CAAC,GAAG,KAAK,OAAO,IAAI,OAAO,EAAE;8BACzD,CAAC,GAAU,EAAE,EAAE,CAAC,GAAG,CAAC,eAAe,EAAE;6BACtC,CAAC,GAAe,EAAE,EAAE;gBAC3B,IAAI,CAAC,SAAS,GAAI,GAAG,CAAC,aAAkC,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;YACxE,CAAC;6BACQ,CAAC,GAAmB,EAAE,EAAE;;gBAC/B,GAAG,CAAC,cAAc,EAAE,CAAC;gBACrB,IAAI,CAAC,SAAS,eAAG,GAAG,CAAC,aAAa,0CAAE,OAAO,CAAC,MAAM,oCAAK,EAAE,CAAC;gBAC1D,OAAO,EAAE,CAAC;YACZ,CAAC;4BACO,GAAG,EAAE;gBACX,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;YAC/B,CAAC;;iBAEJ;;;sBAGK,QAAQ,CAAC;YACf,UAAU,EAAE,IAAI;YAChB,oDAAoD,EAAE,CAAC,IAAI,CAAC,QAAQ;YACpE,eAAe,EAAE,IAAI,CAAC,QAAQ;SAC/B,CAAC;wBACQ,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC;;;;wBAIvB,QAAQ,CAAC;YACf,wCAAwC,EAAE,IAAI;YAC9C,mEAAmE,EAAE,IAAI;YACzE,oCAAoC,EAAE,CAAC,IAAI,CAAC,QAAQ;SACrD,CAAC;4BACU,IAAI,CAAC,QAAQ;;kBAEvB,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;YACpC,OAAO,IAAI,CAAA,iBAAiB,KAAK,IAAI,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,KAAK,WAAW,CAAC;QACjE,CAAC,CAAC;;;;;gBAKF,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;YACtC,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC;gBAAE,OAAO;YAC3D,OAAO,IAAI,CAAA,iBAAiB,KAAK,IAAI,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,KAAK,WAAW,CAAC;QACjE,CAAC,CAAC;;;iDAGiC,CAAC,IAAI,CAAC,SAAS;;6BAEnC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC;wBACrB,QAAQ,CAAC;YACf,uEAAuE,EAAE,IAAI;YAC7E,8DAA8D,EAAE,IAAI;YACpE,4CAA4C,EAAE,mBAAmB;YACjE,wCAAwC,EAAE,CAAC,mBAAmB;YAC9D,8CAA8C,EAAE,CAAC,mBAAmB;YACpE,cAAc,EAAE,CAAC,mBAAmB;SACrC,CAAC;4BACU,mBAAmB;yBACtB,OAAO;;;;;;;;;kBASd,QAAQ,CAAC;YACf,iCAAiC,EAAE,IAAI;YACvC,sCAAsC,EAAE,CAAC,aAAa,IAAI,aAAa;YACvE,eAAe,EAAE,CAAC,aAAa,IAAI,IAAI,CAAC,QAAQ;YAChD,gBAAgB,EAAE,aAAa;SAChC,CAAC;oBACQ,CAAC,IAAI,CAAC,UAAU;;YAExB,IAAI,CAAC,UAAU;;;;;oBAKP,CAAC,IAAI,CAAC,gBAAgB,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ;;YAEvF,IAAI,CAAC,aAAa;;;KAGzB,CAAC;IACJ,CAAC;IAED,IAAc,MAAM;;QAClB,OAAO,OAAC,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAW,CAAC;IACxC,CAAC;IAED,IAAc,MAAM,CAAC,QAAgB;QACnC,KAAK,CAAC,MAAM,GAAG,QAAQ,CAAC;IAC1B,CAAC;CACF","sourcesContent":["import type { CSSResultArray, PropertyDeclarations, TemplateResult } from 'lit-element';\nimport type { Item, Option, Unit } from './types';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { html, css } from 'lit-element';\nimport { classMap } from '../../../utils/class-map';\nimport { repeat } from 'lit-html/directives/repeat';\nimport { spread } from '@open-wc/lit-helpers';\nimport { live } from 'lit-html/directives/live';\n\nexport class InternalEditableListControl extends InternalEditableControl {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      inputParams: { attribute: false },\n      options: { type: Array },\n      layout: {},\n      units: { type: Array },\n      range: {},\n      __isErrorVisible: { attribute: false },\n      __newItem: { attribute: false },\n    };\n  }\n\n  static get styles(): CSSResultArray {\n    return [\n      ...super.styles,\n      css`\n        div:has(> select) {\n          position: relative;\n        }\n\n        div:has(> select)::after {\n          content: ' ';\n          position: absolute;\n          top: 50%;\n          margin-top: -2px;\n          right: 10px;\n          width: 0;\n          height: 0;\n          border-left: 5px solid transparent;\n          border-right: 5px solid transparent;\n          border-top: 5px solid currentColor;\n        }\n      `,\n    ];\n  }\n\n  inputParams: Record<string, unknown> = {};\n\n  options: Option[] = [];\n\n  layout: 'standalone' | 'summary-item' | null = null;\n\n  units: Unit[] = [];\n\n  range: null | 'optional' = null;\n\n  private __isErrorVisible = false;\n\n  private __newItem = '';\n\n  render(): TemplateResult {\n    const isSummaryItem = this.layout === 'summary-item';\n    const isInteractive = !this.disabled && !this.readonly;\n\n    const deleteButtonClass = classMap({\n      'w-xs h-xs rounded-s transition-colors flex-shrink-0': true,\n      'focus-outline-none focus-ring-2 ring-inset ring-error-50': true,\n      'text-tertiary hover-bg-error-10 hover-text-error': !this.disabled,\n      'cursor-default text-disabled': this.disabled,\n      'flex items-center justify-center': !this.readonly,\n      'hidden': this.readonly,\n      'mr-xs': !isSummaryItem,\n    });\n\n    const itemClass = classMap({\n      'transition-colors flex items-center': true,\n      'text-secondary': this.readonly,\n      'text-disabled': this.disabled,\n      'group-hover-divide-contrast-20': !isSummaryItem && isInteractive,\n      'pl-s border border-contrast-10 rounded-s': isSummaryItem,\n      'ml-s h-m': !isSummaryItem,\n    });\n\n    const isAddButtonDisabled = this.disabled || !this.__newItem;\n\n    const addItem = () => {\n      const newValue = [...this._value];\n      const unit = this.renderRoot.querySelector('select')?.value;\n\n      this.__newItem\n        .split('\\n')\n        .map(code => code.trim())\n        .filter(code => code.length > 0)\n        .forEach(value => {\n          if (!newValue.some(item => item.value === value)) {\n            newValue.push({ value, unit });\n          }\n        });\n\n      this._value = newValue;\n      this.__newItem = '';\n    };\n\n    return html`\n      <div class=\"group\">\n        <div\n          class=${classMap({\n            'transition-colors mb-xs': true,\n            'text-secondary group-hover-text-body': !isSummaryItem && isInteractive,\n            'text-disabled': !isSummaryItem && this.disabled,\n            'font-medium text-s': !isSummaryItem,\n            'text-m': isSummaryItem,\n          })}\n        >\n          ${this.label}\n        </div>\n\n        <div\n          class=${classMap({\n            'transition-colors': true,\n            'border border-contrast-10 rounded': !isSummaryItem,\n            'group-hover-border-contrast-20': !isSummaryItem && isInteractive,\n          })}\n        >\n          <ol\n            class=${classMap({\n              'transition-colors font-medium': true,\n              'divide-y divide-contrast-10': !isSummaryItem,\n              'flex flex-wrap gap-s': isSummaryItem,\n            })}\n          >\n            ${repeat(\n              this._value,\n              item => item.value,\n              (item, index) => {\n                return html`\n                  <li class=${itemClass}>\n                    <div class=\"flex-1 mr-s\">${item.label ?? item.value}</div>\n\n                    <button\n                      aria-label=${this.t('delete')}\n                      class=${deleteButtonClass}\n                      ?disabled=${this.disabled}\n                      @click=${() => {\n                        this._value = this._value.filter((_, i) => i !== index);\n                      }}\n                    >\n                      <iron-icon icon=\"lumo:cross\" class=\"icon-inline text-xl\"></iron-icon>\n                    </button>\n                  </li>\n                `;\n              }\n            )}\n          </ol>\n\n          <div\n            style=${isSummaryItem\n              ? ''\n              : this._value.length === 0\n              ? 'border-radius: calc(var(--lumo-border-radius-m) - 1px)'\n              : 'border-radius: 0 0 calc(var(--lumo-border-radius-m) - 1px) calc(var(--lumo-border-radius-m) - 1px)'}\n            class=${classMap({\n              'transition-colors pl-s h-m flex items-center gap-xs': true,\n              'focus-within-ring-2 focus-within-ring-primary-50': !isSummaryItem,\n              'bg-contrast-10 group-hover-bg-contrast-20': !isSummaryItem && isInteractive,\n              'bg-contrast-5': !isSummaryItem && this.disabled,\n              'flex': !this.readonly,\n              'hidden': this.readonly,\n              'rounded-s border border-contrast-10': isSummaryItem,\n              'mt-s': this._value.length > 0,\n            })}\n          >\n            ${this.range\n              ? html`\n                  <foxy-i18n infer=\"\" class=\"text-disabled font-medium\" key=\"range_from\">\n                  </foxy-i18n>\n\n                  <input\n                    placeholder=${this.placeholder}\n                    class=${classMap({\n                      'bg-transparent appearance-none h-m font-medium focus-outline-none': true,\n                      'text-disabled': this.disabled,\n                    })}\n                    list=\"list\"\n                    ...=${spread(this.inputParams)}\n                    .value=${live(this.__newItem.split('..')[0] ?? '')}\n                    ?disabled=${this.disabled}\n                    ?readonly=${this.readonly}\n                    @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && addItem()}\n                    @change=${(evt: Event) => evt.stopPropagation()}\n                    @input=${(evt: InputEvent) => {\n                      const newFrom = (evt.currentTarget as HTMLInputElement).value.trim();\n                      const oldTo = this.__newItem.split('..')[1] ?? '';\n                      this.__newItem = oldTo ? `${newFrom}..${oldTo}` : newFrom;\n                    }}\n                    @paste=${(evt: ClipboardEvent) => {\n                      evt.preventDefault();\n\n                      const newFrom = evt.clipboardData?.getData('text') ?? '';\n                      const oldTo = this.__newItem.split('..')[1] ?? '';\n                      this.__newItem = oldTo ? `${newFrom}..${oldTo}` : newFrom;\n\n                      addItem();\n                    }}\n                    @blur=${() => {\n                      this.__isErrorVisible = true;\n                    }}\n                  />\n\n                  <foxy-i18n infer=\"\" class=\"text-disabled font-medium\" key=\"range_to\"></foxy-i18n>\n\n                  <input\n                    placeholder=${this.placeholder}\n                    class=${classMap({\n                      'bg-transparent appearance-none h-m font-medium focus-outline-none': true,\n                      'text-disabled': this.disabled,\n                    })}\n                    list=\"list\"\n                    ...=${spread(this.inputParams)}\n                    .value=${live(this.__newItem.split('..')[1] ?? '')}\n                    ?disabled=${this.disabled}\n                    ?readonly=${this.readonly}\n                    @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && addItem()}\n                    @change=${(evt: Event) => evt.stopPropagation()}\n                    @input=${(evt: InputEvent) => {\n                      const newTo = (evt.currentTarget as HTMLInputElement).value.trim();\n                      const oldFrom = this.__newItem.split('..')[0] ?? '';\n                      this.__newItem = oldFrom ? `${oldFrom}..${newTo}` : newTo;\n                    }}\n                    @paste=${(evt: ClipboardEvent) => {\n                      evt.preventDefault();\n\n                      const newTo = evt.clipboardData?.getData('text') ?? '';\n                      const oldFrom = this.__newItem.split('..')[0] ?? '';\n                      this.__newItem = oldFrom ? `${oldFrom}..${newTo}` : newTo;\n\n                      addItem();\n                    }}\n                    @blur=${() => {\n                      this.__isErrorVisible = true;\n                    }}\n                  />\n                `\n              : html`\n                  <input\n                    placeholder=${this.placeholder}\n                    class=${classMap({\n                      'w-full bg-transparent appearance-none h-m font-medium focus-outline-none':\n                        true,\n                      'text-disabled': this.disabled,\n                    })}\n                    list=\"list\"\n                    ...=${spread(this.inputParams)}\n                    .value=${live(this.__newItem)}\n                    ?disabled=${this.disabled}\n                    ?readonly=${this.readonly}\n                    @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && addItem()}\n                    @change=${(evt: Event) => evt.stopPropagation()}\n                    @input=${(evt: InputEvent) => {\n                      this.__newItem = (evt.currentTarget as HTMLInputElement).value.trim();\n                    }}\n                    @paste=${(evt: ClipboardEvent) => {\n                      evt.preventDefault();\n                      this.__newItem = evt.clipboardData?.getData('text') ?? '';\n                      addItem();\n                    }}\n                    @blur=${() => {\n                      this.__isErrorVisible = true;\n                    }}\n                  />\n                `}\n\n            <div\n              class=${classMap({\n                'relative': true,\n                'hover-text-base focus-within-text-primary-contrast': !this.disabled,\n                'text-disabled': this.disabled,\n              })}\n              ?hidden=${this.units.length === 0}\n            >\n              <select\n                style=\"min-width: 8rem\"\n                class=${classMap({\n                  'transition-colors rounded-s mx-xs px-s': true,\n                  'bg-contrast-5 appearance-none h-xs font-medium focus-outline-none': true,\n                  'hover-bg-contrast focus-bg-primary': !this.disabled,\n                })}\n                ?disabled=${this.disabled}\n              >\n                ${this.units.map(({ label, value }) => {\n                  return html`<option value=${value}>${label ?? value}</option>`;\n                })}\n              </select>\n            </div>\n\n            <datalist id=\"list\">\n              ${this.options.map(({ label, value }) => {\n                if (this._value.some(item => item.value === value)) return;\n                return html`<option value=${value}>${label ?? value}</option>`;\n              })}\n            </datalist>\n\n            <div class=\"mr-xs ml-auto\" ?hidden=${!this.__newItem}>\n              <button\n                aria-label=${this.t('submit')}\n                class=${classMap({\n                  'w-xs h-xs flex-shrink-0 ring-inset ring-success-50 focus-outline-none': true,\n                  'flex items-center justify-center rounded-s transition-colors': true,\n                  'bg-contrast-5 text-disabled cursor-default': isAddButtonDisabled,\n                  'bg-contrast-5 text-body cursor-pointer': !isAddButtonDisabled,\n                  'hover-bg-success hover-text-success-contrast': !isAddButtonDisabled,\n                  'focus-ring-2': !isAddButtonDisabled,\n                })}\n                ?disabled=${isAddButtonDisabled}\n                @click=${addItem}\n              >\n                <iron-icon icon=\"lumo:plus\" class=\"icon-inline text-l\"></iron-icon>\n              </button>\n            </div>\n          </div>\n        </div>\n\n        <div\n          class=${classMap({\n            'transition-colors text-xs mt-xs': true,\n            'text-secondary group-hover-text-body': !isSummaryItem && isInteractive,\n            'text-disabled': !isSummaryItem && this.disabled,\n            'text-secondary': isSummaryItem,\n          })}\n          ?hidden=${!this.helperText}\n        >\n          ${this.helperText}\n        </div>\n\n        <div\n          class=\"mt-xs text-xs leading-xs text-error\"\n          ?hidden=${!this.__isErrorVisible || !this._errorMessage || this.disabled || this.readonly}\n        >\n          ${this._errorMessage}\n        </div>\n      </div>\n    `;\n  }\n\n  protected get _value(): Item[] {\n    return (super._value ?? []) as Item[];\n  }\n\n  protected set _value(newValue: Item[]) {\n    super._value = newValue;\n  }\n}\n"]}
+{"version":3,"file":"InternalEditableListControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalEditableListControl/InternalEditableListControl.ts"],"names":[],"mappings":"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","sourcesContent":["import type { CSSResultArray, PropertyDeclarations, TemplateResult } from 'lit-element';\nimport type { Item, Option, Unit } from './types';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { html, css } from 'lit-element';\nimport { classMap } from '../../../utils/class-map';\nimport { repeat } from 'lit-html/directives/repeat';\nimport { spread } from '@open-wc/lit-helpers';\nimport { live } from 'lit-html/directives/live';\n\nexport class InternalEditableListControl extends InternalEditableControl {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      inputParams: { attribute: false },\n      options: { type: Array },\n      layout: {},\n      units: { type: Array },\n      range: {},\n      __isErrorVisible: { attribute: false },\n      __newItem: { attribute: false },\n    };\n  }\n\n  static get styles(): CSSResultArray {\n    return [\n      ...super.styles,\n      css`\n        div:has(> select) {\n          position: relative;\n        }\n\n        div:has(> select)::after {\n          content: ' ';\n          position: absolute;\n          top: 50%;\n          margin-top: -2px;\n          right: 10px;\n          width: 0;\n          height: 0;\n          border-left: 5px solid transparent;\n          border-right: 5px solid transparent;\n          border-top: 5px solid currentColor;\n        }\n      `,\n    ];\n  }\n\n  inputParams: Record<string, unknown> = {};\n\n  options: Option[] = [];\n\n  layout: 'standalone' | 'summary-item' | null = null;\n\n  units: Unit[] = [];\n\n  range: null | 'optional' = null;\n\n  private __isErrorVisible = false;\n\n  private __newItem = '';\n\n  render(): TemplateResult {\n    const isSummaryItem = this.layout === 'summary-item';\n    const isInteractive = !this.disabled && !this.readonly;\n\n    const deleteButtonClass = classMap({\n      'w-xs h-xs rounded-s transition-colors flex-shrink-0': true,\n      'focus-outline-none focus-ring-2 ring-inset ring-error-50': true,\n      'text-tertiary hover-bg-error-10 hover-text-error': !this.disabled,\n      'cursor-default text-disabled': this.disabled,\n      'flex items-center justify-center': !this.readonly,\n      'hidden': this.readonly,\n      'mr-xs': !isSummaryItem,\n    });\n\n    const itemClass = classMap({\n      'transition-colors flex items-center': true,\n      'text-secondary': this.readonly,\n      'text-disabled': this.disabled,\n      'group-hover-divide-contrast-20': !isSummaryItem && isInteractive,\n      'pl-s border border-contrast-10 rounded-s': isSummaryItem,\n      'ml-s h-m': !isSummaryItem,\n    });\n\n    const isAddButtonDisabled = this.disabled || !this.__newItem;\n\n    const addItem = () => {\n      const newValue = [...this._value];\n      const unit = this.renderRoot.querySelector('select')?.value;\n\n      this.__newItem\n        .split('\\n')\n        .map(code => code.trim())\n        .filter(code => code.length > 0)\n        .forEach(value => {\n          if (!newValue.some(item => item.value === value)) {\n            newValue.push({ value, unit });\n          }\n        });\n\n      this._value = newValue;\n      this.__newItem = '';\n    };\n\n    return html`\n      <div class=\"group\">\n        <div\n          class=${classMap({\n            'transition-colors mb-xs': true,\n            'text-secondary group-hover-text-body': !isSummaryItem && isInteractive,\n            'text-disabled': !isSummaryItem && this.disabled,\n            'font-medium text-s': !isSummaryItem,\n            'text-m': isSummaryItem,\n          })}\n        >\n          ${this.label}\n        </div>\n\n        <div\n          class=${classMap({\n            'transition-colors': true,\n            'border border-contrast-10 rounded': !isSummaryItem,\n            'group-hover-border-contrast-20': !isSummaryItem && isInteractive,\n          })}\n        >\n          <ol\n            class=${classMap({\n              'transition-colors font-medium': true,\n              'divide-y divide-contrast-10': !isSummaryItem,\n              'flex flex-wrap gap-s': isSummaryItem,\n            })}\n          >\n            ${repeat(\n              this._value,\n              item => item.value,\n              (item, index) => {\n                return html`\n                  <li class=${itemClass}>\n                    <div class=\"flex-1 mr-s\">${item.label ?? item.value}</div>\n\n                    <button\n                      aria-label=${this.t('delete')}\n                      class=${deleteButtonClass}\n                      ?disabled=${this.disabled}\n                      @click=${() => {\n                        this._value = this._value.filter((_, i) => i !== index);\n                      }}\n                    >\n                      <iron-icon icon=\"lumo:cross\" class=\"icon-inline text-xl\"></iron-icon>\n                    </button>\n                  </li>\n                `;\n              }\n            )}\n          </ol>\n\n          <div\n            style=${isSummaryItem\n              ? ''\n              : this._value.length === 0\n              ? 'border-radius: calc(var(--lumo-border-radius-m) - 1px)'\n              : 'border-radius: 0 0 calc(var(--lumo-border-radius-m) - 1px) calc(var(--lumo-border-radius-m) - 1px)'}\n            class=${classMap({\n              'transition-colors pl-s h-m flex items-center gap-xs': true,\n              'focus-within-ring-2 focus-within-ring-primary-50': !isSummaryItem,\n              'bg-contrast-10 group-hover-bg-contrast-20': !isSummaryItem && isInteractive,\n              'bg-contrast-5': !isSummaryItem && this.disabled,\n              'flex': !this.readonly,\n              'hidden': this.readonly,\n              'rounded-s border border-contrast-10': isSummaryItem,\n              'mt-s': isSummaryItem && this._value.length > 0,\n            })}\n          >\n            ${this.range\n              ? html`\n                  <foxy-i18n infer=\"\" class=\"text-disabled font-medium\" key=\"range_from\">\n                  </foxy-i18n>\n\n                  <input\n                    placeholder=${this.placeholder}\n                    class=${classMap({\n                      'bg-transparent appearance-none h-m font-medium focus-outline-none': true,\n                      'text-disabled': this.disabled,\n                    })}\n                    list=\"list\"\n                    ...=${spread(this.inputParams)}\n                    .value=${live(this.__newItem.split('..')[0] ?? '')}\n                    ?disabled=${this.disabled}\n                    ?readonly=${this.readonly}\n                    @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && addItem()}\n                    @change=${(evt: Event) => evt.stopPropagation()}\n                    @input=${(evt: InputEvent) => {\n                      const newFrom = (evt.currentTarget as HTMLInputElement).value.trim();\n                      const oldTo = this.__newItem.split('..')[1] ?? '';\n                      this.__newItem = oldTo ? `${newFrom}..${oldTo}` : newFrom;\n                    }}\n                    @paste=${(evt: ClipboardEvent) => {\n                      evt.preventDefault();\n\n                      const newFrom = evt.clipboardData?.getData('text') ?? '';\n                      const oldTo = this.__newItem.split('..')[1] ?? '';\n                      this.__newItem = oldTo ? `${newFrom}..${oldTo}` : newFrom;\n\n                      addItem();\n                    }}\n                    @blur=${() => {\n                      this.__isErrorVisible = true;\n                    }}\n                  />\n\n                  <foxy-i18n infer=\"\" class=\"text-disabled font-medium\" key=\"range_to\"></foxy-i18n>\n\n                  <input\n                    placeholder=${this.placeholder}\n                    class=${classMap({\n                      'bg-transparent appearance-none h-m font-medium focus-outline-none': true,\n                      'text-disabled': this.disabled,\n                    })}\n                    list=\"list\"\n                    ...=${spread(this.inputParams)}\n                    .value=${live(this.__newItem.split('..')[1] ?? '')}\n                    ?disabled=${this.disabled}\n                    ?readonly=${this.readonly}\n                    @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && addItem()}\n                    @change=${(evt: Event) => evt.stopPropagation()}\n                    @input=${(evt: InputEvent) => {\n                      const newTo = (evt.currentTarget as HTMLInputElement).value.trim();\n                      const oldFrom = this.__newItem.split('..')[0] ?? '';\n                      this.__newItem = oldFrom ? `${oldFrom}..${newTo}` : newTo;\n                    }}\n                    @paste=${(evt: ClipboardEvent) => {\n                      evt.preventDefault();\n\n                      const newTo = evt.clipboardData?.getData('text') ?? '';\n                      const oldFrom = this.__newItem.split('..')[0] ?? '';\n                      this.__newItem = oldFrom ? `${oldFrom}..${newTo}` : newTo;\n\n                      addItem();\n                    }}\n                    @blur=${() => {\n                      this.__isErrorVisible = true;\n                    }}\n                  />\n                `\n              : html`\n                  <input\n                    placeholder=${this.placeholder}\n                    class=${classMap({\n                      'w-full bg-transparent appearance-none h-m font-medium focus-outline-none':\n                        true,\n                      'text-disabled': this.disabled,\n                    })}\n                    list=\"list\"\n                    ...=${spread(this.inputParams)}\n                    .value=${live(this.__newItem)}\n                    ?disabled=${this.disabled}\n                    ?readonly=${this.readonly}\n                    @keydown=${(evt: KeyboardEvent) => evt.key === 'Enter' && addItem()}\n                    @change=${(evt: Event) => evt.stopPropagation()}\n                    @input=${(evt: InputEvent) => {\n                      this.__newItem = (evt.currentTarget as HTMLInputElement).value.trim();\n                    }}\n                    @paste=${(evt: ClipboardEvent) => {\n                      evt.preventDefault();\n                      this.__newItem = evt.clipboardData?.getData('text') ?? '';\n                      addItem();\n                    }}\n                    @blur=${() => {\n                      this.__isErrorVisible = true;\n                    }}\n                  />\n                `}\n\n            <div\n              class=${classMap({\n                'relative': true,\n                'hover-text-base focus-within-text-primary-contrast': !this.disabled,\n                'text-disabled': this.disabled,\n              })}\n              ?hidden=${this.units.length === 0}\n            >\n              <select\n                style=\"min-width: 8rem\"\n                class=${classMap({\n                  'transition-colors rounded-s mx-xs px-s': true,\n                  'bg-contrast-5 appearance-none h-xs font-medium focus-outline-none': true,\n                  'hover-bg-contrast focus-bg-primary': !this.disabled,\n                })}\n                ?disabled=${this.disabled}\n              >\n                ${this.units.map(({ label, value }) => {\n                  return html`<option value=${value}>${label ?? value}</option>`;\n                })}\n              </select>\n            </div>\n\n            <datalist id=\"list\">\n              ${this.options.map(({ label, value }) => {\n                if (this._value.some(item => item.value === value)) return;\n                return html`<option value=${value}>${label ?? value}</option>`;\n              })}\n            </datalist>\n\n            <div class=\"mr-xs ml-auto\" ?hidden=${!this.__newItem}>\n              <button\n                aria-label=${this.t('submit')}\n                class=${classMap({\n                  'w-xs h-xs flex-shrink-0 ring-inset ring-success-50 focus-outline-none': true,\n                  'flex items-center justify-center rounded-s transition-colors': true,\n                  'bg-contrast-5 text-disabled cursor-default': isAddButtonDisabled,\n                  'bg-contrast-5 text-body cursor-pointer': !isAddButtonDisabled,\n                  'hover-bg-success hover-text-success-contrast': !isAddButtonDisabled,\n                  'focus-ring-2': !isAddButtonDisabled,\n                })}\n                ?disabled=${isAddButtonDisabled}\n                @click=${addItem}\n              >\n                <iron-icon icon=\"lumo:plus\" class=\"icon-inline text-l\"></iron-icon>\n              </button>\n            </div>\n          </div>\n        </div>\n\n        <div\n          class=${classMap({\n            'transition-colors text-xs mt-xs': true,\n            'text-secondary group-hover-text-body': !isSummaryItem && isInteractive,\n            'text-disabled': !isSummaryItem && this.disabled,\n            'text-secondary': isSummaryItem,\n          })}\n          ?hidden=${!this.helperText}\n        >\n          ${this.helperText}\n        </div>\n\n        <div\n          class=\"mt-xs text-xs leading-xs text-error\"\n          ?hidden=${!this.__isErrorVisible || !this._errorMessage || this.disabled || this.readonly}\n        >\n          ${this._errorMessage}\n        </div>\n      </div>\n    `;\n  }\n\n  protected get _value(): Item[] {\n    return (super._value ?? []) as Item[];\n  }\n\n  protected set _value(newValue: Item[]) {\n    super._value = newValue;\n  }\n}\n"]}

package/dist/elements/internal/InternalNumberControl/InternalNumberControl.d.ts

@@ -12,8 +12,11 @@ export declare class InternalNumberControl extends InternalEditableControl {
     layout: 'summary-item' | 'standalone' | null;
     prefix: string | null;
     suffix: string | null;
+    step: number | null;
     min: number | null;
     max: number | null;
+    private __isErrorVisible;
+    reportValidity(): void;
     renderControl(): TemplateResult;
     private __renderSummaryItemLayout;
 }

package/dist/elements/internal/InternalNumberControl/InternalNumberControl.js

@@ -14,8 +14,10 @@ export class InternalNumberControl extends InternalEditableControl {
         this.layout = null;
         this.prefix = null;
         this.suffix = null;
+        this.step = null;
         this.min = null;
         this.max = null;
+        this.__isErrorVisible = false;
     }
     static get properties() {
         return {
@@ -23,8 +25,10 @@ export class InternalNumberControl extends InternalEditableControl {
             layout: {},
             prefix: {},
             suffix: {},
+            step: { type: Number },
             min: { type: Number },
             max: { type: Number },
+            __isErrorVisible: { attribute: false },
         };
     }
     static get styles() {
@@ -50,8 +54,12 @@ input{
       `,
         ];
     }
+    reportValidity() {
+        this.__isErrorVisible = true;
+        super.reportValidity();
+    }
     renderControl() {
-        var _a, _b;
+        var _a, _b, _c;
         if (this.layout === 'summary-item')
             return this.__renderSummaryItemLayout();
         return html `
@@ -61,8 +69,9 @@ input{
         helper-text=${this.helperText}
         label=${this.label}
         class="w-full"
-        min=${ifDefined((_a = this.min) !== null && _a !== void 0 ? _a : undefined)}
-        max=${ifDefined((_b = this.max) !== null && _b !== void 0 ? _b : undefined)}
+        step=${ifDefined((_a = this.step) !== null && _a !== void 0 ? _a : undefined)}
+        min=${ifDefined((_b = this.min) !== null && _b !== void 0 ? _b : undefined)}
+        max=${ifDefined((_c = this.max) !== null && _c !== void 0 ? _c : undefined)}
         ?disabled=${this.disabled}
         ?readonly=${this.readonly}
         .checkValidity=${this._checkValidity}
@@ -80,7 +89,7 @@ input{
     `;
     }
     __renderSummaryItemLayout() {
-        var _a, _b;
+        var _a, _b, _c;
         const sharedTextStyles = {
             'text-disabled': this.disabled,
             'text-tertiary': !this.readonly && !this.disabled,
@@ -91,7 +100,10 @@ input{
         <div>
           <label class="text-m text-body" for="input">${this.label}</label>
           <p class="text-xs text-secondary">${this.helperText}</p>
-          <p class="text-xs text-error" ?hidden=${this.disabled || this.readonly}>
+          <p
+            class="text-xs text-error"
+            ?hidden=${!this.__isErrorVisible || this.disabled || this.readonly}
+          >
             ${this._errorMessage}
           </p>
         </div>
@@ -112,16 +124,19 @@ input{
             'font-medium': !this.readonly,
         })}
             type="number"
-            min=${ifDefined((_a = this.min) !== null && _a !== void 0 ? _a : void 0)}
-            max=${ifDefined((_b = this.max) !== null && _b !== void 0 ? _b : void 0)}
+            step=${ifDefined((_a = this.step) !== null && _a !== void 0 ? _a : void 0)}
+            min=${ifDefined((_b = this.min) !== null && _b !== void 0 ? _b : void 0)}
+            max=${ifDefined((_c = this.max) !== null && _c !== void 0 ? _c : void 0)}
             id="input"
             .value=${this._value === 0 ? '' : this._value}
             ?disabled=${this.disabled}
             ?readonly=${this.readonly}
             @keydown=${(evt) => { var _a; return evt.key === 'Enter' && ((_a = this.nucleon) === null || _a === void 0 ? void 0 : _a.submit()); }}
+            @blur=${() => (this.__isErrorVisible = true)}
             @input=${(evt) => {
             evt.stopPropagation();
-            this._value = evt.target.value;
+            const newValue = parseFloat(evt.target.value);
+            this._value = isNaN(newValue) ? 0 : newValue;
         }}
           />