@vtx-ui/react 0.0.1-beta.16 → 0.0.1-beta.17

package/dist/cjs/components/Button/components/Button/index.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_Button_Button = require('./Button.js');
+
+
+
+exports.Button = components_Button_Button["default"];
+exports.ButtonComponent = components_Button_Button["default"];
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Button/components/Button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/cjs/components/Card/components/Card/Card.js

@@ -0,0 +1,105 @@
+"use client";
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var theme_ThemeProvider = require('../../../../theme/theme/ThemeProvider.js');
+require('../../../../theme/theme/tokens.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * Card component - Container for grouping related content
+ *
+ * A versatile card component with support for variants, padding control,
+ * headers, footers, and interactive states.
+ *
+ * @example
+ * Basic card
+ * ```tsx
+ * <Card>
+ *   <h3>Card Title</h3>
+ *   <p>Card content goes here</p>
+ * </Card>
+ * ```
+ *
+ * @example
+ * Card without padding
+ * ```tsx
+ * <Card noPadding>
+ *   <img src="image.jpg" alt="Full bleed image" />
+ * </Card>
+ * ```
+ *
+ * @example
+ * Card with custom padding
+ * ```tsx
+ * <Card padding="32px">
+ *   <p>Card with custom padding</p>
+ * </Card>
+ * ```
+ *
+ * @example
+ * Card with header and footer
+ * ```tsx
+ * <Card
+ *   header={<h3>Card Header</h3>}
+ *   footer={<button>Action</button>}
+ *   divider
+ * >
+ *   <p>Card content</p>
+ * </Card>
+ * ```
+ *
+ * @example
+ * Interactive card
+ * ```tsx
+ * <Card hoverable clickable onClick={() => console.log('clicked')}>
+ *   <p>Click me!</p>
+ * </Card>
+ * ```
+ *
+ * @example
+ * Customize appearance with CSS
+ * ```css
+ * .vtx-card {
+ *   --vtx-card-bg: #ffffff;
+ *   --vtx-card-border-radius: 8px;
+ *   --vtx-card-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+ *   --vtx-card-padding: 16px;
+ * }
+ * ```
+ */
+const Card = React__default["default"].forwardRef(({ children, variant = 'elevated', size, noPadding = false, padding, hoverable = false, clickable = false, className = '', header, footer, divider = false, style, onClick, tabIndex, ...props }, ref) => {
+    const { theme } = theme_ThemeProvider.useThemeContext();
+    const cardSize = size || (theme === null || theme === void 0 ? void 0 : theme.defaultSize) || 'md';
+    // Compose class names
+    const cardClassNames = [
+        'vtx-card',
+        `vtx-card--${variant}`,
+        `vtx-card--${cardSize}`,
+        hoverable ? 'vtx-card--hoverable' : '',
+        clickable ? 'vtx-card--clickable' : '',
+        noPadding && !padding ? 'vtx-card--no-padding' : '',
+        className,
+    ]
+        .filter(Boolean)
+        .join(' ');
+    // Compose style, ensuring custom property is set if padding is provided
+    const customStyle = {
+        ...(style || {}),
+        ...(padding ? { ['--vtx-card-padding']: padding } : {}),
+    };
+    // If clickable, set tabIndex to 0 by default unless provided
+    const computedTabIndex = clickable ? (typeof tabIndex === 'number' ? tabIndex : 0) : tabIndex;
+    return (jsxRuntime.jsxs("div", { ref: ref, className: cardClassNames, style: customStyle, onClick: onClick, tabIndex: computedTabIndex, ...props, children: [header && (jsxRuntime.jsx("div", { className: `vtx-card-header${divider ? ' vtx-card-header--divider' : ''}`, children: header })), jsxRuntime.jsx("div", { className: "vtx-card-content", children: children }), footer && (jsxRuntime.jsx("div", { className: `vtx-card-footer${divider ? ' vtx-card-footer--divider' : ''}`, children: footer }))] }));
+});
+Card.displayName = 'Card';
+
+exports.Card = Card;
+exports["default"] = Card;
+//# sourceMappingURL=Card.js.map

package/dist/cjs/components/Card/components/Card/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","sources":["../../../../../../src/components/Card/Card.tsx"],"sourcesContent":[null],"names":["React","useThemeContext","_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;AA4DA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6DG;AAEG,MAAA,IAAI,GAAGA,yBAAK,CAAC,UAAU,CAC3B,CACE,EACE,QAAQ,EACR,OAAO,GAAG,UAAU,EACpB,IAAI,EACJ,SAAS,GAAG,KAAK,EACjB,OAAO,EACP,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,EAAE,EACd,MAAM,EACN,MAAM,EACN,OAAO,GAAG,KAAK,EACf,KAAK,EACL,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,EAAE,KAAK,EAAE,GAAGC,mCAAe,EAAE,CAAC;AACpC,IAAA,MAAM,QAAQ,GAAG,IAAI,KAAI,KAAK,KAAL,IAAA,IAAA,KAAK,KAAL,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,KAAK,CAAE,WAAW,CAAA,IAAI,IAAI,CAAC;;AAGpD,IAAA,MAAM,cAAc,GAAG;QACrB,UAAU;AACV,QAAA,CAAA,UAAA,EAAa,OAAO,CAAE,CAAA;AACtB,QAAA,CAAA,UAAA,EAAa,QAAQ,CAAE,CAAA;AACvB,QAAA,SAAS,GAAG,qBAAqB,GAAG,EAAE;AACtC,QAAA,SAAS,GAAG,qBAAqB,GAAG,EAAE;QACtC,SAAS,IAAI,CAAC,OAAO,GAAG,sBAAsB,GAAG,EAAE;QACnD,SAAS;AACV,KAAA;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;;AAGb,IAAA,MAAM,WAAW,GAAwB;AACvC,QAAA,IAAI,KAAK,IAAI,EAAE,CAAC;AAChB,QAAA,IAAI,OAAO,GAAG,EAAE,CAAC,oBAA2B,GAAG,OAAO,EAAE,GAAG,EAAE,CAAC;KAC/D,CAAC;;IAGF,MAAM,gBAAgB,GAAG,SAAS,IAAI,OAAO,QAAQ,KAAK,QAAQ,GAAG,QAAQ,GAAG,CAAC,IAAI,QAAQ,CAAC;AAE9F,IAAA,QACEC,eACE,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,cAAc,EACzB,KAAK,EAAE,WAAW,EAClB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,gBAAgB,EACtB,GAAA,KAAK,EAER,QAAA,EAAA,CAAA,MAAM,KACLC,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,kBAAkB,OAAO,GAAG,2BAA2B,GAAG,EAAE,EAAE,EAC3E,QAAA,EAAA,MAAM,EACH,CAAA,CACP,EACDA,cAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,kBAAkB,YAAE,QAAQ,EAAA,CAAO,EACjD,MAAM,KACLA,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,kBAAkB,OAAO,GAAG,2BAA2B,GAAG,EAAE,EAAE,EAC3E,QAAA,EAAA,MAAM,GACH,CACP,CAAA,EAAA,CACG,EACN;AACJ,CAAC,EACD;AAEF,IAAI,CAAC,WAAW,GAAG,MAAM;;;;;"}

package/dist/cjs/components/Card/components/Card/index.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_Card_Card = require('./Card.js');
+
+
+
+exports.Card = components_Card_Card["default"];
+exports.CardComponent = components_Card_Card["default"];
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Card/components/Card/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/cjs/components/Checkbox/components/Checkbox/Checkbox.js

@@ -0,0 +1,103 @@
+"use client";
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var theme_ThemeProvider = require('../../../../theme/theme/ThemeProvider.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * Checkbox component - Allows users to select one or more items from a set
+ *
+ * The Checkbox component provides a customizable checkbox input with support
+ * for labels, error states, indeterminate state, and three sizes.
+ *
+ * ## CSS Customization
+ *
+ * You can customize the checkbox appearance using CSS custom properties:
+ *
+ * ```css
+ * :root {
+ *   --vtx-checkbox-color: #1976d2;
+ *   --vtx-checkbox-size: 20px;
+ *   --vtx-checkbox-border-width: 2px;
+ *   --vtx-checkbox-border-radius: 4px;
+ * }
+ * ```
+ *
+ * @example
+ * Basic checkbox
+ * ```tsx
+ * <Checkbox label="Accept terms and conditions" />
+ * ```
+ *
+ * @example
+ * Controlled checkbox with size
+ * ```tsx
+ * const [checked, setChecked] = useState(false);
+ * <Checkbox
+ *   checked={checked}
+ *   onChange={(e) => setChecked(e.target.checked)}
+ *   label="Subscribe to newsletter"
+ *   size="lg"
+ *   variant="secondary"
+ * />
+ * ```
+ *
+ * @example
+ * With error state
+ * ```tsx
+ * <Checkbox
+ *   label="I agree"
+ *   error
+ *   helperText="You must agree to continue"
+ * />
+ * ```
+ *
+ * @example
+ * Indeterminate state
+ * ```tsx
+ * <Checkbox
+ *   label="Select all"
+ *   indeterminate
+ * />
+ * ```
+ */
+const Checkbox = React__default["default"].forwardRef(({ checked, indeterminate = false, disabled = false, label, size, variant = 'primary', error = false, helperText, onChange, className = '', inputClassName = '', id, ...props }, ref) => {
+    // Get theme default size if size prop is not provided
+    const { theme } = theme_ThemeProvider.useThemeContext();
+    const checkboxSize = size || theme.defaultSize || 'md';
+    const generatedId = React.useId();
+    const checkboxId = id || generatedId;
+    // Build class names
+    const containerClassNames = [
+        'vtx-checkbox',
+        `vtx-checkbox--${checkboxSize}`,
+        `vtx-checkbox--${variant}`,
+        disabled && 'vtx-checkbox--disabled',
+        error && 'vtx-checkbox--error',
+        className,
+    ]
+        .filter(Boolean)
+        .join(' ');
+    const inputClassNames = ['vtx-checkbox-input', inputClassName].filter(Boolean).join(' ');
+    // Handle ref for indeterminate state
+    const inputRef = React.useRef(null);
+    React.useImperativeHandle(ref, () => inputRef.current);
+    React.useEffect(() => {
+        if (inputRef.current) {
+            inputRef.current.indeterminate = indeterminate;
+        }
+    }, [indeterminate]);
+    return (jsxRuntime.jsxs("div", { className: containerClassNames, children: [jsxRuntime.jsxs("label", { className: "vtx-checkbox-label", htmlFor: checkboxId, children: [jsxRuntime.jsxs("span", { className: "vtx-checkbox-wrapper", children: [jsxRuntime.jsx("input", { ref: inputRef, type: "checkbox", id: checkboxId, className: inputClassNames, checked: checked, disabled: disabled, onChange: onChange, ...props }), jsxRuntime.jsxs("span", { className: "vtx-checkbox-box", children: [jsxRuntime.jsx("svg", { className: "vtx-checkbox-icon vtx-checkbox-icon--check", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: jsxRuntime.jsx("path", { d: "M20 6L9 17L4 12", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round" }) }), jsxRuntime.jsx("svg", { className: "vtx-checkbox-icon vtx-checkbox-icon--indeterminate", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: jsxRuntime.jsx("path", { d: "M5 12H19", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round" }) })] })] }), label && jsxRuntime.jsx("span", { className: "vtx-checkbox-label-text", children: label })] }), helperText && jsxRuntime.jsx("div", { className: "vtx-checkbox-helper-text", children: helperText })] }));
+});
+Checkbox.displayName = 'Checkbox';
+
+exports.Checkbox = Checkbox;
+exports["default"] = Checkbox;
+//# sourceMappingURL=Checkbox.js.map

package/dist/cjs/components/Checkbox/components/Checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sources":["../../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":[null],"names":["React","useThemeContext","useId","useRef","useImperativeHandle","useEffect","_jsxs","_jsx"],"mappings":"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"}

package/dist/cjs/components/Checkbox/components/Checkbox/index.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_Checkbox_Checkbox = require('./Checkbox.js');
+
+
+
+exports.Checkbox = components_Checkbox_Checkbox["default"];
+exports.CheckboxComponent = components_Checkbox_Checkbox["default"];
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Checkbox/components/Checkbox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/cjs/components/CheckboxGroup/components/CheckboxGroup/CheckboxGroup.js

@@ -0,0 +1,106 @@
+"use client";
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var components_Checkbox_Checkbox = require('../../../Checkbox/components/Checkbox/Checkbox.js');
+var theme_ThemeProvider = require('../../../../theme/theme/ThemeProvider.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * CheckboxGroup component - Manages a group of related checkboxes
+ *
+ * The CheckboxGroup component provides a convenient way to manage multiple
+ * checkboxes with shared state, labels, and error handling.
+ *
+ * @example
+ * Basic usage
+ * ```tsx
+ * <CheckboxGroup
+ *   label="Select your interests"
+ *   options={[
+ *     { value: 'sports', label: 'Sports' },
+ *     { value: 'music', label: 'Music' },
+ *     { value: 'travel', label: 'Travel' },
+ *   ]}
+ * />
+ * ```
+ *
+ * @example
+ * Controlled mode
+ * ```tsx
+ * const [selected, setSelected] = useState(['sports']);
+ * <CheckboxGroup
+ *   label="Interests"
+ *   options={options}
+ *   value={selected}
+ *   onChange={setSelected}
+ * />
+ * ```
+ *
+ * @example
+ * Horizontal layout
+ * ```tsx
+ * <CheckboxGroup
+ *   label="Preferences"
+ *   options={options}
+ *   orientation="horizontal"
+ * />
+ * ```
+ *
+ * @example
+ * With error state
+ * ```tsx
+ * <CheckboxGroup
+ *   label="Required selection"
+ *   options={options}
+ *   error
+ *   helperText="Please select at least one option"
+ * />
+ * ```
+ */
+const CheckboxGroup = React__default["default"].forwardRef(({ label, options, value: controlledValue, defaultValue, onChange, disabled = false, error = false, helperText, orientation = 'vertical', size, className = '', ...props }, ref) => {
+    // Get theme default size if size prop is not provided
+    const { theme } = theme_ThemeProvider.useThemeContext();
+    const groupSize = size || theme.defaultSize || 'md';
+    // Internal state for uncontrolled mode
+    const [internalValue, setInternalValue] = React.useState(defaultValue || []);
+    // Determine if component is controlled
+    const isControlled = controlledValue !== undefined;
+    const currentValue = isControlled ? controlledValue : internalValue;
+    // Handle checkbox change
+    const handleChange = (checkboxValue, checked) => {
+        const newValue = checked
+            ? [...currentValue, checkboxValue]
+            : currentValue.filter((v) => v !== checkboxValue);
+        if (!isControlled) {
+            setInternalValue(newValue);
+        }
+        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
+    };
+    // Build class names
+    const classNames = [
+        'vtx-checkbox-group',
+        `vtx-checkbox-group--${orientation}`,
+        error && 'vtx-checkbox-group--error',
+        disabled && 'vtx-checkbox-group--disabled',
+        className,
+    ]
+        .filter(Boolean)
+        .join(' ');
+    return (jsxRuntime.jsxs("div", { ref: ref, className: classNames, ...props, children: [label && jsxRuntime.jsx("div", { className: "vtx-checkbox-group-label", children: label }), jsxRuntime.jsx("div", { className: "vtx-checkbox-group-options", children: options.map((option) => {
+                    const isChecked = currentValue.includes(option.value);
+                    const isDisabled = disabled || option.disabled;
+                    return (jsxRuntime.jsx(components_Checkbox_Checkbox["default"], { label: option.label, checked: isChecked, disabled: isDisabled, error: error, size: groupSize, onChange: (e) => handleChange(option.value, e.target.checked) }, option.value));
+                }) }), helperText && jsxRuntime.jsx("div", { className: "vtx-checkbox-group-helper-text", children: helperText })] }));
+});
+CheckboxGroup.displayName = 'CheckboxGroup';
+
+exports.CheckboxGroup = CheckboxGroup;
+exports["default"] = CheckboxGroup;
+//# sourceMappingURL=CheckboxGroup.js.map

package/dist/cjs/components/CheckboxGroup/components/CheckboxGroup/CheckboxGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxGroup.js","sources":["../../../../../../src/components/CheckboxGroup/CheckboxGroup.tsx"],"sourcesContent":[null],"names":["React","useThemeContext","useState","_jsxs","_jsx","Checkbox"],"mappings":"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"}

package/dist/cjs/components/CheckboxGroup/components/CheckboxGroup/index.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_CheckboxGroup_CheckboxGroup = require('./CheckboxGroup.js');
+
+
+
+exports.CheckboxGroup = components_CheckboxGroup_CheckboxGroup["default"];
+exports.CheckboxGroupComponent = components_CheckboxGroup_CheckboxGroup["default"];
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/CheckboxGroup/components/CheckboxGroup/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/cjs/components/Chip/components/Chip/Chip.js

@@ -0,0 +1,89 @@
+"use client";
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var icons_IconComponents = require('../../../../icons/icons/IconComponents.js');
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * Chip component - Compact element for displaying tags, labels, or selections
+ *
+ * A versatile chip component for representing small pieces of information like tags,
+ * filters, selections, or categories with optional delete functionality.
+ *
+ * @example
+ * Basic usage
+ * ```tsx
+ * <Chip label="React" />
+ * ```
+ *
+ * @example
+ * With delete functionality
+ * ```tsx
+ * <Chip
+ *   label="JavaScript"
+ *   onDelete={() => handleRemove('js')}
+ * />
+ * ```
+ *
+ * @example
+ * With avatar
+ * ```tsx
+ * <Chip
+ *   label="John Doe"
+ *   avatar="https://avatar.url/john.jpg"
+ *   variant="outlined"
+ * />
+ * ```
+ */
+const Chip = React__default["default"].forwardRef(({ label, size = 'md', variant = 'filled', color = 'default', icon, avatar, onDelete, onClick, disabled = false, className = '', 'aria-label': ariaLabel, 'data-testid': dataTestId }, ref) => {
+    const chipClassNames = [
+        'vtx-chip',
+        `vtx-chip--${size}`,
+        `vtx-chip--${variant}`,
+        `vtx-chip--${color}`,
+        onClick && !disabled && 'vtx-chip--clickable',
+        disabled && 'vtx-chip--disabled',
+        className,
+    ]
+        .filter(Boolean)
+        .join(' ');
+    const handleClick = (event) => {
+        if (!disabled && onClick) {
+            onClick(event);
+        }
+    };
+    const handleKeyDown = (event) => {
+        if (!disabled && onClick && (event.key === 'Enter' || event.key === ' ')) {
+            event.preventDefault();
+            onClick(event);
+        }
+    };
+    const handleDeleteClick = (event) => {
+        event.stopPropagation();
+        if (!disabled && onDelete) {
+            onDelete(event);
+        }
+    };
+    const handleDeleteKeyDown = (event) => {
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            event.stopPropagation();
+            if (!disabled && onDelete) {
+                onDelete(event);
+            }
+        }
+    };
+    return (jsxRuntime.jsxs("div", { ref: ref, className: chipClassNames, onClick: handleClick, onKeyDown: handleKeyDown, role: onClick ? 'button' : undefined, tabIndex: onClick && !disabled ? 0 : undefined, "aria-label": ariaLabel || label, "aria-disabled": disabled, "data-testid": dataTestId, children: [avatar && jsxRuntime.jsx("img", { src: avatar, alt: "", className: "vtx-chip__avatar", "aria-hidden": "true" }), icon && !avatar && (jsxRuntime.jsx("span", { className: "vtx-chip__icon", "aria-hidden": "true", children: icon })), jsxRuntime.jsx("span", { className: "vtx-chip__label", children: label }), onDelete && (jsxRuntime.jsx("button", { type: "button", className: "vtx-chip__delete", onClick: handleDeleteClick, onKeyDown: handleDeleteKeyDown, disabled: disabled, "aria-label": `Remove ${label}`, tabIndex: -1, children: jsxRuntime.jsx(icons_IconComponents.CloseSmallIcon, { size: 16 }) }))] }));
+});
+Chip.displayName = 'Chip';
+
+exports.Chip = Chip;
+exports["default"] = Chip;
+//# sourceMappingURL=Chip.js.map

package/dist/cjs/components/Chip/components/Chip/Chip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip.js","sources":["../../../../../../src/components/Chip/Chip.tsx"],"sourcesContent":[null],"names":["React","_jsxs","_jsx","CloseSmallIcon"],"mappings":"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"}

package/dist/cjs/components/Chip/components/Chip/index.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_Chip_Chip = require('./Chip.js');
+
+
+
+exports.Chip = components_Chip_Chip["default"];
+exports.ChipComponent = components_Chip_Chip["default"];
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Chip/components/Chip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}

package/dist/cjs/components/Container/components/Container/Container.js

@@ -0,0 +1,67 @@
+"use client";
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * Container component - A responsive container that centers content
+ *
+ * Similar to Bootstrap's container, this component provides a responsive
+ * fixed-width container with automatic margins and padding.
+ *
+ * @example
+ * Basic usage
+ * ```tsx
+ * <Container>
+ *   <h1>Hello World</h1>
+ *   <p>Content goes here...</p>
+ * </Container>
+ * ```
+ *
+ * @example
+ * Fluid container (full width)
+ * ```tsx
+ * <Container fluid>
+ *   <p>This spans the full width</p>
+ * </Container>
+ * ```
+ *
+ * @example
+ * Custom max width
+ * ```tsx
+ * <Container maxWidth="sm">
+ *   <p>Smaller container for forms</p>
+ * </Container>
+ * ```
+ *
+ * @example
+ * Without gutters
+ * ```tsx
+ * <Container disableGutters>
+ *   <p>No horizontal padding</p>
+ * </Container>
+ * ```
+ */
+const Container = React__default["default"].forwardRef(({ maxWidth = 'lg', disableGutters = false, fluid = false, className = '', children, ...props }, ref) => {
+    const containerClassNames = [
+        'vtx-container',
+        fluid || maxWidth === 'fluid' ? 'vtx-container--fluid' : `vtx-container--${maxWidth}`,
+        disableGutters && 'vtx-container--no-gutters',
+        className,
+    ]
+        .filter(Boolean)
+        .join(' ');
+    return (jsxRuntime.jsx("div", { ref: ref, className: containerClassNames, ...props, children: children }));
+});
+Container.displayName = 'Container';
+
+exports.Container = Container;
+exports["default"] = Container;
+//# sourceMappingURL=Container.js.map

package/dist/cjs/components/Container/components/Container/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.js","sources":["../../../../../../src/components/Container/Container.tsx"],"sourcesContent":[null],"names":["React","_jsx"],"mappings":";;;;;;;;;;;AAqCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCG;AACH,MAAM,SAAS,GAAGA,yBAAK,CAAC,UAAU,CAChC,CACE,EACE,QAAQ,GAAG,IAAI,EACf,cAAc,GAAG,KAAK,EACtB,KAAK,GAAG,KAAK,EACb,SAAS,GAAG,EAAE,EACd,QAAQ,EACR,GAAG,KAAK,EACT,EACD,GAAG,KACD;AACF,IAAA,MAAM,mBAAmB,GAAG;QAC1B,eAAe;AACf,QAAA,KAAK,IAAI,QAAQ,KAAK,OAAO,GAAG,sBAAsB,GAAG,CAAA,eAAA,EAAkB,QAAQ,CAAE,CAAA;AACrF,QAAA,cAAc,IAAI,2BAA2B;QAC7C,SAAS;AACV,KAAA;SACE,MAAM,CAAC,OAAO,CAAC;SACf,IAAI,CAAC,GAAG,CAAC,CAAC;AAEb,IAAA,QACEC,cAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,mBAAmB,KAAM,KAAK,EAAA,QAAA,EACrD,QAAQ,EAAA,CACL,EACN;AACJ,CAAC,EACD;AAEF,SAAS,CAAC,WAAW,GAAG,WAAW;;;;;"}

package/dist/cjs/components/Container/components/Container/index.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_Container_Container = require('./Container.js');
+
+
+
+exports.Container = components_Container_Container["default"];
+exports["default"] = components_Container_Container["default"];
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Container/components/Container/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}