@berenjena/react-dev-panel 1.0.4 → 2.1.0

package/dist/assets/ButtonControl.css

@@ -1 +0,0 @@
-._button_1cetu_1{width:100%;min-height:var(--dev-panel-inputs-height);padding:var(--dev-panel-spacing-xs) var(--dev-panel-spacing-sm);border:none;border-radius:4px;font-size:11px;font-weight:500;background-color:var(--dev-panel-accent-color);color:var(--dev-panel-text-color-highlight);cursor:pointer;transition:var(--dev-panel-transition)}._button_1cetu_1:hover:not(:disabled){background-color:color-mix(in srgb,var(--dev-panel-accent-color) 80%,transparent)}._button_1cetu_1:disabled{background-color:color-mix(in srgb,var(--dev-panel-accent-color) 20%,var(--dev-panel-background-color));cursor:not-allowed}

package/dist/assets/ButtonGroupControl.css

@@ -1 +0,0 @@
-._buttonGroupContainer_99d3t_1{width:100%;display:grid;grid-auto-columns:1fr;grid-auto-flow:column;gap:1px}._buttonGroupContainer_99d3t_1 button:first-child{border-top-right-radius:0;border-bottom-right-radius:0}._buttonGroupContainer_99d3t_1 button:not(:last-child):not(:first-child){border-radius:0}._buttonGroupContainer_99d3t_1 button:last-child{border-top-left-radius:0;border-bottom-left-radius:0}

package/dist/assets/ColorControl.css

@@ -1 +0,0 @@
-._container_ds1no_1{display:grid;grid-template-columns:var(--dev-panel-inputs-height) 1fr;gap:8px}._container_ds1no_1 label{overflow:hidden;width:auto;height:var(--dev-panel-inputs-height);cursor:pointer;border-radius:var(--dev-panel-border-radius)}._container_ds1no_1 input[type=color]{background:none;border:0;width:150%;height:150%;margin:-25%}._container_ds1no_1 input[type=color]:focus{border-radius:0;outline:none}

package/dist/assets/ControlRenderer.css

