@vectoriox/iox-builder 1.4.15 → 1.4.17

package/fesm2022/vectoriox-iox-builder.mjs

@@ -1484,10 +1484,12 @@ var TraitInputType;
     TraitInputType["DirectionalSize"] = "directionalSize";
     TraitInputType["SelectButton"] = "selectButton";
     TraitInputType["Scrub"] = "scrub";
+    TraitInputType["Range"] = "range";
     TraitInputType["Icon"] = "icon";
     TraitInputType["Media"] = "media";
     TraitInputType["FontFamily"] = "fontFamily";
     TraitInputType["GridTemplate"] = "gridTemplate";
+    TraitInputType["SectionLabel"] = "sectionLabel";
 })(TraitInputType || (TraitInputType = {}));
 function generateNodeId() {
     return Math.random().toString(36).substr(2, 9);
@@ -1547,6 +1549,8 @@ function resolveTraitControllerType(type) {
         case TraitInputType.DirectionalSize: return 'directionalSize';
         case TraitInputType.SelectButton: return 'selectButton';
         case TraitInputType.Scrub: return 'scrub';
+        case TraitInputType.Range: return 'range';
+        case TraitInputType.SectionLabel: return 'sectionLabel';
         case TraitInputType.Icon: return 'icon';
         case TraitInputType.Media: return 'media';
         case TraitInputType.FontFamily: return 'select';
@@ -1559,6 +1563,7 @@ function resolveTraitOptions(trait) {
         trait.type === TraitInputType.DirectionalSize ||
         trait.type === TraitInputType.SelectButton ||
         trait.type === TraitInputType.Scrub ||
+        trait.type === TraitInputType.Range ||
         trait.type === TraitInputType.Media) {
         return trait.options;
     }
@@ -1744,6 +1749,7 @@ class TypographyGroupStyleConfig extends GroupStyleConfig {
 class EffectsGroupStyleConfig extends GroupStyleConfig {
     constructor() {
         super(StyleCategory.Effects, [
+            // ── Visibility ────────────────────────────────────────
             new TraitConfig('opacity', 'Opacity', TraitInputType.Scrub, { min: 0, max: 1, step: 0.01, units: [''] }, '1'),
             new TraitConfig('mixBlendMode', 'Blend Mode', TraitInputType.Select, [
                 'normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten',
@@ -1754,6 +1760,42 @@ class EffectsGroupStyleConfig extends GroupStyleConfig {
                 'auto', 'default', 'pointer', 'text', 'move', 'not-allowed',
                 'grab', 'grabbing', 'crosshair', 'zoom-in', 'zoom-out', 'none',
             ], 'auto'),
+            // ── Shadow ────────────────────────────────────────────
+            new TraitConfig('_sep_shadow', 'Shadow', TraitInputType.SectionLabel),
+            new TraitConfig('boxShadow', 'Box Shadow', TraitInputType.Text, undefined, ''),
+            new TraitConfig('textShadow', 'Text Shadow', TraitInputType.Text, undefined, ''),
+            // ── Transform (virtual — composed to CSS transform: …) ─
+            new TraitConfig('_sep_transform', 'Transform', TraitInputType.SectionLabel),
+            new TraitConfig('translateX', 'TX', TraitInputType.Scrub, { min: -2000, max: 2000, step: 1, units: UNITS_ALL }, '0px', true),
+            new TraitConfig('translateY', 'TY', TraitInputType.Scrub, { min: -2000, max: 2000, step: 1, units: UNITS_ALL }, '0px', true),
+            new TraitConfig('scaleX', 'Scale X', TraitInputType.Range, { min: 0, max: 3, step: 0.01, showExtremes: false, showValue: true, compact: true }, '1'),
+            new TraitConfig('scaleY', 'Scale Y', TraitInputType.Range, { min: 0, max: 3, step: 0.01, showExtremes: false, showValue: true, compact: true }, '1'),
+            new TraitConfig('rotate', 'Rotate', TraitInputType.Scrub, { min: -360, max: 360, step: 1, units: UNITS_DEG }, '0deg', true),
+            new TraitConfig('skewX', 'Skew X', TraitInputType.Scrub, { min: -180, max: 180, step: 1, units: UNITS_DEG }, '0deg', true),
+            new TraitConfig('skewY', 'Skew Y', TraitInputType.Scrub, { min: -180, max: 180, step: 1, units: UNITS_DEG }, '0deg', true),
+            // ── Filter (virtual — composed to CSS filter: …) ──────
+            new TraitConfig('_sep_filter', 'Filter', TraitInputType.SectionLabel),
+            new TraitConfig('filterBlur', 'Blur', TraitInputType.Scrub, { min: 0, max: 50, step: 1, units: ['px'] }, '0px', true),
+            new TraitConfig('filterHueRotate', 'Hue Rotate', TraitInputType.Scrub, { min: 0, max: 360, step: 1, units: UNITS_DEG }, '0deg', true),
+            new TraitConfig('filterBrightness', 'Brightness', TraitInputType.Range, { min: 0, max: 3, step: 0.05, showExtremes: false, showValue: true, compact: true }, '1'),
+            new TraitConfig('filterContrast', 'Contrast', TraitInputType.Range, { min: 0, max: 3, step: 0.05, showExtremes: false, showValue: true, compact: true }, '1'),
+            new TraitConfig('filterSaturate', 'Saturate', TraitInputType.Range, { min: 0, max: 3, step: 0.05, showExtremes: false, showValue: true, compact: true }, '1'),
+            new TraitConfig('filterGrayscale', 'Grayscale', TraitInputType.Range, { min: 0, max: 1, step: 0.05, showExtremes: false, showValue: true, compact: true }, '0'),
+            new TraitConfig('filterSepia', 'Sepia', TraitInputType.Range, { min: 0, max: 1, step: 0.05, showExtremes: false, showValue: true, compact: true }, '0'),
+            new TraitConfig('filterInvert', 'Invert', TraitInputType.Range, { min: 0, max: 1, step: 0.05, showExtremes: false, showValue: true, compact: true }, '0'),
+            // ── Backdrop filter (virtual — composed to CSS backdrop-filter: …)
+            new TraitConfig('_sep_backdrop', 'Backdrop', TraitInputType.SectionLabel),
+            new TraitConfig('backdropBlur', 'Blur', TraitInputType.Scrub, { min: 0, max: 50, step: 1, units: ['px'] }, '0px', true),
+            new TraitConfig('backdropBrightness', 'Brightness', TraitInputType.Range, { min: 0, max: 3, step: 0.05, showExtremes: false, showValue: true, compact: true }, '1', true),
+            new TraitConfig('backdropContrast', 'Contrast', TraitInputType.Range, { min: 0, max: 3, step: 0.05, showExtremes: false, showValue: true, compact: true }, '1', true),
+            new TraitConfig('backdropSaturate', 'Saturate', TraitInputType.Range, { min: 0, max: 3, step: 0.05, showExtremes: false, showValue: true, compact: true }, '1', true),
+            // ── Transition (virtual — composed to CSS transition: all …) ──
+            new TraitConfig('_sep_transition', 'Transition', TraitInputType.SectionLabel),
+            new TraitConfig('transitionDuration', 'Duration', TraitInputType.Scrub, { min: 0, max: 3000, step: 50, units: ['ms'] }, '0ms', true),
+            new TraitConfig('transitionDelay', 'Delay', TraitInputType.Scrub, { min: 0, max: 2000, step: 50, units: ['ms'] }, '0ms', true),
+            new TraitConfig('transitionTimingFunction', 'Easing', TraitInputType.Select, [
+                'ease', 'linear', 'ease-in', 'ease-out', 'ease-in-out',
+            ], 'ease'),
         ]);
     }
 }