brep-io-kernel 1.0.0

package/src/UI/featureDialogWidgets/componentSelectorField.js

@@ -0,0 +1,102 @@
+import { openComponentSelectorModal } from '../componentSelectorModal.js';
+
+export function renderComponentSelectorField({ ui, key, def, id, controlWrap }) {
+  const wrap = document.createElement('div');
+  wrap.className = 'component-selector-wrap';
+
+  const inputEl = document.createElement('input');
+  inputEl.type = 'text';
+  inputEl.id = id;
+  inputEl.className = 'input component-selector-input';
+  inputEl.readOnly = true;
+  inputEl.value = String(ui._pickInitialValue(key, def) || '');
+
+  const btn = document.createElement('button');
+  btn.type = 'button';
+  btn.className = 'btn component-selector-btn';
+  btn.textContent = String(def.buttonLabel || 'Choose…');
+
+  const clearBtn = document.createElement('button');
+  clearBtn.type = 'button';
+  clearBtn.className = 'btn btn-slim component-selector-clear';
+  clearBtn.textContent = 'Clear';
+
+  const applyValue = (value, record) => {
+    inputEl.value = value || '';
+    ui.params[key] = value || '';
+    ui._emitParamsChange(key, ui.params[key]);
+    if (typeof def.onSelect === 'function') {
+      try {
+        const ctx = {
+          featureID: ui.params?.featureID ?? ui.params?.id ?? null,
+          key,
+          viewer: ui.options?.viewer || null,
+          partHistory: ui.options?.partHistory || null,
+          feature: ui.options?.featureRef || null,
+          form: ui,
+        };
+        def.onSelect(ctx, record || null);
+      } catch (_) { /* ignore handler errors */ }
+    }
+  };
+
+  btn.addEventListener('click', async (ev) => {
+    ev.preventDefault();
+    ui._stopActiveReferenceSelection();
+    const record = await openComponentSelectorModal({ title: def.dialogTitle || 'Select Component' });
+    if (!record || !record.data3mf) return;
+    applyValue(record.name || '', record);
+  });
+
+  clearBtn.addEventListener('click', () => {
+    applyValue('', null);
+  });
+
+  wrap.appendChild(inputEl);
+  const controls = document.createElement('div');
+  controls.className = 'component-selector-controls';
+  controls.appendChild(btn);
+  controls.appendChild(clearBtn);
+  wrap.appendChild(controls);
+
+  if (controlWrap instanceof HTMLElement) {
+    controlWrap.appendChild(wrap);
+  }
+
+  return {
+    inputEl,
+    activate() {
+      btn.focus();
+    },
+    readValue() {
+      return inputEl.value;
+    }
+  };
+}
+
+(function ensureComponentSelectorStyles() {
+  if (typeof document === 'undefined') return;
+  if (document.getElementById('component-selector-field-styles')) return;
+  const style = document.createElement('style');
+  style.id = 'component-selector-field-styles';
+  style.textContent = `
+    .component-selector-wrap {
+      display: flex;
+      gap: 8px;
+      align-items: center;
+    }
+    .component-selector-wrap .component-selector-input {
+      flex: 1 1 auto;
+      min-width: 0;
+    }
+    .component-selector-controls {
+      display: flex;
+      gap: 6px;
+      flex: 0 0 auto;
+    }
+    .component-selector-clear {
+      padding: 4px 8px;
+    }
+  `;
+  document.head.appendChild(style);
+})();

package/src/UI/featureDialogWidgets/defaultField.js

@@ -0,0 +1,23 @@
+export function renderDefaultField({ ui, key, def, id }) {
+    const inputEl = document.createElement('input');
+    inputEl.type = 'text';
+    inputEl.id = id;
+    inputEl.className = 'input';
+
+    ui._setInputValue(inputEl, 'string', ui._pickInitialValue(key, def));
+
+    inputEl.addEventListener('change', () => {
+        ui.params[key] = inputEl.value;
+        ui._emitParamsChange(key, inputEl.value);
+    });
+
+    return {
+        inputEl,
+        activate() {
+            inputEl.focus();
+        },
+        readValue() {
+            return inputEl.value;
+        },
+    };
+}

package/src/UI/featureDialogWidgets/fileField.js