@@ -1 +0,0 @@
-._controlRendererContainer_eix3y_1{gap:var(--dev-panel-spacing-xs);display:grid}._controlRendererContainer_eix3y_1 ._controlContainer_eix3y_5{gap:var(--dev-panel-spacing-sm);display:grid;height:100%;align-items:center;overflow:hidden;color:var(--dev-panel-text-color)}._controlRendererContainer_eix3y_1 ._controlContainer_eix3y_5:not(._fullWidth_eix3y_13){grid-template-columns:100px 1fr}._controlRendererContainer_eix3y_1 ._controlContainer_eix3y_5 ._controlWrapper_eix3y_16{display:flex;justify-content:flex-end}._controlRendererContainer_eix3y_1 ._controlContainer_eix3y_5 ._label_eix3y_20{text-align:start;font-weight:500;font-size:var(--dev-panel-font-size-xs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._controlRendererContainer_eix3y_1 ._description_eix3y_28,._controlRendererContainer_eix3y_1 ._loading_eix3y_29{font-size:var(--dev-panel-font-size-xs);color:var(--dev-panel-text-color-muted)}._controlRendererContainer_eix3y_1 ._description_eix3y_28{text-align:right}

package/dist/assets/DevPanel.css

@@ -1 +0,0 @@
-._devPanelContainer_1vath_1{position:fixed;z-index:9998;border-radius:var(--dev-panel-border-radius);box-shadow:0 8px 24px #0003;width:var(--dev-panel-max-width);max-height:var(--dev-panel-max-height);overflow:hidden;user-select:none;font-family:var(--dev-panel-font-family)}._devPanelContainer_1vath_1 ._header_1vath_12{display:flex;align-items:center;justify-content:space-between;padding:var(--dev-panel-spacing-xs);background:var(--dev-panel-foreground-color);cursor:move;color:var(--dev-panel-text-color)}._devPanelContainer_1vath_1 ._title_1vath_21{font-size:var(--dev-panel-font-size-xs);font-weight:600;display:flex;align-items:center;gap:var(--dev-panel-spacing-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._devPanelContainer_1vath_1 ._button_1vath_31{background:none;border:none;color:inherit;font-size:var(--dev-panel-font-size-sm);cursor:pointer;padding:var(--dev-panel-spacing-xs) var(--dev-panel-spacing-sm);border-radius:4px;transition:all .2s ease}._devPanelContainer_1vath_1 ._button_1vath_31:hover{background:var(--dev-panel-highlight-color);color:#333}._devPanelContainer_1vath_1 ._button_1vath_31:active{transform:scale(.95)}._devPanelContainer_1vath_1 ._button_1vath_31>svg{display:block;height:1rem;transition:transform ease .2s}._devPanelContainer_1vath_1 ._button_1vath_31>svg._collapsed_1vath_53{transform:rotate(180deg)}._devPanelContainer_1vath_1 ._button_1vath_31>svg path{fill:currentColor}._content_1vath_60{max-height:calc(var(--dev-panel-max-height) - 48px);overflow-y:auto;background-color:var(--dev-panel-background-color)}._content_1vath_60::-webkit-scrollbar{width:6px}._content_1vath_60::-webkit-scrollbar-track{background:#f1f1f1}._content_1vath_60::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}._content_1vath_60::-webkit-scrollbar-thumb:hover{background:#a8a8a8}

package/dist/assets/EmptyContent.css

@@ -1 +0,0 @@
-._empty_1xo8g_1{text-align:center;color:#888;font-size:12px;padding:30px 0}._empty_1xo8g_1 code{background:#f8f9fa;padding:2px 4px;border-radius:3px}@media (prefers-color-scheme: dark){._empty_1xo8g_1{color:#b0b0b0}._empty_1xo8g_1 code{background:#333;color:#e0e0e0}}

package/dist/assets/Input.css

@@ -1 +0,0 @@
-._input_161wd_1{width:100%;height:var(--dev-panel-inputs-height);border:0;border-radius:var(--dev-panel-border-radius);cursor:pointer;padding:0;background-color:transparent;color:var(--dev-panel-text-color-highlight)}._input_161wd_1:last-of-type{background-color:var(--dev-panel-input-background-color);padding-left:var(--dev-panel-spacing-xs)}._input_161wd_1:focus{outline:none}._input_161wd_1:disabled{cursor:not-allowed;opacity:.6}._input_161wd_1::placeholder{color:var(--dev-panel-text-color-muted)}._input_161wd_1[type=date]::-webkit-calendar-picker-indicator{color:currentColor;opacity:1;filter:invert(1)}._input_161wd_1[type=date]::-moz-calendar-picker-indicator{color:currentColor;opacity:1}

package/dist/assets/RangeControl.css

@@ -1 +0,0 @@
-._container_1ewrb_1{display:grid;grid-template-columns:1fr auto;gap:var(--dev-panel-spacing-sm);align-items:center;width:100%}._range_1ewrb_9{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:2px;background:var(--dev-panel-input-background-color);outline:none;cursor:pointer;transition:var(--dev-panel-transition)}._range_1ewrb_9::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:var(--dev-panel-accent-color);cursor:pointer;border:2px solid var(--dev-panel-background-color);box-shadow:0 1px 3px #0003;transition:var(--dev-panel-transition)}._range_1ewrb_9::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:0 2px 6px #0000004d}._range_1ewrb_9::-webkit-slider-thumb:active{transform:scale(.95)}._range_1ewrb_9::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--dev-panel-accent-color);cursor:pointer;border:2px solid var(--dev-panel-background-color);box-shadow:0 1px 3px #0003;transition:var(--dev-panel-transition)}._range_1ewrb_9::-moz-range-thumb:hover{transform:scale(1.1);box-shadow:0 2px 6px #0000004d}._range_1ewrb_9::-moz-range-thumb:active{transform:scale(.95)}._range_1ewrb_9::-moz-range-track{width:100%;height:4px;border-radius:2px;background:var(--dev-panel-input-background-color);border:none}._range_1ewrb_9::-ms-track{width:100%;height:4px;background:transparent;border-color:transparent;color:transparent}._range_1ewrb_9::-ms-fill-lower{background:var(--dev-panel-accent-color);border-radius:2px}._range_1ewrb_9::-ms-fill-upper{background:var(--dev-panel-input-background-color);border-radius:2px}._range_1ewrb_9::-ms-thumb{width:16px;height:16px;border-radius:50%;background:var(--dev-panel-accent-color);cursor:pointer;border:2px solid var(--dev-panel-background-color);box-shadow:0 1px 3px #0003}._range_1ewrb_9:disabled{cursor:not-allowed;opacity:.6}._range_1ewrb_9:disabled::-webkit-slider-thumb{cursor:not-allowed;background:var(--dev-panel-text-color-muted)}._range_1ewrb_9:disabled::-moz-range-thumb{cursor:not-allowed;background:var(--dev-panel-text-color-muted)}._range_1ewrb_9:disabled::-ms-thumb{cursor:not-allowed;background:var(--dev-panel-text-color-muted)}._range_1ewrb_9:focus{outline:none}._range_1ewrb_9:focus::-webkit-slider-thumb{box-shadow:0 0 0 3px rgba(var(--dev-panel-accent-color-rgb),.3)}._range_1ewrb_9:focus::-moz-range-thumb{box-shadow:0 0 0 3px rgba(var(--dev-panel-accent-color-rgb),.3)}._range_1ewrb_9:focus::-ms-thumb{box-shadow:0 0 0 3px rgba(var(--dev-panel-accent-color-rgb),.3)}._value_1ewrb_116{font-size:var(--dev-panel-font-size-xs);color:var(--dev-panel-text-color);font-weight:500;min-width:2ch;text-align:right;user-select:none}

package/dist/assets/Section.css

@@ -1 +0,0 @@
-._section_1vgul_1{padding:var(--dev-panel-spacing-sm);overflow:hidden}._section_1vgul_1:last-child{margin-bottom:0}._section_1vgul_1 ._header_1vgul_8{display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:background .2s ease}._section_1vgul_1 ._header_1vgul_8 ._title_1vgul_15{font-size:11px;font-weight:600;color:var(--dev-panel-text-color)}._section_1vgul_1 ._header_1vgul_8 ._toggle_1vgul_20{font-size:10px;color:var(--dev-panel-border-color)}._section_1vgul_1 ._header_1vgul_8 ._toggle_1vgul_20>svg{display:block;height:1rem;transition:transform .2s ease}._section_1vgul_1 ._header_1vgul_8 ._toggle_1vgul_20>svg._collapsed_1vgul_29{transform:rotate(90deg)}._section_1vgul_1 ._header_1vgul_8 ._toggle_1vgul_20>svg path{fill:currentColor}._section_1vgul_1 ._content_1vgul_35{position:relative;padding:var(--dev-panel-spacing-sm) 0 0 var(--dev-panel-spacing-sm);display:grid;grid-template-columns:100%;gap:var(--dev-panel-spacing-sm);transition:opacity .25s}._section_1vgul_1 ._content_1vgul_35:after{content:"";position:absolute;left:0;bottom:0;width:2px;height:calc(100% - var(--dev-panel-spacing-sm));background-color:var(--dev-panel-border-color);transform:translate(-50%)}@media (prefers-color-scheme: dark){._section_1vgul_1,._section_1vgul_1 ._header_1vgul_8{border-color:#555}._section_1vgul_1 ._header_1vgul_8 ._title_1vgul_15{color:#e0e0e0}._section_1vgul_1 ._toggle_1vgul_20{color:#b0b0b0}}

package/dist/assets/Select.css

@@ -1 +0,0 @@
-._select_12f91_1{width:100%;height:var(--dev-panel-inputs-height);border:0;border-radius:var(--dev-panel-border-radius);cursor:pointer;padding:0;background-color:transparent;color:var(--dev-panel-text-color-highlight)}._select_12f91_1:last-of-type{background-color:var(--dev-panel-input-background-color);padding-left:var(--dev-panel-spacing-xs)}._select_12f91_1:focus{outline:none}._select_12f91_1:disabled{cursor:not-allowed;opacity:.6}._select_12f91_1::placeholder{color:var(--dev-panel-text-color-muted)}

package/dist/assets/SeparatorControl.css

@@ -1 +0,0 @@
-._line_12cvo_1{width:100%;height:1px;background-color:var(--dev-panel-border-color);margin:var(--dev-panel-spacing-sm) 0;opacity:.3}._space_12cvo_9{height:var(--dev-panel-spacing-md);width:100%}._labelContainer_12cvo_14{display:flex;align-items:center;margin:var(--dev-panel-spacing-md) 0 var(--dev-panel-spacing-sm) 0;position:relative}._labelContainer_12cvo_14:before{content:"";flex:1;height:1px;background-color:var(--dev-panel-border-color);opacity:.3;margin-right:var(--dev-panel-spacing-sm)}._labelContainer_12cvo_14:after{content:"";flex:1;height:1px;background-color:var(--dev-panel-border-color);opacity:.3;margin-left:var(--dev-panel-spacing-sm)}._label_12cvo_14{font-size:var(--dev-panel-font-size-xs);font-weight:600;color:var(--dev-panel-text-color-muted);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;padding:0 var(--dev-panel-spacing-xs)}

package/dist/components/ControlRenderer/ControlRenderer.d.ts

@@ -1,6 +0,0 @@
-import { ControlsNames } from './controls/types';
-import { ControlRendererProps } from './types';
-/**
- * Component that renders different types of controls based on the control type
- */
-export declare function ControlRenderer<Name extends ControlsNames>({ name, control }: ControlRendererProps<Name>): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/ControlRenderer.js

@@ -1,32 +0,0 @@
-import { jsxs as t, jsx as n } from "react/jsx-runtime";
-import { Suspense as a } from "react";
-import { className as c } from "../../utils/className/className.js";
-import { controls as d } from "./controls/index.js";
-import '../../assets/ControlRenderer.css';const p = "_controlRendererContainer_eix3y_1", _ = "_controlContainer_eix3y_5", m = "_fullWidth_eix3y_13", u = "_controlWrapper_eix3y_16", y = "_label_eix3y_20", f = "_description_eix3y_28", C = "_loading_eix3y_29", r = {
-  controlRendererContainer: p,
-  controlContainer: _,
-  fullWidth: m,
-  controlWrapper: u,
-  label: y,
-  description: f,
-  loading: C
-}, h = ["button", "buttonGroup", "separator"];
-function v({ name: i, control: e }) {
-  const l = e?.label || i;
-  function s() {
-    if (!e || !e.type)
-      return /* @__PURE__ */ n("div", { className: r.error, children: "Control type is not defined" });
-    const o = d[e.type];
-    return o ? /* @__PURE__ */ n(a, { fallback: /* @__PURE__ */ n("div", { className: r.loading, children: "Loading control..." }), children: /* @__PURE__ */ n(o, { control: e }) }) : /* @__PURE__ */ n("div", { children: "Unknown control type" });
-  }
-  return /* @__PURE__ */ t("div", { className: r.controlRendererContainer, children: [
-    /* @__PURE__ */ t("div", { ...c(r.controlContainer, { [r.fullWidth]: h.includes(e.type) }), children: [
-      e?.type !== "button" && e?.type !== "separator" && /* @__PURE__ */ n("label", { className: r.label, children: l }),
-      /* @__PURE__ */ n("div", { className: r.controlWrapper, children: s() })
-    ] }),
-    e?.description && /* @__PURE__ */ n("span", { className: r.description, children: e.description })
-  ] });
-}
-export {
-  v as ControlRenderer
-};

package/dist/components/ControlRenderer/controls/BooleanControl/BooleanControl.d.ts

@@ -1,16 +0,0 @@
-import { BooleanControlProps } from './types';
-/**
- * Component that renders a boolean control
- * @param control - The control to render
- * @returns The boolean control component
- *
- * @example
- * ```typescript
- * <BooleanControl control={{
- *   type: 'boolean',
- *   value: true,
- *   onChange: (value) => setValue(value)
- * }} />
- * ```
- */
-export declare function BooleanControl({ control }: BooleanControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/controls/BooleanControl/BooleanControl.js

@@ -1,24 +0,0 @@
-import { jsxs as i, jsx as a } from "react/jsx-runtime";
-import { className as l } from "../../../../utils/className/className.js";
-import '../../../../assets/BooleanControl.css';const t = "_slider_1i71a_25", e = {
-  switch: "_switch_1i71a_1",
-  slider: t
-};
-function r({ control: s }) {
-  return /* @__PURE__ */ i("label", { className: e.switch, children: [
-    /* @__PURE__ */ a(
-      "input",
-      {
-        type: "checkbox",
-        checked: s.value,
-        disabled: s.disabled,
-        onChange: (c) => s.onChange(c.target.checked),
-        className: e.checkbox
-      }
-    ),
-    /* @__PURE__ */ a("span", { ...l(e.slider, e.round) })
-  ] });
-}
-export {
-  r as BooleanControl
-};

package/dist/components/ControlRenderer/controls/ButtonControl/ButtonControl.d.ts

@@ -1,16 +0,0 @@
-import { ButtonControlProps } from './types';
-/**
- * Component that renders a button control
- * @param control - The control to render
- * @returns The button control component
- *
- * @example
- * ```typescript
- * <ButtonControl control={{
- *   type: 'button',
- *   label: 'Click me',
- *   onClick: () => console.log('Button clicked')
- * }} />
- * ```
- */
-export declare function ButtonControl({ control }: ButtonControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/controls/ButtonControl/ButtonControl.js

@@ -1,10 +0,0 @@
-import { jsx as n } from "react/jsx-runtime";
-import '../../../../assets/ButtonControl.css';const o = "_button_1cetu_1", e = {
-  button: o
-};
-function u({ control: t }) {
-  return /* @__PURE__ */ n("button", { onClick: t.onClick, disabled: t.disabled, className: e.button, children: t.label });
-}
-export {
-  u as ButtonControl
-};

package/dist/components/ControlRenderer/controls/ButtonGroupControl/ButtonGroupControl.d.ts

@@ -1,2 +0,0 @@
-import { ButtonGroupControlProps } from './types';
-export declare function ButtonGroupControl({ control }: ButtonGroupControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/controls/ButtonGroupControl/ButtonGroupControl.js

@@ -1,22 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import { ButtonControl as e } from "../ButtonControl/ButtonControl.js";
-import '../../../../assets/ButtonGroupControl.css';const l = "_buttonGroupContainer_99d3t_1", i = {
-  buttonGroupContainer: l
-};
-function p({ control: n }) {
-  return /* @__PURE__ */ t("div", { className: i.buttonGroupContainer, children: n.buttons.map((o, r) => /* @__PURE__ */ t(
-    e,
-    {
-      control: {
-        type: "button",
-        label: o.label,
-        onClick: o.onClick,
-        disabled: o.disabled
-      }
-    },
-    r
-  )) });
-}
-export {
-  p as ButtonGroupControl
-};

package/dist/components/ControlRenderer/controls/ColorControl/ColorControl.d.ts

@@ -1,16 +0,0 @@
-import { ColorControlProps } from './types';
-/**
- * Component that renders a color control
- * @param control - The control to render
- * @returns The color control component
- *
- * @example
- * ```typescript
- * <ColorControl control={{
- *   type: 'color',
- *   value: '#000000',
- *   onChange: (value) => setValue(value)
- * }} />
- * ```
- */
-export declare function ColorControl({ control }: ColorControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/controls/ColorControl/ColorControl.js

@@ -1,27 +0,0 @@
-import { jsxs as r, jsx as n } from "react/jsx-runtime";
-import { Input as o } from "../../../Input/Input.js";
-import { useDebouncedCallback as d } from "../../../../hooks/useDebounceCallback/useDebounceCallback.js";
-import '../../../../assets/ColorControl.css';const s = "_container_ds1no_1", i = {
-  container: s
-};
-function C({ control: e }) {
-  const l = d(e.onChange, 100), t = (a) => {
-    l(a.target.value);
-  };
-  return /* @__PURE__ */ r("div", { className: i.container, children: [
-    /* @__PURE__ */ n("label", { children: /* @__PURE__ */ n(o, { type: "color", value: e.value, disabled: e.disabled, onChange: t }) }),
-    /* @__PURE__ */ n(
-      o,
-      {
-        type: "text",
-        value: e.value,
-        disabled: e.disabled,
-        onChange: (a) => e.onChange(a.target.value),
-        placeholder: "Enter color value"
-      }
-    )
-  ] });
-}
-export {
-  C as ColorControl
-};

package/dist/components/ControlRenderer/controls/DateControl/DateControl.d.ts

@@ -1,29 +0,0 @@
-import { DateControlProps } from './types';
-/**
- * Component that renders a date control with configurable event handling
- * @param control - The control to render
- * @param control.event - When to trigger onChange: "onChange" (real-time) or "onBlur" (on focus loss). Defaults to "onBlur"
- * @returns The date control component
- *
- * @example
- * ```typescript
- * // Real-time updates
- * <DateControl control={{
- *   type: 'date',
- *   value: '2025-07-26',
- *   min: '2025-01-01',
- *   max: '2025-12-31',
- *   event: 'onChange',
- *   onChange: (value) => setValue(value)
- * }} />
- *
- * // Updates only when losing focus (default)
- * <DateControl control={{
- *   type: 'date',
- *   value: '2025-07-26',
- *   event: 'onBlur',
- *   onChange: (value) => setValue(value)
- * }} />
- * ```
- */
-export declare function DateControl({ control }: DateControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/controls/DateControl/DateControl.js

@@ -1,31 +0,0 @@
-import { jsx as m } from "react/jsx-runtime";
-import { useState as o, useEffect as r } from "react";
-import { Input as f } from "../../../Input/Input.js";
-function h({ control: e }) {
-  const n = e.event || "onBlur", [l, t] = o(e.value);
-  r(() => {
-    t(e.value);
-  }, [e.value]);
-  const s = (u) => {
-    const a = u.target.value;
-    t(a), n === "onChange" && e.onChange(a);
-  }, i = (u) => {
-    const a = u.target.value;
-    n === "onBlur" && e.onChange(a);
-  };
-  return /* @__PURE__ */ m(
-    f,
-    {
-      type: "date",
-      value: l,
-      min: e.min,
-      max: e.max,
-      disabled: e.disabled,
-      onChange: s,
-      ...n === "onBlur" && { onBlur: i }
-    }
-  );
-}
-export {
-  h as DateControl
-};

package/dist/components/ControlRenderer/controls/NumberControl/NumberControl.d.ts

@@ -1,30 +0,0 @@
-import { NumberControlProps } from './types';
-/**
- * Component that renders a number control with configurable event handling
- * @param control - The control to render
- * @param control.event - When to trigger onChange: "onChange" (real-time) or "onBlur" (on focus loss). Defaults to "onBlur"
- * @returns The number control component
- *
- * @example
- * ```typescript
- * // Real-time updates
- * <NumberControl control={{
- *   type: 'number',
- *   value: 10,
- *   min: 0,
- *   max: 100,
- *   step: 1,
- *   event: 'onChange',
- *   onChange: (value) => setValue(value)
- * }} />
- *
- * // Updates only when losing focus (default behavior)
- * <NumberControl control={{
- *   type: 'number',
- *   value: 10,
- *   event: 'onBlur', // or omit for default
- *   onChange: (value) => setValue(value)
- * }} />
- * ```
- */
-export declare function NumberControl({ control }: NumberControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/controls/NumberControl/NumberControl.js

@@ -1,32 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import { useState as i, useEffect as p } from "react";
-import { Input as f } from "../../../Input/Input.js";
-function v({ control: e }) {
-  const n = e.event || "onChange", [m, t] = i(e.value);
-  p(() => {
-    t(e.value);
-  }, [e.value]);
-  const s = (u) => {
-    const a = Number(u.target.value);
-    t(a), n === "onChange" && e.onChange(a);
-  }, l = (u) => {
-    const a = Number(u.target.value);
-    n === "onBlur" && e.onChange(a);
-  };
-  return /* @__PURE__ */ r(
-    f,
-    {
-      type: "number",
-      value: m,
-      min: e.min,
-      max: e.max,
-      step: e.step,
-      disabled: e.disabled,
-      onChange: s,
-      ...n === "onBlur" && { onBlur: l }
-    }
-  );
-}
-export {
-  v as NumberControl
-};

package/dist/components/ControlRenderer/controls/RangeControl/RangeControl.d.ts

@@ -1,30 +0,0 @@
-import { RangeControlProps } from './types';
-/**
- * Component that renders a range/slider control with configurable event handling
- * @param control - The control to render
- * @param control.event - When to trigger onChange: "onChange" (real-time) or "onBlur" (on focus loss). Defaults to "onChange"
- * @returns The range control component
- *
- * @example
- * ```typescript
- * // Real-time updates (default)
- * <RangeControl control={{
- *   type: 'range',
- *   value: 50,
- *   min: 0,
- *   max: 100,
- *   step: 1,
- *   event: 'onChange',
- *   onChange: (value) => setValue(value)
- * }} />
- *
- * // Updates only when losing focus
- * <RangeControl control={{
- *   type: 'range',
- *   value: 50,
- *   event: 'onBlur',
- *   onChange: (value) => setValue(value)
- * }} />
- * ```
- */
-export declare function RangeControl({ control }: RangeControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/controls/RangeControl/RangeControl.js

@@ -1,40 +0,0 @@
-import { jsxs as g, jsx as r } from "react/jsx-runtime";
-import { useState as o, useEffect as m } from "react";
-import '../../../../assets/RangeControl.css';const v = "_container_1ewrb_1", h = "_range_1ewrb_9", d = "_value_1ewrb_116", t = {
-  container: v,
-  range: h,
-  value: d
-};
-function b({ control: e }) {
-  const n = e.event || "onChange", [u, l] = o(e.value);
-  m(() => {
-    l(e.value);
-  }, [e.value]);
-  const i = (s) => {
-    const a = Number(s.target.value);
-    l(a), n === "onChange" && e.onChange(a);
-  }, c = (s) => {
-    const a = Number(s.target.value);
-    n === "onBlur" && e.onChange(a);
-  };
-  return /* @__PURE__ */ g("div", { className: t.container, children: [
-    /* @__PURE__ */ r(
-      "input",
-      {
-        type: "range",
-        value: u,
-        min: e.min,
-        max: e.max,
-        step: e.step,
-        disabled: e.disabled,
-        onChange: i,
-        ...n === "onBlur" && { onBlur: c },
-        className: t.range
-      }
-    ),
-    /* @__PURE__ */ r("span", { className: t.value, children: u })
-  ] });
-}
-export {
-  b as RangeControl
-};

package/dist/components/ControlRenderer/controls/SelectControl/SelectControl.d.ts

@@ -1,15 +0,0 @@
-import { SelectControlProps } from './types';
-/**
- * Component that renders a select control
- * @param control - The control to render
- * @returns The select control component
- *
- * @example
- * ```typescript
- * <SelectControl control={{
- *   type: 'select',
- *   value: 'option1',
- *   options: ['option1', 'option2', 'option3'],
- * }} />
- */
-export declare function SelectControl({ control }: SelectControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/controls/SelectControl/SelectControl.js

@@ -1,11 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import { Select as n } from "../../../Select/Select.js";
-function s({ control: a }) {
-  return /* @__PURE__ */ t(n, { value: a.value, disabled: a.disabled, onChange: (e) => a.onChange(e.target.value), children: a.options.map((e) => {
-    const l = typeof e == "string" ? e : e.value, r = typeof e == "string" ? e : e.label;
-    return /* @__PURE__ */ t("option", { value: l, children: r }, l);
-  }) });
-}
-export {
-  s as SelectControl
-};

package/dist/components/ControlRenderer/controls/SeparatorControl/SeparatorControl.d.ts

@@ -1,30 +0,0 @@
-import { SeparatorControlProps } from './types';
-/**
- * Component that renders a visual separator to organize control groups
- * @param control - The control to render
- * @param control.style - The style of separator: "line" (default), "space", or "label"
- * @param control.label - Optional label text (only shown when style is "label")
- * @returns The separator control component
- *
- * @example
- * ```typescript
- * // Simple line separator
- * <SeparatorControl control={{
- *   type: 'separator'
- * }} />
- *
- * // Separator with label
- * <SeparatorControl control={{
- *   type: 'separator',
- *   style: 'label',
- *   label: 'Advanced Settings'
- * }} />
- *
- * // Space separator
- * <SeparatorControl control={{
- *   type: 'separator',
- *   style: 'space'
- * }} />
- * ```
- */
-export declare function SeparatorControl({ control }: SeparatorControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/controls/SeparatorControl/SeparatorControl.js

@@ -1,14 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import '../../../../assets/SeparatorControl.css';const s = "_line_12cvo_1", c = "_space_12cvo_9", t = "_labelContainer_12cvo_14", i = "_label_12cvo_14", l = {
-  line: s,
-  space: c,
-  labelContainer: t,
-  label: i
-};
-function r({ control: a }) {
-  const n = a.style || "line";
-  return n === "space" ? /* @__PURE__ */ e("div", { className: l.space }) : n === "label" && a.label ? /* @__PURE__ */ e("div", { className: l.labelContainer, children: /* @__PURE__ */ e("span", { className: l.label, children: a.label }) }) : /* @__PURE__ */ e("div", { className: l.line });
-}
-export {
-  r as SeparatorControl
-};

package/dist/components/ControlRenderer/controls/TextControl/TextControl.d.ts

@@ -1,29 +0,0 @@
-import { TextControlProps } from './types';
-/**
- * Component that renders a text control with configurable event handling
- * @param control - The control to render
- * @param control.event - When to trigger onChange: "onChange" (real-time) or "onBlur" (on focus loss). Defaults to "onBlur"
- * @returns The text control component
- *
- * @example
- * ```typescript
- * // Real-time updates
- * <TextControl control={{
- *   type: 'text',
- *   value: 'Hello',
- *   placeholder: 'Enter your name',
- *   event: 'onChange',
- *   onChange: (value) => setValue(value)
- * }} />
- *
- * // Updates only when losing focus (default behavior)
- * <TextControl control={{
- *   type: 'text',
- *   value: 'Hello',
- *   placeholder: 'Enter your name',
- *   event: 'onBlur', // or omit for default
- *   onChange: (value) => setValue(value)
- * }} />
- * ```
- */
-export declare function TextControl({ control }: TextControlProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ControlRenderer/controls/TextControl/TextControl.js

@@ -1,30 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import { useState as h, useEffect as p } from "react";
-import { Input as d } from "../../../Input/Input.js";
-function v({ control: e }) {
-  const n = e.event || "onChange", [u, l] = h(e.value);
-  p(() => {
-    l(e.value);
-  }, [e.value]);
-  const o = (t) => {
-    const a = t.target.value;
-    l(a), n === "onChange" && e.onChange(a);
-  }, s = (t) => {
-    const a = t.target.value;
-    n === "onBlur" && e.onChange(a);
-  };
-  return /* @__PURE__ */ r(
-    d,
-    {
-      type: "text",
-      value: u,
-      placeholder: e.placeholder,
-      disabled: e.disabled,
-      onChange: o,
-      ...n === "onBlur" && { onBlur: s }
-    }
-  );
-}
-export {
-  v as TextControl
-};

package/dist/components/DevPanel/DevPanel.d.ts

@@ -1,11 +0,0 @@
-import { DevPanelProps } from './types';
-/**
- * Development panel component
- * @returns The development panel component, if the environment is not development, it will return null
- *
- * @example
- * ```typescript
- * <DevPanel />
- * ```
- */
-export declare function DevPanel({ panelTitle, ...props }: DevPanelProps): import("react/jsx-runtime").JSX.Element | null;