@tpitre/story-ui 3.3.0 → 3.4.0

package/dist/playground/components/PropertyEditors/BooleanEditor.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * BooleanEditor - Toggle switch for boolean properties using MUI Switch
+ */
+import { useCallback } from 'react';
+import { Switch, FormControlLabel, FormGroup } from '@mui/material';
+import styles from './PropertyEditors.module.css';
+export const BooleanEditor = ({ value = false, onChange, label, description }) => {
+    const handleToggle = useCallback(() => {
+        onChange(!value);
+    }, [value, onChange]);
+    return (_jsx("div", { className: styles.propertyEditor, children: _jsx(FormGroup, { children: _jsx(FormControlLabel, { control: _jsx(Switch, { checked: value, onChange: handleToggle, size: "small", color: "primary" }), label: _jsxs("div", { children: [label && _jsx("span", { className: styles.label, children: label }), description && _jsx("span", { className: styles.description, children: description })] }), labelPlacement: "end" }) }) }));
+};
+//# sourceMappingURL=BooleanEditor.js.map

package/dist/playground/components/PropertyEditors/BooleanEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BooleanEditor.js","sourceRoot":"","sources":["../../../../playground/components/PropertyEditors/BooleanEditor.tsx"],"names":[],"mappings":";AAAA;;GAEG;AAEH,OAAc,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AACpE,OAAO,MAAM,MAAM,8BAA8B,CAAC;AASlD,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAC1D,KAAK,GAAG,KAAK,EACb,QAAQ,EACR,KAAK,EACL,WAAW,EACZ,EAAE,EAAE;IACH,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE;QACpC,QAAQ,CAAC,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEtB,OAAO,CACL,cAAK,SAAS,EAAE,MAAM,CAAC,cAAc,YACnC,KAAC,SAAS,cACR,KAAC,gBAAgB,IACf,OAAO,EACL,KAAC,MAAM,IACL,OAAO,EAAE,KAAK,EACd,QAAQ,EAAE,YAAY,EACtB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,SAAS,GACf,EAEJ,KAAK,EACH,0BACG,KAAK,IAAI,eAAM,SAAS,EAAE,MAAM,CAAC,KAAK,YAAG,KAAK,GAAQ,EACtD,WAAW,IAAI,eAAM,SAAS,EAAE,MAAM,CAAC,WAAW,YAAG,WAAW,GAAQ,IACrE,EAER,cAAc,EAAC,KAAK,GACpB,GACQ,GACR,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/playground/components/PropertyEditors/ColorEditor.d.ts

@@ -0,0 +1,12 @@
+/**
+ * ColorEditor - Color picker for color properties with MUI
+ */
+import React from 'react';
+export interface ColorEditorProps {
+    value?: string;
+    onChange: (value: string) => void;
+    label?: string;
+    presets?: string[];
+}
+export declare const ColorEditor: React.FC<ColorEditorProps>;
+//# sourceMappingURL=ColorEditor.d.ts.map

package/dist/playground/components/PropertyEditors/ColorEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorEditor.d.ts","sourceRoot":"","sources":["../../../../playground/components/PropertyEditors/ColorEditor.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAA2C,MAAM,OAAO,CAAC;AAIhE,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB;AAeD,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAwHlD,CAAC"}