@@ -0,0 +1,66 @@
+export function renderFileField({ ui, key, def, id, controlWrap }) {
+    const inputEl = document.createElement('button');
+    inputEl.type = 'button';
+    inputEl.id = id;
+    inputEl.className = 'btn';
+    inputEl.textContent = String(def.label || 'Choose File…');
+
+    const info = document.createElement('div');
+    info.className = 'file-info';
+    const initial = ui._pickInitialValue(key, def);
+    if (typeof initial === 'string' && initial.startsWith('data:') && initial.includes(';base64,')) {
+        const b64 = initial.split(',')[1] || '';
+        const size = Math.floor((b64.length * 3) / 4);
+        info.textContent = `Loaded (${size} bytes)`;
+    } else if (initial && String(initial).length) {
+        info.textContent = `Loaded (${String(initial).length} chars)`;
+    } else {
+        info.textContent = 'No file selected';
+    }
+
+    const fileInput = document.createElement('input');
+    fileInput.type = 'file';
+    fileInput.style.display = 'none';
+    if (def && def.accept) fileInput.setAttribute('accept', String(def.accept));
+
+    inputEl.addEventListener('click', (ev) => {
+        ev.preventDefault();
+        fileInput.click();
+    });
+
+    fileInput.addEventListener('change', async () => {
+        const f = fileInput.files && fileInput.files[0];
+        if (!f) return;
+        try {
+            const ab = await f.arrayBuffer();
+            const bytes = new Uint8Array(ab);
+            let binary = '';
+            const chunk = 0x8000;
+            for (let i = 0; i < bytes.length; i += chunk) {
+                const sub = bytes.subarray(i, i + chunk);
+                binary += String.fromCharCode.apply(null, sub);
+            }
+            const b64 = (typeof btoa === 'function') ? btoa(binary) : (typeof Buffer !== 'undefined' ? Buffer.from(bytes).toString('base64') : '');
+            const mime = (f.type && f.type.length) ? f.type : 'application/octet-stream';
+            const dataUrl = `data:${mime};base64,${b64}`;
+            ui.params[key] = dataUrl;
+            info.textContent = `${f.name} (${bytes.length} bytes)`;
+            ui._emitParamsChange(key, dataUrl);
+        } catch (e) {
+            info.textContent = `Failed to read file: ${e?.message || e}`;
+        }
+    });
+
+    controlWrap.appendChild(info);
+    controlWrap.appendChild(fileInput);
+
+    return {
+        inputEl,
+        activate() {
+            fileInput.click();
+        },
+        readValue() {
+            return ui.params[key] ?? null;
+        },
+    };
+}

package/src/UI/featureDialogWidgets/index.js

@@ -0,0 +1,34 @@
+import { renderNumberField } from './numberField.js';
+import { renderTextareaField } from './textareaField.js';
+import { renderReferenceSelectionField } from './referenceSelectionField.js';
+import { renderTransformField } from './transformField.js';
+import { renderBooleanOperationField } from './booleanOperationField.js';
+import { renderStringField } from './stringField.js';
+import { renderBooleanField } from './booleanField.js';
+import { renderOptionsField } from './optionsField.js';
+import { renderVec3Field } from './vec3Field.js';
+import { renderFileField } from './fileField.js';
+import { renderButtonField } from './buttonField.js';
+import { renderDefaultField } from './defaultField.js';
+import { renderComponentSelectorField } from './componentSelectorField.js';
+import { renderThreadDesignationField } from './threadDesignationField.js';
+
+const RENDERERS = {
+    number: renderNumberField,
+    textarea: renderTextareaField,
+    reference_selection: renderReferenceSelectionField,
+    transform: renderTransformField,
+    boolean_operation: renderBooleanOperationField,
+    string: renderStringField,
+    boolean: renderBooleanField,
+    options: renderOptionsField,
+    vec3: renderVec3Field,
+    file: renderFileField,
+    button: renderButtonField,
+    component_selector: renderComponentSelectorField,
+    thread_designation: renderThreadDesignationField,
+};
+
+export function getWidgetRenderer(type) {
+    return RENDERERS[type] || renderDefaultField;
+}

package/src/UI/featureDialogWidgets/numberField.js

