@trilogy-ds/react 0.0.1-beta.8 → 0.0.1-calendar

package/lib/components/progress/radial/item/ProgressRadialItemPropsDefaults.js

@@ -0,0 +1,63 @@
+export default {
+  "children": {
+    "type": "react",
+    "values": [
+      "undefined",
+      "null",
+      "string",
+      "number",
+      "false",
+      "true",
+      "JSXElementConstructor<any>>",
+      "ReactNode>",
+      "ReactPortal"
+    ]
+  },
+  "percent": {
+    "type": "string",
+    "values": []
+  },
+  "color": {
+    "type": "enum",
+    "values": [
+      "warning",
+      "WHITE",
+      "MAIN",
+      "MAIN_FADE",
+      "ACCENT",
+      "ACCENT_FADE",
+      "FONT",
+      "FONT_PLACEHOLDER",
+      "SUCCESS",
+      "SUCCESS_FADE",
+      "INFO",
+      "INFO_FADE",
+      "WARNING",
+      "WARNING_FADE",
+      "ERROR",
+      "ERROR_FADE",
+      "DISABLED",
+      "DISABLED_FADE",
+      "NEUTRAL",
+      "NEUTRAL_FADE",
+      "STROKE",
+      "secondary",
+      "empty",
+      "tertiary"
+    ]
+  },
+  "id": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  },
+  "className": {
+    "type": "string",
+    "values": [
+      "undefined",
+      "string"
+    ]
+  }
+};

package/lib/components/progress/radial/item/ProgressRadialtem.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { ProgressRadialItemProps } from './ProgressRadialItemProps';
-declare const ProgressRadialItem: ({ color, className }: ProgressRadialItemProps) => JSX.Element;
+declare const ProgressRadialItem: ({ color, className, id }: ProgressRadialItemProps) => JSX.Element;
 export default ProgressRadialItem;

package/lib/components/progress/radial/item/ProgressRadialtem.js

@@ -1,11 +1,12 @@
-import React from 'react';
+import * as React from 'react';
 import { hashClass } from '../../../../helpers';
 import clsx from 'clsx';
 import { useTrilogyContext } from '../../../../context';
-const ProgressRadialItem = ({ color, className }) => {
-    const { styled } = useTrilogyContext();
-    const classes = hashClass(styled, clsx(`progress-circle-slice progress-circle-background-${color}`, className));
-    return React.createElement("div", { className: classes });
+var ProgressRadialItem = function (_a) {
+    var color = _a.color, className = _a.className, id = _a.id;
+    var styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx("progress-circle-slice progress-circle-background-".concat(color), className));
+    return React.createElement("div", { id: id, className: classes });
 };
 export default ProgressRadialItem;
-//# sourceMappingURL=ProgressRadialtem.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUHJvZ3Jlc3NSYWRpYWx0ZW0uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL3Byb2dyZXNzL3JhZGlhbC9pdGVtL1Byb2dyZXNzUmFkaWFsdGVtLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUU5QixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQ3JDLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFFN0MsSUFBTSxrQkFBa0IsR0FBRyxVQUFDLEVBQWlEO1FBQS9DLEtBQUssV0FBQSxFQUFFLFNBQVMsZUFBQSxFQUFFLEVBQUUsUUFBQTtJQUN4QyxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUN0QyxJQUFNLE9BQU8sR0FBRyxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQywyREFBb0QsS0FBSyxDQUFFLEVBQUUsU0FBUyxDQUFDLENBQUMsQ0FBQTtJQUUvRyxPQUFPLDZCQUFLLEVBQUUsRUFBRSxFQUFFLEVBQUUsU0FBUyxFQUFFLE9BQU8sR0FBUSxDQUFBO0FBQ2hELENBQUMsQ0FBQTtBQUVELGVBQWUsa0JBQWtCLENBQUEifQ==

package/lib/components/progress/radial/item/index.js

@@ -1,3 +1,3 @@
 import ProgressRadialItem from './ProgressRadialtem';
 export default ProgressRadialItem;
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL3Byb2dyZXNzL3JhZGlhbC9pdGVtL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sa0JBQWtCLE1BQU0scUJBQXFCLENBQUE7QUFDcEQsZUFBZSxrQkFBa0IsQ0FBQSJ9

package/lib/components/progress/radial/react-native-circular-progress/AnimatedCircularProgress.d.ts

@@ -45,6 +45,6 @@ declare namespace AnimatedCircularProgress {
     }
 }
 export default AnimatedCircularProgress;
