@lumiastream/ui 0.3.5 → 0.3.8

package/dist/se-import.js

@@ -1527,7 +1527,11 @@ var SOURCE_TO_LUMIA_FIELD_TYPE = {
   // SE-side trigger buttons → native action button.
   button: "actionbutton"
 };
-var RESERVED_FIELD_KEYS = /* @__PURE__ */ new Set(["widgetName", "widgetAuthor", "widgetDuration"]);
+var RESERVED_FIELD_KEYS = /* @__PURE__ */ new Set([
+  "widgetName",
+  "widgetAuthor",
+  "widgetDuration"
+]);
 function translateConfigs(sourceFields) {
   if (!sourceFields) return [];
   return Object.entries(sourceFields).filter(([key]) => !RESERVED_FIELD_KEYS.has(key)).map(([key, f]) => {
@@ -1544,6 +1548,20 @@ function translateConfigs(sourceFields) {
       options: f.options
     };
     if (sourceType === "hidden") base.hidden = true;
+    if (sourceType === "slider") {
+      const sliderOptions = { ...f.options ?? {} };
+      if (f.min != null && sliderOptions.min == null)
+        sliderOptions.min = f.min;
+      if (f.max != null && sliderOptions.max == null)
+        sliderOptions.max = f.max;
+      if (f.step != null && sliderOptions.step == null)
+        sliderOptions.step = f.step;
+      if (f.prefix != null && sliderOptions.prefix == null)
+        sliderOptions.prefix = f.prefix;
+      if (f.suffix != null && sliderOptions.suffix == null)
+        sliderOptions.suffix = f.suffix;
+      base.options = sliderOptions;
+    }
     return base;
   });
 }
@@ -1562,28 +1580,33 @@ function mapCustom(widget, ctx) {
   const fieldData = parse(v.fieldData) ?? v.fieldData;
   const widgetProvider = widget.provider;
   const provider = widgetProvider === "kick" || widgetProvider === "youtube" || widgetProvider === "twitch" ? widgetProvider : ctx?.provider ?? "twitch";
-  return buildUnit(widget, "custom", {
-    content: {
-      // SE widget ids are integers unique only within a single SE overlay
-      // (1, 2, 3…). Using them as Lumia codeIds would collide across
-      // imports — codeId is the scoping key for variables, storage, and
-      // event listeners. Mint a fresh nanoid so every imported widget
-      // has its own scope.
-      codeId: nanoid2(),
-      html: v.html ?? "",
-      css: v.css ?? "",
-      js: v.js ?? "",
-      configs: translateConfigs(fields),
-      data: fieldData ?? {},
-      flavor: "streamelements",
-      // Native field on the Custom module content. The compatibility
-      // shim in Embed.tsx reads this to pick the right listener-name
-      // mapping table when forwarding Lumia events into the iframe as
-      // `onEventReceived` payloads. Default 'twitch' matches the shim's
-      // historical default so legacy imports keep working.
-      sourceProvider: provider
-    }
-  }, ctx);
+  return buildUnit(
+    widget,
+    "custom",
+    {
+      content: {
+        // SE widget ids are integers unique only within a single SE overlay
+        // (1, 2, 3…). Using them as Lumia codeIds would collide across
+        // imports — codeId is the scoping key for variables, storage, and
+        // event listeners. Mint a fresh nanoid so every imported widget
+        // has its own scope.
+        codeId: nanoid2(),
+        html: v.html ?? "",
+        css: v.css ?? "",
+        js: v.js ?? "",
+        configs: translateConfigs(fields),
+        data: fieldData ?? {},
+        flavor: "streamelements",
+        // Native field on the Custom module content. The compatibility
+        // shim in Embed.tsx reads this to pick the right listener-name
+        // mapping table when forwarding Lumia events into the iframe as
+        // `onEventReceived` payloads. Default 'twitch' matches the shim's
+        // historical default so legacy imports keep working.
+        sourceProvider: provider
+      }
+    },
+    ctx
+  );
 }
 
 // src/se-import/mappers/misc.ts