@@ -0,0 +1,165 @@
+export function renderNumberField({ ui, key, def, id, controlWrap }) {
+    const wrap = document.createElement('div');
+    wrap.className = 'number-input-wrap';
+
+    const inputEl = document.createElement('input');
+    inputEl.type = 'text';
+    inputEl.id = id;
+    inputEl.className = 'input number-input';
+    inputEl.dataset.forceText = 'true';
+
+    try {
+        if (def && (typeof def.step === 'number' || (typeof def.step === 'string' && def.step.trim() !== ''))) {
+            inputEl.dataset.step = String(def.step);
+        }
+        if (def && (typeof def.min === 'number' || (typeof def.min === 'string' && def.min !== ''))) {
+            inputEl.dataset.min = String(def.min);
+        }
+        if (def && (typeof def.max === 'number' || (typeof def.max === 'string' && def.max !== ''))) {
+            inputEl.dataset.max = String(def.max);
+        }
+    } catch (_) { }
+
+    const stepper = document.createElement('div');
+    stepper.className = 'number-stepper';
+    const stepUp = document.createElement('button');
+    stepUp.type = 'button';
+    stepUp.className = 'number-stepper-btn number-stepper-up';
+    stepUp.setAttribute('aria-label', 'Increment');
+    const stepDown = document.createElement('button');
+    stepDown.type = 'button';
+    stepDown.className = 'number-stepper-btn number-stepper-down';
+    stepDown.setAttribute('aria-label', 'Decrement');
+    stepper.appendChild(stepUp);
+    stepper.appendChild(stepDown);
+
+    wrap.appendChild(inputEl);
+    wrap.appendChild(stepper);
+    if (controlWrap) controlWrap.appendChild(wrap);
+
+    ui._setInputValue(inputEl, def.type, ui._pickInitialValue(key, def));
+
+    const commitValue = () => {
+        ui.params[key] = inputEl.value;
+        ui._emitParamsChange(key, inputEl.value);
+    };
+
+    inputEl.addEventListener('change', commitValue);
+
+    inputEl.addEventListener('focus', () => {
+        inputEl.select();
+        ui._stopActiveReferenceSelection();
+    });
+
+    const numericLike = /^\s*[-+]?((\d+(?:\.\d*)?)|(\.\d+))(?:[eE][-+]?\d+)?\s*$/;
+    const readLimit = (name) => {
+        const raw = inputEl.dataset ? inputEl.dataset[name] : null;
+        if (raw == null || raw === '') return null;
+        const num = Number(raw);
+        return Number.isFinite(num) ? num : null;
+    };
+    const readStep = () => {
+        const raw = inputEl.dataset ? inputEl.dataset.step : null;
+        const num = Number(raw);
+        if (!Number.isFinite(num) || num === 0) return 1;
+        return Math.abs(num);
+    };
+    const readBase = () => {
+        const raw = String(inputEl.value || '').trim();
+        if (!raw) {
+            const minVal = readLimit('min');
+            return Number.isFinite(minVal) ? minVal : 0;
+        }
+        if (!numericLike.test(raw)) return null;
+        const num = Number(raw);
+        return Number.isFinite(num) ? num : null;
+    };
+    const applyStep = (dir, options = {}) => {
+        const { commit = true, focus = true } = options;
+        const base = readBase();
+        if (base == null) return false;
+        const step = readStep();
+        let next = base + dir * step;
+        const minVal = readLimit('min');
+        const maxVal = readLimit('max');
+        if (Number.isFinite(minVal)) next = Math.max(minVal, next);
+        if (Number.isFinite(maxVal)) next = Math.min(maxVal, next);
+        ui._setInputValue(inputEl, 'number', next);
+        if (commit) commitValue();
+        if (focus) {
+            inputEl.focus();
+            inputEl.select();
+        }
+        return true;
+    };
+    const preventBlur = (ev) => {
+        ev.preventDefault();
+    };
+    const repeat = { delay: 350, interval: 80 };
+    let repeatTimeout = null;
+    let repeatInterval = null;
+    let clearClickTimeout = null;
+    let didRepeatStep = false;
+    let suppressClick = false;
+    const stopRepeat = () => {
+        if (repeatTimeout) clearTimeout(repeatTimeout);
+        if (repeatInterval) clearInterval(repeatInterval);
+        repeatTimeout = null;
+        repeatInterval = null;
+        if (didRepeatStep) {
+            commitValue();
+            didRepeatStep = false;
+        }
+        if (suppressClick) {
+            if (clearClickTimeout) clearTimeout(clearClickTimeout);
+            clearClickTimeout = setTimeout(() => { suppressClick = false; }, 200);
+        }
+    };
+    const startRepeat = (dir) => {
+        stopRepeat();
+        didRepeatStep = applyStep(dir, { commit: false, focus: true });
+        if (!didRepeatStep) return;
+        repeatTimeout = setTimeout(() => {
+            repeatInterval = setInterval(() => {
+                if (applyStep(dir, { commit: false, focus: false })) didRepeatStep = true;
+            }, repeat.interval);
+        }, repeat.delay);
+        window.addEventListener('pointerup', stopRepeat, { once: true });
+        window.addEventListener('pointercancel', stopRepeat, { once: true });
+        return true;
+    };
+    stepUp.addEventListener('pointerdown', (ev) => {
+        preventBlur(ev);
+        suppressClick = Boolean(startRepeat(1));
+    });
+    stepDown.addEventListener('pointerdown', (ev) => {
+        preventBlur(ev);
+        suppressClick = Boolean(startRepeat(-1));
+    });
+    stepUp.addEventListener('click', () => {
+        if (suppressClick) {
+            suppressClick = false;
+            if (clearClickTimeout) clearTimeout(clearClickTimeout);
+            return;
+        }
+        applyStep(1);
+    });
+    stepDown.addEventListener('click', () => {
+        if (suppressClick) {
+            suppressClick = false;
+            if (clearClickTimeout) clearTimeout(clearClickTimeout);
+            return;
+        }
+        applyStep(-1);
+    });
+
+    return {
+        inputEl,
+        activate() {
+            inputEl.focus();
+        },
+        readValue() {
+            return inputEl.value;
+        },
+    };
+}