-import React from "react";
+import * as React from "react";
 import { Animated } from "react-native/Libraries/Animated/Animated";
 import PropTypes from "prop-types";

package/lib/components/progress/radial/react-native-circular-progress/AnimatedCircularProgress.js

@@ -1,73 +1,75 @@
+import { __assign, __extends, __rest } from "tslib";
 // @ts-nocheck
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Animated, Easing } from 'react-native';
-import CircularProgress from './CircularProgress';
-const AnimatedProgress = Animated.createAnimatedComponent(CircularProgress);
-export default class AnimatedCircularProgress extends React.PureComponent {
-    constructor(props) {
-        super(props);
-        this.state = {
+import * as React from "react";
+import PropTypes from "prop-types";
+import { Animated, Easing } from "react-native";
+import CircularProgress from "./CircularProgress";
+var AnimatedProgress = Animated.createAnimatedComponent(CircularProgress);
+var AnimatedCircularProgress = /** @class */ (function (_super) {
+    __extends(AnimatedCircularProgress, _super);
+    function AnimatedCircularProgress(props) {
+        var _this = _super.call(this, props) || this;
+        _this.state = {
             fillAnimation: new Animated.Value(props.prefill),
         };
         if (props.onFillChange) {
-            this.state.fillAnimation.addListener(({ value }) => props.onFillChange(value));
+            _this.state.fillAnimation.addListener(function (_a) {
+                var value = _a.value;
+                return props.onFillChange(value);
+            });
         }
+        return _this;
     }
-    componentDidMount() {
+    AnimatedCircularProgress.prototype.componentDidMount = function () {
         this.animate();
-    }
-    componentDidUpdate(prevProps) {
+    };
+    AnimatedCircularProgress.prototype.componentDidUpdate = function (prevProps) {
         if (prevProps.fill !== this.props.fill) {
             this.animate();
         }
-    }
-    reAnimate(prefill, toVal, dur, ease) {
+    };
+    AnimatedCircularProgress.prototype.reAnimate = function (prefill, toVal, dur, ease) {
+        var _this = this;
         this.setState({
             fillAnimation: new Animated.Value(prefill),
-        }, () => this.animate(toVal, dur, ease));
-    }
-    animate(toVal, dur, ease) {
-        const toValue = toVal >= 0 ? toVal : this.props.fill;
-        const duration = dur || this.props.duration;
-        const easing = ease || this.props.easing;
-        const { useNativeDriver } = this.props;
-        const anim = Animated.timing(this.state.fillAnimation, {
-            useNativeDriver,
-            toValue,
-            easing,
-            duration,
+        }, function () { return _this.animate(toVal, dur, ease); });
+    };
+    AnimatedCircularProgress.prototype.animate = function (toVal, dur, ease) {
+        var toValue = toVal >= 0 ? toVal : this.props.fill;
+        var duration = dur || this.props.duration;
+        var easing = ease || this.props.easing;
+        var useNativeDriver = this.props.useNativeDriver;
+        var anim = Animated.timing(this.state.fillAnimation, {
+            useNativeDriver: useNativeDriver,
+            toValue: toValue,
+            easing: easing,
+            duration: duration,
         });
         anim.start(this.props.onAnimationComplete);
         return anim;
-    }
-    animateColor() {
+    };
+    AnimatedCircularProgress.prototype.animateColor = function () {
         if (!this.props.tintColorSecondary) {
             return this.props.tintColor;
         }
-        const tintAnimation = this.state.fillAnimation.interpolate({
+        var tintAnimation = this.state.fillAnimation.interpolate({
             inputRange: [0, 100],
             outputRange: [this.props.tintColor, this.props.tintColorSecondary],
         });
         return tintAnimation;
-    }
-    render() {
-        const { fill, prefill, ...other } = this.props;
-        return React.createElement(AnimatedProgress, { ...other, fill: this.state.fillAnimation, tintColor: this.animateColor() });
-    }
-}
-AnimatedCircularProgress.propTypes = {
-    ...CircularProgress.propTypes,
-    prefill: PropTypes.number,
-    duration: PropTypes.number,
-    easing: PropTypes.func,
-    onAnimationComplete: PropTypes.func,
-    useNativeDriver: PropTypes.bool,
-};
+    };
+    AnimatedCircularProgress.prototype.render = function () {
+        var _a = this.props, fill = _a.fill, prefill = _a.prefill, other = __rest(_a, ["fill", "prefill"]);
+        return (React.createElement(AnimatedProgress, __assign({}, other, { fill: this.state.fillAnimation, tintColor: this.animateColor() })));
+    };
+    return AnimatedCircularProgress;
+}(React.PureComponent));
+export default AnimatedCircularProgress;
+AnimatedCircularProgress.propTypes = __assign(__assign({}, CircularProgress.propTypes), { prefill: PropTypes.number, duration: PropTypes.number, easing: PropTypes.func, onAnimationComplete: PropTypes.func, useNativeDriver: PropTypes.bool });
 AnimatedCircularProgress.defaultProps = {
     duration: 500,
     easing: Easing.out(Easing.ease),
     prefill: 0,
     useNativeDriver: false,
 };
-//# sourceMappingURL=AnimatedCircularProgress.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQW5pbWF0ZWRDaXJjdWxhclByb2dyZXNzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vY29tcG9uZW50cy9wcm9ncmVzcy9yYWRpYWwvcmVhY3QtbmF0aXZlLWNpcmN1bGFyLXByb2dyZXNzL0FuaW1hdGVkQ2lyY3VsYXJQcm9ncmVzcy5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsY0FBYztBQUNkLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQzlCLE9BQU8sU0FBUyxNQUFNLFlBQVksQ0FBQTtBQUNsQyxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUMvQyxPQUFPLGdCQUFnQixNQUFNLG9CQUFvQixDQUFBO0FBRWpELElBQU0sZ0JBQWdCLEdBQUcsUUFBUSxDQUFDLHVCQUF1QixDQUFDLGdCQUFnQixDQUFDLENBQUE7QUFFM0U7SUFBc0QsNENBQW1CO0lBQ3ZFLGtDQUFZLEtBQUs7UUFBakIsWUFDRSxrQkFBTSxLQUFLLENBQUMsU0FTYjtRQVJDLEtBQUksQ0FBQyxLQUFLLEdBQUc7WUFDWCxhQUFhLEVBQUUsSUFBSSxRQUFRLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxPQUFPLENBQUM7U0FDakQsQ0FBQTtRQUNELElBQUksS0FBSyxDQUFDLFlBQVksRUFBRTtZQUN0QixLQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsQ0FBQyxXQUFXLENBQUMsVUFBQyxFQUFTO29CQUFQLEtBQUssV0FBQTtnQkFDM0MsT0FBQSxLQUFLLENBQUMsWUFBWSxDQUFDLEtBQUssQ0FBQztZQUF6QixDQUF5QixDQUMxQixDQUFBO1NBQ0Y7O0lBQ0gsQ0FBQztJQUVELG9EQUFpQixHQUFqQjtRQUNFLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQTtJQUNoQixDQUFDO0lBRUQscURBQWtCLEdBQWxCLFVBQW1CLFNBQVM7UUFDMUIsSUFBSSxTQUFTLENBQUMsSUFBSSxLQUFLLElBQUks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

package/lib/components/progress/radial/react-native-circular-progress/CircularProgress.d.ts

@@ -60,6 +60,6 @@ declare namespace CircularProgress {
     }
 }
 export default CircularProgress;
-import React from "react";
+import * as React from "react";
 import PropTypes from "prop-types";
 import { Animated } from "react-native/Libraries/Animated/Animated";

package/lib/components/progress/radial/react-native-circular-progress/CircularProgress.js

@@ -1,56 +1,79 @@
+import { __assign, __extends } from "tslib";
 // @ts-nocheck
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Animated, View } from 'react-native';
-import { Svg, Path, G } from 'react-native-svg';
-export default class CircularProgress extends React.PureComponent {
-    constructor() {
-        super(...arguments);
-        this.clampFill = (fill) => Math.min(100, Math.max(0, fill));
+import * as React from "react";
+import PropTypes from "prop-types";
+import { Animated, View } from "react-native";
+import { Svg, Path, G } from "react-native-svg";
+var CircularProgress = /** @class */ (function (_super) {
+    __extends(CircularProgress, _super);
+    function CircularProgress() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.clampFill = function (fill) { return Math.min(100, Math.max(0, fill)); };
+        return _this;
     }
-    polarToCartesian(centerX, centerY, radius, angleInDegrees) {
-        const angleInRadians = ((angleInDegrees - 90) * Math.PI) / 180.0;
+    CircularProgress.prototype.polarToCartesian = function (centerX, centerY, radius, angleInDegrees) {
+        var angleInRadians = ((angleInDegrees - 90) * Math.PI) / 180.0;
         return {
             x: centerX + radius * Math.cos(angleInRadians),
             y: centerY + radius * Math.sin(angleInRadians),
         };
-    }
-    circlePath(x, y, radius, startAngle, endAngle) {
-        const start = this.polarToCartesian(x, y, radius, endAngle * 0.9999);
-        const end = this.polarToCartesian(x, y, radius, startAngle);
-        const largeArcFlag = endAngle - startAngle <= 180 ? '0' : '1';
-        const d = ['M', start.x, start.y, 'A', radius, radius, 0, largeArcFlag, 0, end.x, end.y];
-        return d.join(' ');
-    }
-    render() {
-        const { size, width, backgroundWidth, tintColor, secondFillTintColor, tintTransparency, backgroundColor, style, rotation, lineCap, fillLineCap = lineCap, arcSweepAngle, fill, secondFill, children, childrenContainerStyle, padding, renderCap, dashedBackground, dashedTint, } = this.props;
-        const maxWidthCircle = backgroundWidth ? Math.max(width, backgroundWidth) : width;
-        const sizeWithPadding = size / 2 + padding / 2;
-        const radius = size / 2 - maxWidthCircle / 2 - padding / 2;
-        const currentFillAngle = (arcSweepAngle * this.clampFill(fill)) / 100;
-        const currentFillSecondAngle = secondFill ? (arcSweepAngle * this.clampFill(secondFill + fill)) / 100 : 0;
-        const backgroundPath = this.circlePath(sizeWithPadding, sizeWithPadding, radius, tintTransparency ? 0 : currentFillAngle + currentFillSecondAngle, arcSweepAngle);
-        const circlePath = this.circlePath(sizeWithPadding, sizeWithPadding, radius, 0, currentFillAngle);
-        const secondCirclePath = secondFill && this.circlePath(sizeWithPadding, sizeWithPadding, radius, currentFillAngle, currentFillSecondAngle);
-        const coordinate = this.polarToCartesian(sizeWithPadding, sizeWithPadding, radius, currentFillAngle);
-        const cap = this.props.renderCap ? this.props.renderCap({ center: coordinate }) : null;
-        const offset = size - maxWidthCircle * 2;
-        const localChildrenContainerStyle = {
-            ...{
-                position: 'absolute',
-                left: maxWidthCircle + padding / 2,
-                top: maxWidthCircle + padding / 2,
-                width: offset,
-                height: offset,
-                borderRadius: offset / 2,
-                alignItems: 'center',
-                justifyContent: 'center',
-                overflow: 'hidden',
-            },
-            ...childrenContainerStyle,
-        };
-        const strokeDasharrayTint = dashedTint.gap > 0 ? Object.values(dashedTint).map((value) => parseInt(value)) : null;
-        const strokeDasharrayBackground = dashedBackground.gap > 0 ? Object.values(dashedBackground).map((value) => parseInt(value)) : null;
+    };
+    CircularProgress.prototype.circlePath = function (x, y, radius, startAngle, endAngle) {
+        var start = this.polarToCartesian(x, y, radius, endAngle * 0.9999);
+        var end = this.polarToCartesian(x, y, radius, startAngle);
+        var largeArcFlag = endAngle - startAngle <= 180 ? "0" : "1";
+        var d = [
+            "M",
+            start.x,
+            start.y,
+            "A",
+            radius,
+            radius,
+            0,
+            largeArcFlag,
+            0,
+            end.x,
+            end.y,
+        ];
+        return d.join(" ");
+    };
+    CircularProgress.prototype.render = function () {
+        var _a = this.props, size = _a.size, width = _a.width, backgroundWidth = _a.backgroundWidth, tintColor = _a.tintColor, secondFillTintColor = _a.secondFillTintColor, tintTransparency = _a.tintTransparency, backgroundColor = _a.backgroundColor, style = _a.style, rotation = _a.rotation, lineCap = _a.lineCap, _b = _a.fillLineCap, fillLineCap = _b === void 0 ? lineCap : _b, arcSweepAngle = _a.arcSweepAngle, fill = _a.fill, secondFill = _a.secondFill, children = _a.children, childrenContainerStyle = _a.childrenContainerStyle, padding = _a.padding, renderCap = _a.renderCap, dashedBackground = _a.dashedBackground, dashedTint = _a.dashedTint;
+        var maxWidthCircle = backgroundWidth
+            ? Math.max(width, backgroundWidth)
+            : width;
+        var sizeWithPadding = size / 2 + padding / 2;
+        var radius = size / 2 - maxWidthCircle / 2 - padding / 2;
+        var currentFillAngle = (arcSweepAngle * this.clampFill(fill)) / 100;
+        var currentFillSecondAngle = secondFill
+            ? (arcSweepAngle * this.clampFill(secondFill + fill)) / 100
+            : 0;
+        var backgroundPath = this.circlePath(sizeWithPadding, sizeWithPadding, radius, tintTransparency ? 0 : currentFillAngle + currentFillSecondAngle, arcSweepAngle);
+        var circlePath = this.circlePath(sizeWithPadding, sizeWithPadding, radius, 0, currentFillAngle);
+        var secondCirclePath = secondFill &&
+            this.circlePath(sizeWithPadding, sizeWithPadding, radius, currentFillAngle, currentFillSecondAngle);
+        var coordinate = this.polarToCartesian(sizeWithPadding, sizeWithPadding, radius, currentFillAngle);
+        var cap = this.props.renderCap
+            ? this.props.renderCap({ center: coordinate })
+            : null;
+        var offset = size - maxWidthCircle * 2;
+        var localChildrenContainerStyle = __assign({
+            position: "absolute",
+            left: maxWidthCircle + padding / 2,
+            top: maxWidthCircle + padding / 2,
+            width: offset,
+            height: offset,
+            borderRadius: offset / 2,
+            alignItems: "center",
+            justifyContent: "center",
+            overflow: "hidden",
+        }, childrenContainerStyle);
+        var strokeDasharrayTint = dashedTint.gap > 0
+            ? Object.values(dashedTint).map(function (value) { return parseInt(value); })
+            : null;
+        var strokeDasharrayBackground = dashedBackground.gap > 0
+            ? Object.values(dashedBackground).map(function (value) { return parseInt(value); })
+            : null;
         return (React.createElement(View, { style: style },
             React.createElement(Svg, { width: size + padding, height: size + padding },
                 React.createElement(G, { rotation: rotation, originX: (size + padding) / 2, originY: (size + padding) / 2 },
@@ -58,12 +81,17 @@ export default class CircularProgress extends React.PureComponent {
                     fill > 0 && (React.createElement(Path, { d: circlePath, stroke: tintColor, strokeWidth: width, strokeLinecap: fillLineCap, strokeDasharray: strokeDasharrayTint, fill: 'transparent' })),
                     secondFill && (React.createElement(Path, { d: secondCirclePath, stroke: secondFillTintColor ? secondFillTintColor : tintColor, strokeWidth: width, strokeLinecap: fillLineCap, strokeDasharray: strokeDasharrayTint, fill: 'transparent' })),
                     cap)),
-            children && React.createElement(View, { style: localChildrenContainerStyle }, children(fill))));
-    }
-}
+            children && (React.createElement(View, { style: localChildrenContainerStyle }, children(fill)))));
+    };
+    return CircularProgress;
+}(React.PureComponent));
+export default CircularProgress;
 CircularProgress.propTypes = {
     style: PropTypes.object,
-    size: PropTypes.oneOfType([PropTypes.number, PropTypes.instanceOf(Animated.Value)]).isRequired,
+    size: PropTypes.oneOfType([
+        PropTypes.number,
+        PropTypes.instanceOf(Animated.Value),
+    ]).isRequired,
     fill: PropTypes.number.isRequired,
     secondFill: PropTypes.number,
     width: PropTypes.number.isRequired,
@@ -83,13 +111,13 @@ CircularProgress.propTypes = {
     dashedTint: PropTypes.object,
 };
 CircularProgress.defaultProps = {
-    tintColor: 'black',
+    tintColor: "black",
     tintTransparency: true,
     rotation: 90,
-    lineCap: 'butt',
+    lineCap: "butt",
     arcSweepAngle: 360,
     padding: 0,
     dashedBackground: { width: 0, gap: 0 },
     dashedTint: { width: 0, gap: 0 },
 };
-//# sourceMappingURL=CircularProgress.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQ2lyY3VsYXJQcm9ncmVzcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2NvbXBvbmVudHMvcHJvZ3Jlc3MvcmFkaWFsL3JlYWN0LW5hdGl2ZS1jaXJjdWxhci1wcm9ncmVzcy9DaXJjdWxhclByb2dyZXNzLmpzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxjQUFjO0FBQ2QsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxTQUFTLE1BQU0sWUFBWSxDQUFBO0FBQ2xDLE9BQU8sRUFBRSxRQUFRLEVBQUUsSUFBSSxFQUFFLE1BQU0sY0FBYyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxHQUFHLEVBQUUsSUFBSSxFQUFFLENBQUMsRUFBRSxNQUFNLGtCQUFrQixDQUFBO0FBRS9DO0lBQThDLG9DQUFtQjtJQUFqRTtRQUFBLHFFQWdMQztRQW5KQyxlQUFTLEdBQUcsVUFBQyxJQUFJLElBQUssT0FBQSxJQUFJLENBQUMsR0FBRyxDQUFDLEdBQUcsRUFBRSxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsRUFBRSxJQUFJLENBQUMsQ0FBQyxFQUFoQyxDQUFnQyxDQUFBOztJQW1KeEQsQ0FBQztJQS9LQywyQ0FBZ0IsR0FBaEIsVUFBaUIsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLEVBQUUsY0FBYztRQUN2RCxJQUFNLGNBQWMsR0FBRyxDQUFDLENBQUMsY0FBYyxHQUFHLEVBQUUsQ0FBQyxHQUFHLElBQUksQ0FBQyxFQUFFLENBQUMsR0FBRyxLQUFLLENBQUE7UUFDaEUsT0FBTztZQUNMLENBQUMsRUFBRSxPQUFPLEdBQUcsTUFBTSxHQUFHLElBQUksQ0FBQyxHQUFHLENBQUMsY0FBYyxDQUFDO1lBQzlDLENBQUMsRUFBRSxPQUFPLEdBQUcsTUFBTSxHQUFHLElBQUksQ0FBQyxHQUFHLENBQUMsY0FBYyxDQUFDO1NBQy9DLENBQUE7SUFDSCxDQUFDO0lBRUQscUNBQVUsR0FBVixVQUFXLENBQUMsRUFB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

package/lib/components/progress/radial/react-native-circular-progress/index.js

@@ -1,4 +1,4 @@
 import CircularProgress from './CircularProgress';
 import AnimatedCircularProgress from './AnimatedCircularProgress';
 export { CircularProgress, AnimatedCircularProgress };
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9jb21wb25lbnRzL3Byb2dyZXNzL3JhZGlhbC9yZWFjdC1uYXRpdmUtY2lyY3VsYXItcHJvZ3Jlc3MvaW5kZXguanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxnQkFBZ0IsTUFBTSxvQkFBb0IsQ0FBQTtBQUNqRCxPQUFPLHdCQUF3QixNQUFNLDRCQUE0QixDQUFBO0FBRWpFLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSx3QkFBd0IsRUFBRSxDQUFBIn0=

package/lib/components/radio/Radio.d.ts

@@ -1,21 +1,18 @@
-/// <reference types="react" />
-import { RadioProps } from './RadioProps';
+import { RadioProps } from '../../components/radio/RadioProps';
+import React from 'react';
 /**
- * Radio Component
- * @param checked {boolean} Checked Radio
- * @param className {string} Additionnal CSS Classes
+ * Radio
+ * @param checked {boolean} Checked radio
  * @param disabled {boolean} Disabled
- * @param readOnly {boolean} readonly Radio
+ * @param readOnly {boolean} readonly radio
  * @param id {string} Id for button, by default id is generate
- * @param label {string|ReactNode} Label for Radio
- * @param onClick {ClickEvent}
+ * @param label {string} Label for radio
  * @param onChange {ChangeEvent}
  * @param name {string} Name for radio
  * @param value {string} Value for radio
- * @param iconTile {IconName} Icon for Radio
- * @param narrow {boolean} Apply narrow
- * @param marginless {boolean} delete margin
- * @param children {React.ReactNode} If Children is provided, don't use label / Icon / Description
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additional css classes (ONLY FOR WEB)
+ * @param required {boolean} Required radio
  */
-declare const Radio: ({ checked, className, disabled, readonly, id, label, onChange, onClick, name, value, tile, description, iconTile, horizontalTile, children, labelClassName, spaced, inverted, testId, narrow, marginless, ...others }: RadioProps) => JSX.Element;
+declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLDivElement>>;
 export default Radio;

package/lib/components/radio/Radio.js

@@ -1,101 +1,39 @@
-import React, { useEffect, useState } from 'react';
-import shortid from 'shortid';
-import { has, is } from '../../services/classify';
-import { Icon, IconSize } from '../icon';
-import { hashClass } from '../../helpers';
-import clsx from 'clsx';
+import { __assign, __rest } from "tslib";
 import { useTrilogyContext } from '../../context';
+import { hashClass } from '../../helpers/hashClassesHelpers';
+import clsx from 'clsx';
+import React from 'react';
+import { ComponentName } from '../enumsComponentsName';
 /**
- * Radio Component
- * @param checked {boolean} Checked Radio
- * @param className {string} Additionnal CSS Classes
+ * Radio
+ * @param checked {boolean} Checked radio
  * @param disabled {boolean} Disabled
- * @param readOnly {boolean} readonly Radio
+ * @param readOnly {boolean} readonly radio
  * @param id {string} Id for button, by default id is generate
- * @param label {string|ReactNode} Label for Radio
- * @param onClick {ClickEvent}
+ * @param label {string} Label for radio
  * @param onChange {ChangeEvent}
  * @param name {string} Name for radio
  * @param value {string} Value for radio
- * @param iconTile {IconName} Icon for Radio
- * @param narrow {boolean} Apply narrow
- * @param marginless {boolean} delete margin
- * @param children {React.ReactNode} If Children is provided, don't use label / Icon / Description
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additional css classes (ONLY FOR WEB)
+ * @param required {boolean} Required radio
  */
-const Radio = ({ checked, className, disabled, readonly, id = shortid.generate(), label, onChange, onClick, name, value, tile, description, iconTile, horizontalTile, children, labelClassName, spaced, inverted, testId, narrow, marginless, ...others }) => {
-    const { styled } = useTrilogyContext();
-    const [inputState, setInputState] = useState({ checked: checked || false });
-    useEffect(() => {
-        if (!readonly) {
-            setInputState({ checked: checked || false });
-        }
-    }, [checked, readonly]);
-    const classes = hashClass(styled, clsx('input', is('checkradio'), is('info'), is('hidden'), inverted && is('inverted'), className && !className.includes(is('inverted')) && has('background-color'), className));
-    const labelClasses = hashClass(styled, clsx(checked && has('text-info'), spaced && is('spaced-between'), labelClassName));
-    // Support legacy checkbox
-    if (labelClassName || inverted || spaced) {
-        return (React.createElement("div", { className: hashClass(styled, clsx('field')) },
-            React.createElement("div", { className: hashClass(styled, clsx('control', disabled && is('disabled'))) },
-                React.createElement("input", { "data-testid": testId, className: classes, type: 'radio', readOnly: readonly, id: id, disabled: disabled, name: name, value: value, checked: readonly ? checked : inputState.checked, onChange: (e) => {
-                        return e;
-                    }, onClick: (e) => {
-                        const target = e.target;
-                        if (!readonly && target.checked !== undefined) {
-                            setInputState({ checked: target.checked });
-                        }
-                        target.value = value || '';
-                        if (onChange) {
-                            onChange({
-                                radioId: target.id,
-                                radioValue: target.value,
-                                radioName: target.name,
-                                radioChecked: target.checked,
-                            });
-                        }
-                        if (onClick) {
-                            onClick({
-                                radioId: target.id,
-                                radioValue: target.value,
-                                radioName: target.name,
-                                radioChecked: target.checked,
-                            });
-                        }
-                    }, ...others }),
-                React.createElement("label", { htmlFor: id, className: labelClasses }, label))));
-    }
-    return (React.createElement("div", { className: hashClass(styled, clsx(tile ? 'radio-tile' : 'radio', narrow && is('narrow'), marginless && is('marginless'), horizontalTile && is('horizontal'), className)) },
-        React.createElement("input", { type: 'radio', readOnly: readonly, id: id, disabled: disabled, name: name, value: value, checked: readonly ? checked : inputState.checked, onChange: (e) => {
-                return e;
-            }, onClick: (e) => {
-                const target = e.target;
-                if (!readonly && target.checked) {
-                    setInputState({ checked: target.checked });
-                }
-                target.value = value || '';
-                if (onChange) {
+var Radio = React.forwardRef(function (_a, ref) {
+    var checked = _a.checked, className = _a.className, disabled = _a.disabled, readonly = _a.readonly, _b = _a.id, id = _b === void 0 ? React.useId() : _b, label = _a.label, onChange = _a.onChange, name = _a.name, value = _a.value, required = _a.required, others = __rest(_a, ["checked", "className", "disabled", "readonly", "id", "label", "onChange", "name", "value", "required"]);
+    var styled = useTrilogyContext().styled;
+    return (React.createElement("div", { ref: ref, className: hashClass(styled, clsx('radio', className)) },
+        React.createElement("input", __assign({ type: 'radio', readOnly: readonly, id: id, disabled: disabled, name: name, value: value, checked: checked, required: required, onChange: function (e) {
+                if (onChange && !disabled && !readonly) {
                     onChange({
-                        radioId: target.id,
-                        radioValue: target.value,
-                        radioName: target.name,
-                        radioChecked: target.checked,
-                    });
-                }
-                if (onClick) {
-                    onClick({
-                        radioId: target.id,
-                        radioValue: target.value,
-                        radioName: target.name,
-                        radioChecked: target.checked,
+                        radioId: e.target.id,
+                        radioValue: e.target.value,
+                        radioName: e.target.name,
+                        radioChecked: e.target.checked,
                     });
                 }
-            }, ...others }),
-        React.createElement("label", { htmlFor: id, className: hashClass(styled, clsx('radio-label')) }, children ? (children) : (React.createElement(React.Fragment, null,
-            iconTile && React.createElement(Icon, { name: iconTile, size: IconSize.MEDIUM }),
-            horizontalTile ? (React.createElement("span", null,
-                tile ? React.createElement("span", { className: hashClass(styled, clsx('radio-title')) }, label) : label,
-                tile && description && (React.createElement("span", { className: hashClass(styled, clsx('radio-description')) }, description)))) : (React.createElement(React.Fragment, null,
-                tile ? React.createElement("span", { className: hashClass(styled, clsx('radio-title')) }, label) : label,
-                tile && description && (React.createElement("span", { className: hashClass(styled, clsx('radio-description')) }, description)))))))));
-};
+            } }, others)),
+        React.createElement("label", { htmlFor: id, className: hashClass(styled, clsx('radio-label')) }, label)));
+});
+Radio.displayName = ComponentName.Radio;
 export default Radio;
-//# sourceMappingURL=Radio.js.map
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUmFkaW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3JhZGlvL1JhZGlvLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQ0EsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBQ3pCLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQTtBQUV0RDs7Ozs7Ozs7Ozs7OztHQWFHO0FBQ0gsSUFBTSxLQUFLLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBdUIsVUFBQyxFQVlyRCxFQUFFLEdBQUc7SUFYSixJQUFBLE9BQU8sYUFBQSxFQUNQLFNBQVMsZUFBQSxFQUNULFFBQVEsY0FBQSxFQUNSLFFBQVEsY0FBQSxFQUNSLFVBQWtCLEVBQWxCLEVBQUUsbUJBQUcsS0FBSyxDQUFDLEtBQUssRUFBRSxLQUFBLEVBQ2xCLEtBQUssV0FBQSxFQUNMLFFBQVEsY0FBQSxFQUNSLElBQUksVUFBQSxFQUNKLEtBQUssV0FBQSxFQUNMLFFBQVEsY0FBQSxFQUNMLE1BQU0sY0FYMkMsd0dBWXJELENBRFU7SUFFRCxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUV0QyxPQUFPLENBQ0wsNkJBQUssR0FBRyxFQUFFLEdBQUcsRUFBRSxTQUFTLEVBQUUsU0FBUyxDQUFDLE1BQU0sRUFBRSxJQUFJLENBQUMsT0FBTyxFQUFFLFNBQVMsQ0FBQyxDQUFDO1FBQ25FLHdDQUNFLElBQUksRUFBQyxPQUFPLEVBQ1osUUFBUSxFQUFFLFFBQVEsRUFDbEIsRUFBRSxFQUFFLEVBQUUsRUFDTixRQUFRLEVBQUUsUUFBUSxFQUNsQixJQUFJLEVBQUUsSUFBSSxFQUNWLEtBQUssRUFBRSxLQUFLLEVBQ1osT0FBTyxFQUFFLE9BQU8sRUFDaEIsUUFBUSxFQUFFLFFBQVEsRUFDbEIsUUFBUSxFQUFFLFVBQUMsQ0FBQztnQkFDVixJQUFJLFFBQVEsSUFBSSxDQUFDLFFBQVEsSUFBSSxDQUFDLFFBQVEsRUFBRTtvQkFDdEMsUUFBUSxDQUFDO3dCQUNQLE9BQU8sRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLEVBQUU7d0JBQ3BCLFVBQVUsRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLEtBQUs7d0JBQzFCLFNBQVMsRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLElBQUk7d0JBQ3hCLFlBQVksRUFBRSxDQUFDLENBQUMsTUFBTSxDQUFDLE9BQU87cUJBQy9CLENBQUMsQ0FBQTtpQkFDSDtZQUNILENBQUMsSUFDRyxNQUFNLEVBQ1Y7UUFDRiwrQkFBTyxPQUFPLEVBQUUsRUFBRSxFQUFFLFNBQVMsRUFBRSxTQUFTLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQyxJQUNsRSxLQUFLLENBQ0EsQ0FDSixDQUNQLENBQUE7QUFDSCxDQUFDLENBQUMsQ0FBQTtBQUVGLEtBQUssQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLEtBQUssQ0FBQTtBQUN2QyxlQUFlLEtBQUssQ0FBQSJ9