package/dist/playground/components/PropertyEditors/ColorEditor.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * ColorEditor - Color picker for color properties with MUI
+ */
+import { useState, useCallback, useEffect } from 'react';
+import { TextField, Box, IconButton, Popover } from '@mui/material';
+import styles from './PropertyEditors.module.css';
+const DEFAULT_PRESETS = [
+    '#000000',
+    '#FFFFFF',
+    '#EF4444', // red
+    '#F59E0B', // amber
+    '#10B981', // emerald
+    '#3B82F6', // blue
+    '#8B5CF6', // violet
+    '#EC4899', // pink
+    '#6B7280', // gray
+    '#F3F4F6', // light gray
+];
+export const ColorEditor = ({ value = '#000000', onChange, label, presets = DEFAULT_PRESETS }) => {
+    const [localValue, setLocalValue] = useState(value);
+    const [anchorEl, setAnchorEl] = useState(null);
+    useEffect(() => {
+        setLocalValue(value);
+    }, [value]);
+    const handleChange = useCallback((e) => {
+        const newValue = e.target.value;
+        setLocalValue(newValue);
+        onChange(newValue);
+    }, [onChange]);
+    const handlePresetClick = useCallback((color) => {
+        setLocalValue(color);
+        onChange(color);
+        setAnchorEl(null);
+    }, [onChange]);
+    const handlePopoverOpen = useCallback((event) => {
+        setAnchorEl(event.currentTarget);
+    }, []);
+    const handlePopoverClose = useCallback(() => {
+        setAnchorEl(null);
+    }, []);
+    const open = Boolean(anchorEl);
+    return (_jsxs("div", { className: styles.propertyEditor, children: [_jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [_jsx(Box, { width: 32, height: 32, bgcolor: localValue, border: "1px solid #e5e7eb", borderRadius: 1, sx: { cursor: 'pointer' }, onClick: handlePopoverOpen }), _jsx(TextField, { label: label, value: localValue, onChange: handleChange, placeholder: "#000000", size: "small", fullWidth: true, inputProps: {
+                            style: { fontSize: '13px' }
+                        }, sx: {
+                            '& .MuiInputLabel-root': {
+                                fontSize: '12px'
+                            }
+                        } }), _jsx(IconButton, { size: "small", onClick: handlePopoverOpen, children: "\uD83C\uDFA8" }), _jsx("input", { type: "color", value: localValue, onChange: handleChange, style: {
+                            width: 0,
+                            height: 0,
+                            border: 'none',
+                            visibility: 'hidden'
+                        } })] }), _jsx(Popover, { open: open, anchorEl: anchorEl, onClose: handlePopoverClose, anchorOrigin: {
+                    vertical: 'bottom',
+                    horizontal: 'left',
+                }, transformOrigin: {
+                    vertical: 'top',
+                    horizontal: 'left',
+                }, children: _jsx(Box, { p: 2, maxWidth: 200, children: _jsx(Box, { display: "flex", flexWrap: "wrap", gap: 1, maxWidth: 160, children: presets.map((color) => (_jsx(Box, { width: 28, height: 28, bgcolor: color, border: "1px solid #e5e7eb", borderRadius: 0.5, sx: { cursor: 'pointer' }, onClick: () => handlePresetClick(color), title: color }, color))) }) }) })] }));
+};
+//# sourceMappingURL=ColorEditor.js.map

package/dist/playground/components/PropertyEditors/ColorEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorEditor.js","sourceRoot":"","sources":["../../../../playground/components/PropertyEditors/ColorEditor.tsx"],"names":[],"mappings":"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"}

package/dist/playground/components/PropertyEditors/IconEditor.d.ts

@@ -0,0 +1,12 @@
+/**
+ * IconEditor - Icon selector for icon properties using MUI Icons
+ */
+import React from 'react';
+export interface IconEditorProps {
+    value?: string;
+    onChange: (value: string) => void;
+    label?: string;
+    placeholder?: string;
+}
+export declare const IconEditor: React.FC<IconEditorProps>;
+//# sourceMappingURL=IconEditor.d.ts.map

package/dist/playground/components/PropertyEditors/IconEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconEditor.d.ts","sourceRoot":"","sources":["../../../../playground/components/PropertyEditors/IconEditor.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAyC,MAAM,OAAO,CAAC;AAuE9D,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAyMhD,CAAC"}

package/dist/playground/components/PropertyEditors/IconEditor.js