package/src/UI/featureDialogWidgets/optionsField.js

@@ -0,0 +1,33 @@
+export function renderOptionsField({ ui, key, def, id }) {
+    const inputEl = document.createElement('select');
+    inputEl.id = id;
+    inputEl.className = 'select';
+
+    const opts = Array.isArray(def.options) ? def.options : [];
+    for (let i = 0; i < opts.length; i++) {
+        const opt = opts[i];
+        const o = document.createElement('option');
+        o.value = String(opt);
+        o.textContent = String(opt);
+        inputEl.appendChild(o);
+    }
+
+    ui._setInputValue(inputEl, 'options', ui._pickInitialValue(key, def));
+
+    inputEl.addEventListener('change', () => {
+        const v = inputEl.value;
+        ui.params[key] = v;
+        ui._emitParamsChange(key, v);
+        ui._stopActiveReferenceSelection();
+    });
+
+    return {
+        inputEl,
+        activate() {
+            inputEl.focus();
+        },
+        readValue() {
+            return inputEl.value;
+        },
+    };
+}

package/src/UI/featureDialogWidgets/referenceSelectionField.js

@@ -0,0 +1,208 @@
+import { normalizeReferenceList, normalizeReferenceName } from './utils.js';
+
+export function renderReferenceSelectionField({ ui, key, def, id, controlWrap, valueAdapter = null }) {
+    const inputEl = document.createElement('input');
+    inputEl.type = 'hidden';
+    inputEl.id = id;
+
+    const isMulti = !!def.multiple;
+    if (isMulti) inputEl.dataset.multiple = 'true';
+
+    const parseBound = (value) => {
+        const num = Number(value);
+        if (!Number.isFinite(num)) return null;
+        const coerced = Math.max(0, Math.floor(num));
+        return coerced >= 0 ? coerced : null;
+    };
+
+    const minSelections = isMulti ? parseBound(def.minSelections) : null;
+    let maxSelections = isMulti ? parseBound(def.maxSelections) : null;
+    if (isMulti && maxSelections !== null && minSelections !== null && maxSelections < minSelections) {
+        maxSelections = minSelections;
+    }
+
+    if (isMulti && minSelections !== null) inputEl.dataset.minSelections = String(minSelections);
+    if (isMulti && maxSelections !== null) inputEl.dataset.maxSelections = String(maxSelections);
+
+    const placeholderText = (typeof def.placeholder === 'string' && def.placeholder.trim())
+        ? def.placeholder.trim()
+        : 'Click then select in scene…';
+
+    const adapter = (valueAdapter && typeof valueAdapter === 'object') ? valueAdapter : null;
+    const readRawValue = () => {
+        if (adapter && typeof adapter.read === 'function') {
+            try { return adapter.read(); } catch (_) { return null; }
+        }
+        return ui._pickInitialValue(key, def);
+    };
+    const writeRawValue = (next) => {
+        if (adapter && typeof adapter.write === 'function') {
+            try { adapter.write(next); return; } catch (_) { return; }
+        }
+        ui.params[key] = next;
+    };
+    const emitChange = (value) => {
+        if (adapter && typeof adapter.emit === 'function') {
+            try { adapter.emit(value); return; } catch (_) { return; }
+        }
+        ui._emitParamsChange(key, value);
+    };
+
+    const refWrap = document.createElement('div');
+    refWrap.className = isMulti ? 'ref-multi-wrap' : 'ref-single-wrap';
+
+    let chipsWrap = null;
+    const updateSelectionMetadata = (list) => {
+        if (!isMulti) return;
+        const normalized = normalizeReferenceList(Array.isArray(list) ? list : []);
+        try { inputEl.dataset.selectedCount = String(normalized.length); } catch (_) { }
+        try { inputEl.dataset.selectedValues = JSON.stringify(normalized); } catch (_) { }
+    };
+
+    if (isMulti) {
+        inputEl.__getSelectionList = () => {
+            try {
+                const raw = readRawValue();
+                if (!Array.isArray(raw)) return [];
+                return normalizeReferenceList(raw);
+            } catch (_) {
+                return [];
+            }
+        };
+        inputEl.__updateSelectionMetadata = updateSelectionMetadata;
+    }
+    if (isMulti) {
+        chipsWrap = document.createElement('div');
+        chipsWrap.className = 'ref-chips';
+        chipsWrap.addEventListener('click', () => ui._activateReferenceSelection(inputEl, def));
+        refWrap.appendChild(chipsWrap);
+        try {
+            const initial = readRawValue();
+            const current = normalizeReferenceList(Array.isArray(initial) ? initial : []);
+            writeRawValue(current);
+            ui._renderChips(chipsWrap, key, current);
+            updateSelectionMetadata(current);
+        } catch (_) { }
+    } else {
+        const valueWrap = document.createElement('button');
+        valueWrap.type = 'button';
+        valueWrap.className = 'ref-single-display';
+        valueWrap.title = placeholderText;
+        valueWrap.dataset.placeholder = placeholderText;
+
+        const label = document.createElement('span');
+        label.className = 'ref-single-label';
+        valueWrap.appendChild(label);
+
+        const clearBtn = document.createElement('span');
+        clearBtn.className = 'ref-chip-remove';
+        clearBtn.role = 'button';
+        clearBtn.tabIndex = 0;
+        clearBtn.title = 'Clear selection';
+        clearBtn.textContent = '✕';
+
+        const clearSelection = (ev) => {
+            ev.stopPropagation();
+            ev.preventDefault?.();
+            writeRawValue(null);
+            inputEl.value = '';
+            updateSingleDisplay(null);
+            emitChange(null);
+        };
+
+        clearBtn.addEventListener('click', clearSelection);
+        clearBtn.addEventListener('keydown', (ev) => {
+            if (ev.key === 'Enter' || ev.key === ' ') {
+                clearSelection(ev);
+            }
+        });
+        valueWrap.appendChild(clearBtn);
+
+        const updateSingleDisplay = (val) => {
+            const normalized = normalizeReferenceName(val);
+            label.textContent = normalized || placeholderText;
+            clearBtn.style.visibility = normalized ? 'visible' : 'hidden';
+        };
+
+        const initial = normalizeReferenceName(readRawValue());
+        writeRawValue(initial);
+        updateSingleDisplay(initial);
+        inputEl.value = initial ?? '';
+
+        valueWrap.addEventListener('click', () => ui._activateReferenceSelection(inputEl, def));
+        refWrap.appendChild(valueWrap);
+
+        inputEl.addEventListener('change', () => {
+            updateSingleDisplay(inputEl.value);
+            const normalized = normalizeReferenceName(inputEl.value);
+            writeRawValue(normalized);
+            emitChange(normalized);
+        });
+    }
+
+    ui._setInputValue(inputEl, def.type, readRawValue());
+
+    inputEl.addEventListener('change', () => {
+        const raw = inputEl.value;
+        if (isMulti) {
+            if (inputEl.dataset && inputEl.dataset.forceClear === 'true') {
+                writeRawValue([]);
+                if (chipsWrap) {
+                    ui._renderChips(chipsWrap, key, []);
+                    updateSelectionMetadata([]);
+                }
+                inputEl.value = '';
+                delete inputEl.dataset.forceClear;
+                emitChange(adapter ? readRawValue() : []);
+                return;
+            }
+            let incoming = [];
+            let parsedArray = false;
+            try {
+                const parsed = JSON.parse(raw);
+                if (Array.isArray(parsed)) { incoming = parsed; parsedArray = true; }
+            } catch (_) { }
+            if (!parsedArray && raw != null && String(raw).trim() !== '') incoming = [String(raw).trim()];
+
+            const existingRaw = readRawValue();
+            const current = Array.isArray(existingRaw) ? existingRaw : [];
+            const next = current.slice();
+            for (const name of incoming) {
+                const normalized = normalizeReferenceName(name);
+                if (!normalized) continue;
+                if (!next.includes(normalized)) next.push(normalized);
+            }
+            const normalizedList = normalizeReferenceList(next);
+            if (isMulti && maxSelections !== null && normalizedList.length > maxSelections) {
+                normalizedList.length = maxSelections;
+            }
+            writeRawValue(normalizedList);
+            if (chipsWrap) {
+                ui._renderChips(chipsWrap, key, normalizedList);
+                updateSelectionMetadata(normalizedList);
+            }
+            inputEl.value = '';
+            emitChange(adapter ? readRawValue() : normalizedList);
+        } else {
+            const normalized = normalizeReferenceName(raw);
+            inputEl.value = normalized ?? '';
+            writeRawValue(normalized);
+            emitChange(normalized);
+        }
+    });
+
+    refWrap.appendChild(inputEl);
+    controlWrap.appendChild(refWrap);
+
+    const activate = () => ui._activateReferenceSelection(inputEl, def);
+
+    return {
+        inputEl,
+        activate,
+        readValue() {
+            const value = readRawValue();
+            if (Array.isArray(value)) return normalizeReferenceList(value);
+            return normalizeReferenceName(value);
+        },
+    };
+}