@@ -4846,7 +4869,7 @@ var humanizeVariableName = (rawName) => {
 };
 var getVariableColorClass = (variableType, isSuggested) => {
   if (isSuggested && variableType !== "func")
-    return "ls-variable-token--custom";
+    return "ls-variable-token--suggested";
   if (variableType === "func") return "ls-variable-token--function";
   if (variableType === "system") return "ls-variable-token--system";
   return "ls-variable-token--custom";
@@ -4941,24 +4964,27 @@ var LSVariableInputField = forwardRef5((props, ref) => {
   const [autoExpandPaths, setAutoExpandPaths] = useState4(
     () => /* @__PURE__ */ new Set()
   );
+  const shouldRenderPicker = !hideVariables && showVariables;
   const systemVariableValueTrees = useMemo3(() => {
     const map = /* @__PURE__ */ new Map();
+    if (!shouldRenderPicker) return map;
     Object.values(variableRecords).forEach((variable) => {
       if (variable && isExpandableValue(variable.value)) {
         map.set(variable.name, buildValueChildren(variable.value, "", 0));
       }
     });
     return map;
-  }, [variableRecords]);
+  }, [shouldRenderPicker, variableRecords]);
   const allowedExampleTrees = useMemo3(() => {
     const map = /* @__PURE__ */ new Map();
+    if (!shouldRenderPicker) return map;
     allowedVariableDefinitions.forEach((definition) => {
       if (isExpandableValue(definition.example)) {
         map.set(definition.name, buildValueChildren(definition.example, "", 0));
       }
     });
     return map;
-  }, [allowedVariableDefinitions]);
+  }, [allowedVariableDefinitions, shouldRenderPicker]);
   useEffect4(() => {
     requestTranslations?.();
   }, [requestTranslations]);
@@ -5174,6 +5200,9 @@ var LSVariableInputField = forwardRef5((props, ref) => {
     [allowedExampleTrees, getAllowedVariableRecord, systemVariableValueTrees]
   );
   useEffect4(() => {
+    if (!shouldRenderPicker) {
+      return;
+    }
     const query = (searchQuery ?? "").toLowerCase().replace("{{", "").replace("}}", "").trim();
     const nextAutoExpand = /* @__PURE__ */ new Set();
     const collectNestedAutoExpand = (rootToken, tree) => {
@@ -5290,6 +5319,7 @@ var LSVariableInputField = forwardRef5((props, ref) => {
     }
     setAutoExpandPaths(nextAutoExpand);
   }, [
+    shouldRenderPicker,
     searchQuery,
     allowedVariableDefinitions,
     allowedVariableNames,
@@ -5470,8 +5500,8 @@ var LSVariableInputField = forwardRef5((props, ref) => {
       ] })
     );
   };
-  const showSuggestedSection = allowedVariableNames.length > 0 && filteredAllowedVariables.length > 0;
-  const pickerBody = /* @__PURE__ */ jsxs5("div", { className: "ls-variable-picker ls-variable-picker--three-col", children: [
+  const showSuggestedSection = shouldRenderPicker && allowedVariableNames.length > 0 && filteredAllowedVariables.length > 0;
+  const pickerBody = shouldRenderPicker ? /* @__PURE__ */ jsxs5("div", { className: "ls-variable-picker ls-variable-picker--three-col", children: [
     /* @__PURE__ */ jsxs5("div", { className: "ls-variable-picker__intro", children: [
       /* @__PURE__ */ jsx12("div", { className: "ls-variable-picker__intro-text", children: t(
         "overlay-variables.variables-description",
@@ -5572,7 +5602,7 @@ var LSVariableInputField = forwardRef5((props, ref) => {
         ] }, variable.name);
       })
     ] })
-  ] });
+  ] }) : null;
   const textField = (params = {}) => /* @__PURE__ */ jsx12(
     VariableInputTextField,
     {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@lumiastream/ui",
-	"version": "0.3.5",
+	"version": "0.3.8",
 	"author": "Lumia Stream",
 	"license": "ISC",
 	"description": "Lumia UI Kit",
@@ -128,7 +128,7 @@
 		"vitest": "^4.1.6"
 	},
 	"dependencies": {
-		"@lumiastream/lumia-translations": "1.15.9",
+		"@lumiastream/lumia-translations": "1.16.0",
 		"@lumiastream/lumia-types": "^3.3.7-alpha.2",
 		"classnames": "^2.5.1",
 		"globals": "^17.4.0",