@@ -0,0 +1,123 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * IconEditor - Icon selector for icon properties using MUI Icons
+ */
+import { useState, useCallback, useMemo } from 'react';
+import { TextField, IconButton, Popover, Box, Typography, InputAdornment, Chip } from '@mui/material';
+// Simple icon components using Unicode/emoji
+const IconComponent = ({ icon }) => (_jsx("span", { style: { fontSize: '16px', display: 'inline-block' }, children: icon }));
+import styles from './PropertyEditors.module.css';
+// Available icons with their emoji representations
+const AVAILABLE_ICONS = [
+    { name: 'Home', icon: '🏠', keywords: ['home', 'house', 'main'] },
+    { name: 'Settings', icon: '⚙️', keywords: ['settings', 'config', 'gear', 'preferences'] },
+    { name: 'Person', icon: '👤', keywords: ['person', 'user', 'profile', 'account'] },
+    { name: 'Mail', icon: '✉️', keywords: ['mail', 'email', 'message', 'contact'] },
+    { name: 'Phone', icon: '📞', keywords: ['phone', 'call', 'contact', 'telephone'] },
+    { name: 'Favorite', icon: '❤️', keywords: ['heart', 'love', 'like', 'favorite'] },
+    { name: 'Star', icon: '⭐', keywords: ['star', 'rating', 'favorite', 'bookmark'] },
+    { name: 'Add', icon: '➕', keywords: ['add', 'plus', 'create', 'new'] },
+    { name: 'Edit', icon: '✏️', keywords: ['edit', 'pencil', 'modify', 'change'] },
+    { name: 'Delete', icon: '🗑️', keywords: ['delete', 'remove', 'trash', 'bin'] },
+    { name: 'Visibility', icon: '👁️', keywords: ['show', 'eye', 'view', 'visible'] },
+    { name: 'VisibilityOff', icon: '🙈', keywords: ['hide', 'hidden', 'invisible'] },
+    { name: 'Download', icon: '⬇️', keywords: ['download', 'save', 'export'] },
+    { name: 'Upload', icon: '⬆️', keywords: ['upload', 'import', 'attach'] },
+    { name: 'Share', icon: '🔗', keywords: ['share', 'send', 'forward'] },
+    { name: 'Save', icon: '💾', keywords: ['save', 'disk', 'store'] },
+    { name: 'Print', icon: '🖨️', keywords: ['print', 'printer', 'output'] },
+    { name: 'Refresh', icon: '🔄', keywords: ['refresh', 'reload', 'sync', 'update'] },
+    { name: 'ArrowBack', icon: '⬅️', keywords: ['back', 'previous', 'left', 'return'] },
+    { name: 'ArrowForward', icon: '➡️', keywords: ['forward', 'next', 'right', 'continue'] },
+    { name: 'ArrowUpward', icon: '⬆️', keywords: ['up', 'top', 'ascend'] },
+    { name: 'ArrowDownward', icon: '⬇️', keywords: ['down', 'bottom', 'descend'] },
+    { name: 'Check', icon: '✓', keywords: ['check', 'done', 'complete', 'tick', 'success'] },
+    { name: 'Clear', icon: '❌', keywords: ['clear', 'close', 'cancel', 'x'] },
+    { name: 'Warning', icon: '⚠️', keywords: ['warning', 'alert', 'caution'] },
+    { name: 'Error', icon: '⛔', keywords: ['error', 'alert', 'danger', 'problem'] },
+    { name: 'Info', icon: 'ℹ️', keywords: ['info', 'information', 'details'] },
+    { name: 'Help', icon: '❓', keywords: ['help', 'question', 'support'] },
+    { name: 'Menu', icon: '☰', keywords: ['menu', 'hamburger', 'navigation'] },
+    { name: 'MoreVert', icon: '⋮', keywords: ['more', 'options', 'dots', 'vertical'] },
+    { name: 'FilterList', icon: '📊', keywords: ['filter', 'sort', 'organize'] },
+    { name: 'Sort', icon: '🔄', keywords: ['sort', 'order', 'arrange'] },
+    { name: 'Search', icon: '🔍', keywords: ['search', 'find', 'lookup'] },
+    { name: 'Notifications', icon: '🔔', keywords: ['notifications', 'bell', 'alerts'] },
+    { name: 'AccountCircle', icon: '👤', keywords: ['account', 'profile', 'user', 'avatar'] },
+    { name: 'ShoppingCart', icon: '🛒', keywords: ['cart', 'shopping', 'basket', 'buy'] },
+    { name: 'Dashboard', icon: '📊', keywords: ['dashboard', 'overview', 'summary'] },
+    { name: 'Business', icon: '🏢', keywords: ['business', 'company', 'office'] },
+    { name: 'School', icon: '🏫', keywords: ['school', 'education', 'learning'] },
+    { name: 'Work', icon: '💼', keywords: ['work', 'job', 'career', 'briefcase'] },
+    { name: 'Event', icon: '📅', keywords: ['event', 'calendar', 'date'] },
+    { name: 'Today', icon: '📆', keywords: ['today', 'calendar', 'date', 'current'] },
+    { name: 'Schedule', icon: '⏰', keywords: ['schedule', 'time', 'clock'] },
+    { name: 'LocationOn', icon: '📍', keywords: ['location', 'place', 'map', 'pin'] },
+    { name: 'Language', icon: '🌐', keywords: ['language', 'globe', 'international'] },
+    { name: 'Lock', icon: '🔒', keywords: ['lock', 'secure', 'private', 'protected'] },
+    { name: 'LockOpen', icon: '🔓', keywords: ['unlock', 'open', 'public'] },
+    { name: 'Security', icon: '🛡️', keywords: ['security', 'shield', 'protection'] },
+    { name: 'Logout', icon: '🚪', keywords: ['logout', 'exit', 'signout'] },
+    { name: 'Login', icon: '🚾', keywords: ['login', 'signin', 'enter'] }
+];
+export const IconEditor = ({ value, onChange, label, placeholder = 'Select icon...' }) => {
+    const [anchorEl, setAnchorEl] = useState(null);
+    const [searchTerm, setSearchTerm] = useState('');
+    const selectedIcon = useMemo(() => {
+        return AVAILABLE_ICONS.find(icon => icon.name === value);
+    }, [value]);
+    const filteredIcons = useMemo(() => {
+        if (!searchTerm)
+            return AVAILABLE_ICONS;
+        const term = searchTerm.toLowerCase();
+        return AVAILABLE_ICONS.filter(icon => icon.name.toLowerCase().includes(term) ||
+            icon.keywords.some(keyword => keyword.includes(term)));
+    }, [searchTerm]);
+    const handlePopoverOpen = useCallback((event) => {
+        setAnchorEl(event.currentTarget);
+    }, []);
+    const handlePopoverClose = useCallback(() => {
+        setAnchorEl(null);
+        setSearchTerm('');
+    }, []);
+    const handleIconSelect = useCallback((iconName) => {
+        onChange(iconName);
+        handlePopoverClose();
+    }, [onChange, handlePopoverClose]);
+    const handleClear = useCallback(() => {
+        onChange('');
+    }, [onChange]);
+    const open = Boolean(anchorEl);
+    return (_jsxs("div", { className: styles.propertyEditor, children: [_jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [selectedIcon && (_jsx(Box, { width: 32, height: 32, display: "flex", alignItems: "center", justifyContent: "center", border: "1px solid #e5e7eb", borderRadius: 1, bgcolor: "#f9fafb", children: _jsx(IconComponent, { icon: selectedIcon.icon }) })), _jsx(TextField, { label: label, value: selectedIcon ? selectedIcon.name : value || '', placeholder: placeholder, size: "small", fullWidth: true, onClick: handlePopoverOpen, InputProps: {
+                            readOnly: true,
+                            endAdornment: (_jsxs(InputAdornment, { position: "end", children: [value && (_jsx(IconButton, { size: "small", onClick: handleClear, children: "\u274C" })), _jsx(IconButton, { size: "small", onClick: handlePopoverOpen, children: "\uD83D\uDD0D" })] })),
+                            style: { cursor: 'pointer', fontSize: '13px' }
+                        }, sx: {
+                            '& .MuiInputLabel-root': {
+                                fontSize: '12px'
+                            }
+                        } })] }), _jsx(Popover, { open: open, anchorEl: anchorEl, onClose: handlePopoverClose, anchorOrigin: {
+                    vertical: 'bottom',
+                    horizontal: 'left',
+                }, transformOrigin: {
+                    vertical: 'top',
+                    horizontal: 'left',
+                }, PaperProps: {
+                    sx: { width: 400, maxHeight: 500 }
+                }, children: _jsxs(Box, { p: 2, children: [_jsx(TextField, { placeholder: "Search icons...", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), size: "small", fullWidth: true, InputProps: {
+                                startAdornment: (_jsx(InputAdornment, { position: "start", children: "\uD83D\uDD0D" }))
+                            }, sx: { mb: 2 } }), selectedIcon && (_jsxs(Box, { mb: 2, children: [_jsx(Typography, { variant: "caption", color: "textSecondary", children: "Current Selection:" }), _jsx(Box, { mt: 1, children: _jsx(Chip, { icon: _jsx(IconComponent, { icon: selectedIcon.icon }), label: selectedIcon.name, onDelete: handleClear, color: "primary", variant: "outlined" }) })] })), _jsxs(Box, { maxHeight: 300, overflow: "auto", children: [_jsx(Box, { display: "flex", flexWrap: "wrap", gap: 1, children: filteredIcons.map((icon) => {
+                                        const isSelected = value === icon.name;
+                                        return (_jsxs(Box, { display: "flex", flexDirection: "column", alignItems: "center", gap: 0.5, p: 1, border: 1, borderColor: isSelected ? 'primary.main' : 'grey.300', borderRadius: 1, bgcolor: isSelected ? 'primary.50' : 'transparent', width: 80, sx: {
+                                                cursor: 'pointer',
+                                                '&:hover': {
+                                                    bgcolor: isSelected ? 'primary.100' : 'grey.50'
+                                                }
+                                            }, onClick: () => handleIconSelect(icon.name), children: [_jsx(IconComponent, { icon: icon.icon }), _jsx(Typography, { variant: "caption", textAlign: "center", sx: {
+                                                        fontSize: '10px',
+                                                        lineHeight: 1,
+                                                        color: isSelected ? 'primary.main' : 'text.secondary'
+                                                    }, children: icon.name })] }, icon.name));
+                                    }) }), filteredIcons.length === 0 && (_jsx(Box, { textAlign: "center", py: 4, children: _jsxs(Typography, { variant: "body2", color: "textSecondary", children: ["No icons found matching \"", searchTerm, "\""] }) }))] })] }) })] }));
+};
+//# sourceMappingURL=IconEditor.js.map