package/src/UI/featureDialogWidgets/stringField.js

@@ -0,0 +1,24 @@
+export function renderStringField({ ui, key, def, id }) {
+    const inputEl = document.createElement('input');
+    inputEl.type = 'text';
+    inputEl.id = id;
+    inputEl.className = 'input';
+
+    ui._setInputValue(inputEl, def.type, ui._pickInitialValue(key, def));
+
+    inputEl.addEventListener('change', () => {
+        ui.params[key] = inputEl.value;
+        ui._emitParamsChange(key, inputEl.value);
+        ui._stopActiveReferenceSelection();
+    });
+
+    return {
+        inputEl,
+        activate() {
+            inputEl.focus();
+        },
+        readValue() {
+            return inputEl.value;
+        },
+    };
+}

package/src/UI/featureDialogWidgets/textareaField.js

@@ -0,0 +1,28 @@
+export function renderTextareaField({ ui, key, def, id }) {
+    const inputEl = document.createElement('textarea');
+    inputEl.id = id;
+    inputEl.className = 'input textarea';
+
+    if (def && def.rows != null) {
+        const rows = parseInt(def.rows, 10);
+        if (Number.isFinite(rows) && rows > 0) inputEl.rows = rows;
+    }
+    if (def && typeof def.placeholder === 'string') inputEl.placeholder = def.placeholder;
+
+    ui._setInputValue(inputEl, 'string', ui._pickInitialValue(key, def));
+
+    inputEl.addEventListener('change', () => {
+        ui.params[key] = inputEl.value;
+        ui._emitParamsChange(key, inputEl.value);
+    });
+
+    return {
+        inputEl,
+        activate() {
+            inputEl.focus();
+        },
+        readValue() {
+            return inputEl.value;
+        },
+    };
+}