@aristobyte-ui/radio 1.0.112 → 2.1.0

package/dist/es/main/components/Radio/index.js

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import './Radio.scss';
+export var Radio = function (_a) {
+    var children = _a.children, value = _a.value, checked = _a.checked, name = _a.name, _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.highlightLabel, highlightLabel = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? 'md' : _d, _e = _a.variant, variant = _e === void 0 ? 'default' : _e, _f = _a.appearance, appearance = _f === void 0 ? 'default' : _f, _g = _a.alignLabel, alignLabel = _g === void 0 ? 'right' : _g, onChange = _a.onChange, _h = _a.className, className = _h === void 0 ? '' : _h, _j = _a.style, style = _j === void 0 ? {} : _j;
+    var handleChange = function () {
+        if (!disabled && onChange) {
+            onChange(value);
+        }
+    };
+    return (React.createElement("label", { className: "radio ".concat("radio-align-label--".concat(alignLabel), " ").concat("radio-appearance--".concat(appearance), " ").concat("radio-variant--".concat(variant), " ").concat("radio-size--".concat(size), " ").concat(disabled ? 'radio--disabled' : '', " ").concat(className), style: style },
+        React.createElement("input", { type: "radio", name: name, value: value, checked: checked, disabled: disabled, onChange: handleChange, className: "radio__input" }),
+        React.createElement("span", { className: "radio__control" }),
+        children && (React.createElement("span", { className: "radio__label ".concat(highlightLabel ? 'radio__label--highlight-label' : '') }, children))));
+};

package/dist/es/main/components/RadioGroup/RadioGroup.scss

@@ -0,0 +1,15 @@
+@use "@aristobyte-ui/utils/styles/settings" as *;
+
+.radio-group {
+  display: flex;
+  gap: 20px;
+  min-width: max-content;
+
+  &--horizontal {
+    flex-direction: row;
+  }
+
+  &--vertical {
+    flex-direction: column;
+  }
+}

package/dist/es/main/components/RadioGroup/index.js

@@ -0,0 +1,48 @@
+'use client';
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+import * as React from 'react';
+import { Radio } from '../Radio';
+import './RadioGroup.scss';
+export var RadioGroup = function (_a) {
+    var name = _a.name, value = _a.value, onChange = _a.onChange, children = _a.children, _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.highlightLabel, highlightLabel = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? 'md' : _d, _e = _a.variant, variant = _e === void 0 ? 'default' : _e, _f = _a.appearance, appearance = _f === void 0 ? 'outline' : _f, _g = _a.align, align = _g === void 0 ? 'horizontal' : _g, _h = _a.alignLabel, alignLabel = _h === void 0 ? 'right' : _h, _j = _a.className, className = _j === void 0 ? '' : _j, _k = _a.style, style = _k === void 0 ? {} : _k;
+    var uniqueId = React.useId();
+    var _l = __read(React.useState(value), 2), currentValue = _l[0], setCurrentValue = _l[1];
+    var radios = React.Children.toArray(children).filter(function (child) { return React.isValidElement(child) && child.type === Radio; });
+    var handleChange = function (currentRadioValue) {
+        if (onChange) {
+            onChange(currentRadioValue);
+        }
+        setCurrentValue(currentRadioValue);
+    };
+    return (React.createElement("div", { key: uniqueId, className: "radio-group ".concat("radio-group--".concat(align), " ").concat(className), style: style }, radios.map(function (_a) {
+        var _b, _c, _d, _e, _f, _g;
+        var props = _a.props;
+        return (React.createElement(Radio, __assign({}, props, { key: "".concat(name, "-").concat(props.value, "-").concat(uniqueId), name: "".concat(name, "-").concat(props.value, "-").concat(uniqueId), checked: props.value === currentValue, onChange: function () { return handleChange(props.value); }, disabled: (_b = props.disabled) !== null && _b !== void 0 ? _b : disabled, size: (_c = props.size) !== null && _c !== void 0 ? _c : size, variant: (_d = props.variant) !== null && _d !== void 0 ? _d : variant, appearance: (_e = props.appearance) !== null && _e !== void 0 ? _e : appearance, highlightLabel: (_f = props.highlightLabel) !== null && _f !== void 0 ? _f : highlightLabel, alignLabel: (_g = props.alignLabel) !== null && _g !== void 0 ? _g : alignLabel })));
+    })));
+};

package/dist/es/main/components/index.js

@@ -0,0 +1,2 @@
+export * from "./Radio";
+export * from "./RadioGroup";

package/dist/es/main/index.js

@@ -0,0 +1 @@
+export * from './components';