package/dist/playground/components/PropertyEditors/IconEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconEditor.js","sourceRoot":"","sources":["../../../../playground/components/PropertyEditors/IconEditor.tsx"],"names":[],"mappings":"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"}

package/dist/playground/components/PropertyEditors/NumberEditor.d.ts

@@ -0,0 +1,15 @@
+/**
+ * NumberEditor - Number input with optional min/max and step using MUI
+ */
+import React from 'react';
+export interface NumberEditorProps {
+    value?: number;
+    onChange: (value: number) => void;
+    label?: string;
+    min?: number;
+    max?: number;
+    step?: number;
+    unit?: string;
+}
+export declare const NumberEditor: React.FC<NumberEditorProps>;
+//# sourceMappingURL=NumberEditor.d.ts.map

package/dist/playground/components/PropertyEditors/NumberEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberEditor.d.ts","sourceRoot":"","sources":["../../../../playground/components/PropertyEditors/NumberEditor.tsx"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAA2C,MAAM,OAAO,CAAC;AAIhE,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAuFpD,CAAC"}

package/dist/playground/components/PropertyEditors/NumberEditor.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * NumberEditor - Number input with optional min/max and step using MUI
+ */
+import { useState, useCallback, useEffect } from 'react';
+import { TextField, IconButton, InputAdornment, Box } from '@mui/material';
+import styles from './PropertyEditors.module.css';
+export const NumberEditor = ({ value = 0, onChange, label, min, max, step = 1, unit }) => {
+    const [localValue, setLocalValue] = useState(value.toString());
+    useEffect(() => {
+        setLocalValue(value.toString());
+    }, [value]);
+    const handleChange = useCallback((e) => {
+        const newValue = e.target.value;
+        setLocalValue(newValue);
+        const numValue = parseFloat(newValue);
+        if (!isNaN(numValue)) {
+            onChange(numValue);
+        }
+    }, [onChange]);
+    const handleIncrement = useCallback(() => {
+        const current = parseFloat(localValue) || 0;
+        const newValue = Math.min(current + step, max ?? Infinity);
+        setLocalValue(newValue.toString());
+        onChange(newValue);
+    }, [localValue, step, max, onChange]);
+    const handleDecrement = useCallback(() => {
+        const current = parseFloat(localValue) || 0;
+        const newValue = Math.max(current - step, min ?? -Infinity);
+        setLocalValue(newValue.toString());
+        onChange(newValue);
+    }, [localValue, step, min, onChange]);
+    return (_jsx("div", { className: styles.propertyEditor, children: _jsxs(Box, { display: "flex", alignItems: "center", gap: 1, children: [_jsx(IconButton, { size: "small", onClick: handleDecrement, disabled: min !== undefined && parseFloat(localValue) <= min, children: "\u2796" }), _jsx(TextField, { label: label, type: "number", value: localValue, onChange: handleChange, size: "small", fullWidth: true, inputProps: {
+                        min,
+                        max,
+                        step,
+                        style: { fontSize: '13px', textAlign: 'center' }
+                    }, InputProps: {
+                        endAdornment: unit ? (_jsx(InputAdornment, { position: "end", children: _jsx("span", { style: { fontSize: '12px', color: '#6b7280' }, children: unit }) })) : undefined
+                    }, sx: {
+                        '& .MuiInputLabel-root': {
+                            fontSize: '12px'
+                        }
+                    } }), _jsx(IconButton, { size: "small", onClick: handleIncrement, disabled: max !== undefined && parseFloat(localValue) >= max, children: "\u2795" })] }) }));
+};
+//# sourceMappingURL=NumberEditor.js.map

package/dist/playground/components/PropertyEditors/NumberEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberEditor.js","sourceRoot":"","sources":["../../../../playground/components/PropertyEditors/NumberEditor.tsx"],"names":[],"mappings":"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"}