@trilogy-ds/react 0.0.1-beta-148 → 0.0.1-beta-sc-2

package/lib/components/radio/index.js

@@ -1,6 +1,3 @@
-import { RadioList } from './list';
-import Radio from './Radio';
-import RadioTiles from './tiles/RadioTiles';
-import RadioTile from './tiles//tile/RadioTile';
-export { Radio, RadioList, RadioTiles, RadioTile };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3JhZGlvL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxRQUFRLENBQUE7QUFDbEMsT0FBTyxLQUFLLE1BQU0sU0FBUyxDQUFBO0FBQzNCLE9BQU8sVUFBVSxNQUFNLG9CQUFvQixDQUFBO0FBQzNDLE9BQU8sU0FBUyxNQUFNLHlCQUF5QixDQUFBO0FBRS9DLE9BQU8sRUFBRSxLQUFLLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxTQUFTLEVBQUUsQ0FBQSJ9
+export { default as RadioList } from '../../components/radio/list/RadioList';
+export { default as Radio } from '../../components/radio/Radio';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3JhZGlvL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxPQUFPLElBQUksU0FBUyxFQUFFLE1BQU0sbUNBQW1DLENBQUE7QUFDeEUsT0FBTyxFQUFFLE9BQU8sSUFBSSxLQUFLLEVBQUUsTUFBTSwwQkFBMEIsQ0FBQSJ9

package/lib/components/radio/list/RadioList.d.ts

@@ -1,13 +1,13 @@
-/// <reference types="react" />
-import { RadioListWebProps } from './RadioListProps';
+import React from 'react';
+import { RadioListWebProps } from '../../../components/radio/list/RadioListProps';
 /**
  * Radio List Component
  * @param children {ReactNode} RadioList children
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS Classes
- * @param align {boolean} align radios
- * @param verticalDesktop {boolean} Verical radios
- * @param horizontalMobile {boolean} espect mobile screen
+ * @param centered {boolean} Centered radios
+ * @param vertical {boolean} Verical radios
+ * @param isMobile {boolean} espect mobile screen
  */
-declare const RadioList: ({ className, id, align, horizontalMobile, verticalDesktop, ...others }: RadioListWebProps) => JSX.Element;
+declare const RadioList: React.ForwardRefExoticComponent<RadioListWebProps & React.RefAttributes<HTMLDivElement>>;
 export default RadioList;

package/lib/components/radio/list/RadioList.js

@@ -1,23 +1,22 @@
 import { __assign, __rest } from "tslib";
-import * as React from 'react';
-import { is } from '../../../services';
 import clsx from 'clsx';
-import { hashClass } from '../../../helpers';
-import { useTrilogyContext } from '../../../context';
-import { getJustifiedClassName } from '../../../objects';
+import React from 'react';
+import { ComponentName } from '../../../components/enumsComponentsName';
+import { hashClass } from '../../../helpers/hashClassesHelpers';
+import { has, is } from '../../../services/classify';
 /**
  * Radio List Component
  * @param children {ReactNode} RadioList children
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additionnal CSS Classes
- * @param align {boolean} align radios
- * @param verticalDesktop {boolean} Verical radios
- * @param horizontalMobile {boolean} espect mobile screen
+ * @param centered {boolean} Centered radios
+ * @param vertical {boolean} Verical radios
+ * @param isMobile {boolean} espect mobile screen
  */
-var RadioList = function (_a) {
-    var className = _a.className, id = _a.id, align = _a.align, horizontalMobile = _a.horizontalMobile, verticalDesktop = _a.verticalDesktop, others = __rest(_a, ["className", "id", "align", "horizontalMobile", "verticalDesktop"]);
-    var styled = useTrilogyContext().styled;
-    return (React.createElement("div", __assign({ id: id, className: hashClass(styled, clsx('radios', className, align && is(getJustifiedClassName(align)), horizontalMobile && is('horizontal-mobile'), verticalDesktop && is('vertical-desktop'))) }, others)));
-};
+var RadioList = React.forwardRef(function (_a, ref) {
+    var className = _a.className, centered = _a.centered, isMobile = _a.isMobile, vertical = _a.vertical, others = __rest(_a, ["className", "centered", "isMobile", "vertical"]);
+    return (React.createElement("div", __assign({ ref: ref, className: hashClass(clsx('radios', className, centered && has('text-centered'), isMobile && is('mobile'), vertical && is('vertical'))) }, others)));
+});
+RadioList.displayName = ComponentName.RadioList;
 export default RadioList;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUmFkaW9MaXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9yYWRpby9saXN0L1JhZGlvTGlzdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sS0FBSyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRTlCLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxZQUFZLENBQUE7QUFDL0IsT0FBTyxJQUFJLE1BQU0sTUFBTSxDQUFBO0FBQ3ZCLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDckMsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzdDLE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUVqRDs7Ozs7Ozs7R0FRRztBQUNILElBQU0sU0FBUyxHQUFHLFVBQUMsRUFPQztJQU5sQixJQUFBLFNBQVMsZUFBQSxFQUNULEVBQUUsUUFBQSxFQUNGLEtBQUssV0FBQSxFQUNMLGdCQUFnQixzQkFBQSxFQUNoQixlQUFlLHFCQUFBLEVBQ1osTUFBTSxjQU5RLG1FQU9sQixDQURVO0lBRUQsSUFBQSxNQUFNLEdBQUssaUJBQWlCLEVBQUUsT0FBeEIsQ0FBd0I7SUFFdEMsT0FBTyxDQUNMLHNDQUNFLEVBQUUsRUFBRSxFQUFFLEVBQ04sU0FBUyxFQUFFLFNBQVMsQ0FDbEIsTUFBTSxFQUNOLElBQUksQ0FDRixRQUFRLEVBQ1IsU0FBUyxFQUNULEtBQUssSUFBSSxFQUFFLENBQUMscUJBQXFCLENBQUMsS0FBSyxDQUFDLENBQUMsRUFDekMsZ0JBQWdCLElBQUksRUFBRSxDQUFDLG1CQUFtQixDQUFDLEVBQzNDLGVBQWUsSUFBSSxFQUFFLENBQUMsa0JBQWtCLENBQUMsQ0FDMUMsQ0FDRixJQUNHLE1BQU0sRUFDVixDQUNILENBQUE7QUFDSCxDQUFDLENBQUE7QUFFRCxlQUFlLFNBQVMsQ0FBQSJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUmFkaW9MaXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vY29tcG9uZW50cy9yYWRpby9saXN0L1JhZGlvTGlzdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sSUFBSSxNQUFNLE1BQU0sQ0FBQTtBQUN2QixPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFFekIsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBRWhFLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSw4QkFBOEIsQ0FBQTtBQUN4RCxPQUFPLEVBQUUsR0FBRyxFQUFFLEVBQUUsRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBRTdDOzs7Ozs7OztHQVFHO0FBQ0gsSUFBTSxTQUFTLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FDaEMsVUFDRSxFQUF5RSxFQUN6RSxHQUE4QjtJQUQ1QixJQUFBLFNBQVMsZUFBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFFBQVEsY0FBQSxFQUFFLFFBQVEsY0FBQSxFQUFLLE1BQU0sY0FBcEQsaURBQXNELENBQUY7SUFHcEQsT0FBTyxDQUNMLHNDQUNFLEdBQUcsRUFBRSxHQUFHLEVBQ1IsU0FBUyxFQUFFLFNBQVMsQ0FDbEIsSUFBSSxDQUNGLFFBQVEsRUFDUixTQUFTLEVBQ1QsUUFBUSxJQUFJLEdBQUcsQ0FBQyxlQUFlLENBQUMsRUFDaEMsUUFBUSxJQUFJLEVBQUUsQ0FBQyxRQUFRLENBQUMsRUFDeEIsUUFBUSxJQUFJLEVBQUUsQ0FBQyxVQUFVLENBQUMsQ0FDM0IsQ0FDRixJQUNHLE1BQU0sRUFDVixDQUNILENBQUE7QUFDSCxDQUFDLENBQ0YsQ0FBQTtBQUVELFNBQVMsQ0FBQyxXQUFXLEdBQUcsYUFBYSxDQUFDLFNBQVMsQ0FBQTtBQUMvQyxlQUFlLFNBQVMsQ0FBQSJ9

package/lib/components/radio/list/RadioList.native.d.ts

@@ -1,13 +1,13 @@
 /// <reference types="react" />
-import type { RadioListProps } from './RadioListProps';
 import { ComponentName } from '../../../components/enumsComponentsName';
+import type { RadioListProps } from '../../../components/radio/list/RadioListProps';
 /**
  * RadioList Native Component
  * @param children {ReactNode} RadioList children
  * @param autolayout {boolean} Apply auto-layout rules
  */
 declare const RadioList: {
-    ({ children }: RadioListProps): JSX.Element;
+    ({ autolayout, children }: RadioListProps): JSX.Element;
     displayName: ComponentName;
 };
 export default RadioList;

package/lib/components/radio/list/RadioList.native.js

@@ -1,9 +1,9 @@
 import { __assign } from "tslib";
-import * as React from 'react';
+import React from 'react';
 import { AutoLayoutWrapper } from '../../../components/autolayout';
-import { SpacerSize } from '../../../components/spacer';
 import { SpacingMatrixMode } from '../../../components/autolayout/SpacingMatrix';
 import { ComponentName } from '../../../components/enumsComponentsName';
+import { SpacerSize } from '../../../components/spacer';
 var THREE = SpacerSize.THREE, TWO = SpacerSize.TWO;
 var INSERT_SPACE_BETWEEN = SpacingMatrixMode.INSERT_SPACE_BETWEEN;
 var SPACING_MATRIX = [
@@ -17,9 +17,9 @@ var SPACING_MATRIX = [
  * @param autolayout {boolean} Apply auto-layout rules
  */
 var RadioList = function (_a) {
-    var children = _a.children;
-    return React.createElement(AutoLayoutWrapper, __assign({}, { autolayout: SPACING_MATRIX, children: children }));
+    var _b = _a.autolayout, autolayout = _b === void 0 ? SPACING_MATRIX : _b, children = _a.children;
+    return React.createElement(AutoLayoutWrapper, __assign({}, { autolayout: autolayout, children: children }));
 };
 RadioList.displayName = ComponentName.RadioList;
 export default RadioList;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUmFkaW9MaXN0Lm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvcmFkaW8vbGlzdC9SYWRpb0xpc3QubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0seUJBQXlCLENBQUE7QUFDM0QsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLHFCQUFxQixDQUFBO0FBR2hELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLHVDQUF1QyxDQUFBO0FBRXpFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUV4RCxJQUFBLEtBQUssR0FBVSxVQUFVLE1BQXBCLEVBQUUsR0FBRyxHQUFLLFVBQVUsSUFBZixDQUFlO0FBQ3pCLElBQUEsb0JBQW9CLEdBQUssaUJBQWlCLHFCQUF0QixDQUFzQjtBQUVsRCxJQUFNLGNBQWMsR0FBa0I7SUFDcEMsQ0FBQyxvQkFBb0IsRUFBRSxPQUFPLEVBQUUsU0FBUyxFQUFFLEdBQUcsQ0FBQztJQUMvQyxDQUFDLG9CQUFvQixFQUFFLFNBQVMsRUFBRSxPQUFPLEVBQUUsR0FBRyxDQUFDO0lBQy9DLENBQUMsb0JBQW9CLEVBQUUsT0FBTyxFQUFFLE9BQU8sRUFBRSxLQUFLLENBQUM7Q0FDaEQsQ0FBQTtBQUVEOzs7O0dBSUc7QUFDSCxJQUFNLFNBQVMsR0FBRyxVQUFDLEVBQTRCO1FBQTFCLFFBQVEsY0FBQTtJQUMzQixPQUFPLG9CQUFDLGlCQUFpQixlQUFLLEVBQUUsVUFBVSxFQUFFLGNBQWMsRUFBRSxRQUFRLFVBQUEsRUFBRSxFQUFJLENBQUE7QUFDNUUsQ0FBQyxDQUFBO0FBRUQsU0FBUyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsU0FBUyxDQUFBO0FBRS9DLGVBQWUsU0FBUyxDQUFBIn0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUmFkaW9MaXN0Lm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL2NvbXBvbmVudHMvcmFkaW8vbGlzdC9SYWRpb0xpc3QubmF0aXZlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRXpCLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLHlCQUF5QixDQUFBO0FBRTNELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLHVDQUF1QyxDQUFBO0FBQ3pFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0scUJBQXFCLENBQUE7QUFFeEMsSUFBQSxLQUFLLEdBQVUsVUFBVSxNQUFwQixFQUFFLEdBQUcsR0FBSyxVQUFVLElBQWYsQ0FBZTtBQUN6QixJQUFBLG9CQUFvQixHQUFLLGlCQUFpQixxQkFBdEIsQ0FBc0I7QUFFbEQsSUFBTSxjQUFjLEdBQWtCO0lBQ3BDLENBQUMsb0JBQW9CLEVBQUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxHQUFHLENBQUM7SUFDL0MsQ0FBQyxvQkFBb0IsRUFBRSxTQUFTLEVBQUUsT0FBTyxFQUFFLEdBQUcsQ0FBQztJQUMvQyxDQUFDLG9CQUFvQixFQUFFLE9BQU8sRUFBRSxPQUFPLEVBQUUsS0FBSyxDQUFDO0NBQ2hELENBQUE7QUFFRDs7OztHQUlHO0FBQ0gsSUFBTSxTQUFTLEdBQUcsVUFBQyxFQUF5RDtRQUF2RCxrQkFBMkIsRUFBM0IsVUFBVSxtQkFBRyxjQUFjLEtBQUEsRUFBRSxRQUFRLGNBQUE7SUFDeEQsT0FBTyxvQkFBQyxpQkFBaUIsZUFBSyxFQUFFLFVBQVUsWUFBQSxFQUFFLFFBQVEsVUFBQSxFQUFFLEVBQUksQ0FBQTtBQUM1RCxDQUFDLENBQUE7QUFFRCxTQUFTLENBQUMsV0FBVyxHQUFHLGFBQWEsQ0FBQyxTQUFTLENBQUE7QUFFL0MsZUFBZSxTQUFTLENBQUEifQ==

package/lib/components/radio/list/RadioListProps.d.ts

@@ -1,22 +1,21 @@
 /// <reference types="react" />
-import { Alignable, AlignableValues } from '../../../objects';
 import type { DividerProps } from '../../../components/divider/DividerProps';
 import type { RadioProps } from '../../../components/radio/RadioProps';
-import { CommonProps } from '../../../objects/facets/CommonProps';
+import type { Centerable } from '../../../objects/facets/Centerable';
+import type { Layout } from '../../../objects/facets/Layout';
 type RadioListChildrenTypes = React.ReactElement<RadioProps | DividerProps> | undefined;
 /**
  * Radio List Interface
  */
-export interface RadioListProps {
+export interface RadioListProps extends Layout {
     children?: RadioListChildrenTypes | RadioListChildrenTypes[];
 }
 /**
  * Radio List Web Interface
  */
-export interface RadioListWebProps extends RadioListProps, CommonProps {
-    align?: Alignable | AlignableValues;
+export interface RadioListWebProps extends RadioListProps, Centerable {
     className?: string;
-    horizontalMobile?: boolean;
-    verticalDesktop?: boolean;
+    isMobile?: boolean;
+    vertical?: boolean;
 }
 export {};

package/lib/components/radio/list/RadioListPropsDefaults.js

@@ -6,5 +6,14 @@ export default {
       "JSXElementConstructor<any>>",
       "RadioListChildrenTypes[]"
     ]
+  },
+  "autolayout": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true",
+      "SpacingMatrix"
+    ]
   }
 };

package/lib/components/radio/list/RadioListWebPropsDefaults.js

@@ -1,16 +1,4 @@
 export default {
-  "align": {
-    "type": "enum",
-    "values": [
-      "undefined",
-      "ALIGNED_CENTER",
-      "ALIGNED_START",
-      "ALIGNED_END",
-      "ALIGNED_CENTER",
-      "ALIGNED_START",
-      "ALIGNED_END"
-    ]
-  },
   "className": {
     "type": "string",
     "values": [
@@ -18,7 +6,7 @@ export default {
       "string"
     ]
   },
-  "horizontalMobile": {
+  "isMobile": {
     "type": "boolean",
     "values": [
       "undefined",
@@ -26,7 +14,7 @@ export default {
       "true"
     ]
   },
-  "verticalDesktop": {
+  "vertical": {
     "type": "boolean",
     "values": [
       "undefined",
@@ -42,11 +30,21 @@ export default {
       "RadioListChildrenTypes[]"
     ]
   },
-  "id": {
-    "type": "string",
+  "autolayout": {
+    "type": "boolean",
     "values": [
       "undefined",
-      "string"
+      "false",
+      "true",
+      "SpacingMatrix"
+    ]
+  },
+  "centered": {
+    "type": "boolean",
+    "values": [
+      "undefined",
+      "false",
+      "true"
     ]
   }
 };

package/lib/components/radio/list/index.d.ts

@@ -1,2 +1 @@
-import RadioList from './RadioList';
-export { RadioList };
+export { default as RadioList } from '../../../components/radio/list/RadioList';

package/lib/components/radio/list/index.js

@@ -1,3 +1,2 @@
-import RadioList from './RadioList';
-export { RadioList };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3JhZGlvL2xpc3QvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxTQUFTLE1BQU0sYUFBYSxDQUFBO0FBRW5DLE9BQU8sRUFBRSxTQUFTLEVBQUUsQ0FBQSJ9
+export { default as RadioList } from '../../../components/radio/list/RadioList';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb21wb25lbnRzL3JhZGlvL2xpc3QvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLE9BQU8sSUFBSSxTQUFTLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQSJ9

package/lib/components/range/Range.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
-import { RangeProps } from './RangeProps';
+import React from 'react';
+import { RangeProps } from '../../components/range/RangeProps';
 /**
  * Range Component
  * - -------------------------- MOBILE PROPERTIES -------------------------------
@@ -7,10 +7,19 @@ import { RangeProps } from './RangeProps';
  * @param max {number} max length
  * @param label {string} label of range
  * @param labelValueCursorMin {string} label to display next to value display
+ * @param labelValueCursorMax {string} label to display next to value display
+ * @param onChange {function}
  * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param nameMin {string} name input min
+ * @param idMin {string} id input min
+ * @param nameMax{string} name input max
+ * @param idMax {string} id input max
  * @param gap {number} space max between min and max cursor
+ * @param valueCursorMin {number} number of input min
+ * @param valueCursorMax {number} number of input max
  * @param onChangeMin {function} on change min cursor
  * @param onChangeMax {function} on change max cursor
+ * @param testId {string} Test Id for Test Integration
  */
-declare const Range: ({ className, id, min, max, label, valueMin, valueMax, unit, onChangeMin, onChangeMax, name, gap, }: RangeProps) => JSX.Element;
+declare const Range: React.ForwardRefExoticComponent<RangeProps & React.RefAttributes<HTMLDivElement>>;
 export default Range;

package/lib/components/range/Range.js

@@ -1,9 +1,8 @@
-import { __read } from "tslib";
-import * as React from 'react';
-import { getColorStyle, TrilogyColor } from '../../objects';
-import { hashClass } from '../../helpers';
 import clsx from 'clsx';
-import { useTrilogyContext } from '../../context';
+import React from 'react';
+import { ComponentName } from '../../components/enumsComponentsName';
+import { useRange } from '../../components/range/hook/useRange';
+import { hashClass } from '../../helpers/hashClassesHelpers';
 /**
  * Range Component
  * - -------------------------- MOBILE PROPERTIES -------------------------------
@@ -11,70 +10,41 @@ import { useTrilogyContext } from '../../context';
  * @param max {number} max length
  * @param label {string} label of range
  * @param labelValueCursorMin {string} label to display next to value display
+ * @param labelValueCursorMax {string} label to display next to value display
+ * @param onChange {function}
  * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param nameMin {string} name input min
+ * @param idMin {string} id input min
+ * @param nameMax{string} name input max
+ * @param idMax {string} id input max
  * @param gap {number} space max between min and max cursor
+ * @param valueCursorMin {number} number of input min
+ * @param valueCursorMax {number} number of input max
  * @param onChangeMin {function} on change min cursor
  * @param onChangeMax {function} on change max cursor
+ * @param testId {string} Test Id for Test Integration
  */
-var Range = function (_a) {
-    var className = _a.className, id = _a.id, min = _a.min, max = _a.max, label = _a.label, valueMin = _a.valueMin, valueMax = _a.valueMax, unit = _a.unit, onChangeMin = _a.onChangeMin, onChangeMax = _a.onChangeMax, name = _a.name, _b = _a.gap, gap = _b === void 0 ? 0 : _b;
-    var styled = useTrilogyContext().styled;
-    var _c = __read(React.useState(valueMin !== null && valueMin !== void 0 ? valueMin : 0), 2), cursorMin = _c[0], setCursorMin = _c[1];
-    var _d = __read(React.useState(valueMax !== null && valueMax !== void 0 ? valueMax : max), 2), cursorMax = _d[0], setCursorMax = _d[1];
-    var refTrack = React.useRef(null);
-    React.useEffect(function () {
-        if (refTrack.current) {
-            var track = refTrack.current;
-            track.style.background = "linear-gradient(to right, ".concat(getColorStyle(TrilogyColor.NEUTRAL_FADE), " ").concat((cursorMin / max) * 100, "% , ").concat(getColorStyle(TrilogyColor.MAIN_FADE), " ").concat((cursorMin / max) * 100, "% , ").concat(getColorStyle(TrilogyColor.MAIN_FADE), " ").concat((cursorMax / max) * 100, "%, ").concat(getColorStyle(TrilogyColor.NEUTRAL_FADE), " ").concat((cursorMax / max) * 100, "%) ");
-        }
-    }, [cursorMin, cursorMax]);
-    React.useEffect(function () {
-        setCursorMin(valueMin || 0);
-    }, [valueMin]);
-    React.useEffect(function () {
-        setCursorMax(valueMax || max);
-    }, [valueMax]);
-    var handleChangeCursorMin = React.useCallback(function (e) {
-        if (Number(e.target.value) < cursorMax - gap)
-            setCursorMin(Number(e.target.value));
-    }, [cursorMax, cursorMin]);
-    var handleChangeCursorMax = React.useCallback(function (e) {
-        if (Number(e.target.value) > cursorMin + gap)
-            setCursorMax(Number(e.target.value));
-    }, [cursorMax, cursorMin]);
-    var handleMouseUpMin = React.useCallback(function () {
-        if (onChangeMin) {
-            onChangeMin({
-                inputName: name,
-                inputValue: cursorMin,
-            });
-        }
-    }, [onChangeMin, name, cursorMin]);
-    var handleMouseUpMax = React.useCallback(function () {
-        if (onChangeMax) {
-            onChangeMax({
-                inputName: name,
-                inputValue: cursorMax,
-            });
-        }
-    }, [onChangeMax, name, cursorMax]);
-    return (React.createElement("div", { id: id, className: hashClass(styled, clsx('range-container', className)) },
-        React.createElement("label", { className: hashClass(styled, clsx('range-label')) }, label),
-        React.createElement("div", { className: hashClass(styled, clsx('range')) },
-            React.createElement("div", { ref: refTrack, className: hashClass(styled, clsx('range-track')) }),
-            React.createElement("input", { className: hashClass(styled, clsx('range-cursor range-cursor-min')), onMouseUp: handleMouseUpMin, onChange: handleChangeCursorMin, value: cursorMin, type: 'range', min: min, max: max, name: name, id: "".concat(id, "-min"), "aria-label": label }),
-            React.createElement("input", { className: hashClass(styled, clsx('range-cursor range-cursor-max')), onMouseUp: handleMouseUpMax, onChange: handleChangeCursorMax, value: cursorMax, type: 'range', min: min, max: max, name: name, id: "".concat(id, "-max"), "aria-label": label })),
-        React.createElement("div", { className: hashClass(styled, clsx('range-values')) },
+var Range = React.forwardRef(function (_a, ref) {
+    var min = _a.min, max = _a.max, label = _a.label, valueCursorMin = _a.valueCursorMin, valueCursorMax = _a.valueCursorMax, labelValueCursorMin = _a.labelValueCursorMin, labelValueCursorMax = _a.labelValueCursorMax, onChangeMin = _a.onChangeMin, onChangeMax = _a.onChangeMax, nameMin = _a.nameMin, idMin = _a.idMin, nameMax = _a.nameMax, idMax = _a.idMax, testId = _a.testId, _b = _a.gap, gap = _b === void 0 ? 0 : _b;
+    var _c = useRange({ valueCursorMin: valueCursorMin, valueCursorMax: valueCursorMax, max: max, gap: gap, onChangeMin: onChangeMin, onChangeMax: onChangeMax, nameMin: nameMin, nameMax: nameMax }), refTrack = _c.refTrack, cursorMax = _c.cursorMax, cursorMin = _c.cursorMin, handleMouseUpMin = _c.handleMouseUpMin, handleChangeCursorMin = _c.handleChangeCursorMin, handleMouseUpMax = _c.handleMouseUpMax, handleChangeCursorMax = _c.handleChangeCursorMax;
+    return (React.createElement("div", { "data-testid": testId, className: hashClass(clsx('range-container')), ref: ref },
+        React.createElement("label", { className: hashClass(clsx('range-label')) }, label),
+        React.createElement("div", { className: hashClass(clsx('range')) },
+            React.createElement("div", { ref: refTrack, className: hashClass(clsx('range-track')) }),
+            React.createElement("input", { "data-testid": "".concat(testId, "_min"), className: hashClass(clsx('range-cursor range-cursor-min')), onMouseUp: handleMouseUpMin, onChange: handleChangeCursorMin, onTouchEnd: handleMouseUpMin, value: cursorMin, type: 'range', min: min, max: max, name: nameMin, id: idMin, "aria-label": label }),
+            React.createElement("input", { "data-testid": "".concat(testId, "_max"), className: hashClass(clsx('range-cursor range-cursor-max')), onMouseUp: handleMouseUpMax, onChange: handleChangeCursorMax, onTouchEnd: handleMouseUpMax, value: cursorMax, type: 'range', min: min, max: max, name: nameMax, id: idMax, "aria-label": label })),
+        React.createElement("div", { className: hashClass(clsx('range-values')) },
             React.createElement("div", null,
-                React.createElement("span", { className: hashClass(styled, clsx('range-value-min')) }, cursorMin),
-                unit && React.createElement("span", null,
+                React.createElement("span", { className: hashClass(clsx('range-value-min')) }, cursorMin),
+                labelValueCursorMin && React.createElement("span", null,
                     " ",
-                    unit)),
+                    labelValueCursorMin)),
             React.createElement("div", null,
-                React.createElement("span", { className: hashClass(styled, clsx('range-value-max')) }, cursorMax),
-                unit && React.createElement("span", null,
+                React.createElement("span", { className: hashClass(clsx('range-value-max')) }, cursorMax),
+                labelValueCursorMax && React.createElement("span", null,
                     " ",
-                    unit)))));
-};
+                    labelValueCursorMax)))));
+});
+Range.displayName = ComponentName.Range;
 export default Range;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUmFuZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3JhbmdlL1JhbmdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxLQUFLLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDOUIsT0FBTyxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFFdkQsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQTtBQUNyQyxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sV0FBVyxDQUFBO0FBRTdDOzs7Ozs7Ozs7OztHQVdHO0FBQ0gsSUFBTSxLQUFLLEdBQUcsVUFBQyxFQWFGO1FBWlgsU0FBUyxlQUFBLEVBQ1QsRUFBRSxRQUFBLEVBQ0YsR0FBRyxTQUFBLEVBQ0gsR0FBRyxTQUFBLEVBQ0gsS0FBSyxXQUFBLEVBQ0wsUUFBUSxjQUFBLEVBQ1IsUUFBUSxjQUFBLEVBQ1IsSUFBSSxVQUFBLEVBQ0osV0FBVyxpQkFBQSxFQUNYLFdBQVcsaUJBQUEsRUFDWCxJQUFJLFVBQUEsRUFDSixXQUFPLEVBQVAsR0FBRyxtQkFBRyxDQUFDLEtBQUE7SUFFQyxJQUFBLE1BQU0sR0FBSyxpQkFBaUIsRUFBRSxPQUF4QixDQUF3QjtJQUVoQyxJQUFBLEtBQUEsT0FBNEIsS0FBSyxDQUFDLFFBQVEsQ0FBUyxRQUFRLGFBQVIsUUFBUSxjQUFSLFFBQVEsR0FBSSxDQUFDLENBQUMsSUFBQSxFQUFoRSxTQUFTLFFBQUEsRUFBRSxZQUFZLFFBQXlDLENBQUE7SUFDakUsSUFBQSxLQUFBLE9BQTRCLEtBQUssQ0FBQyxRQUFRLENBQVMsUUFBUSxhQUFSLFFBQVEsY0FBUixRQUFRLEdBQUksR0FBRyxDQUFDLElBQUEsRUFBbEUsU0FBUyxRQUFBLEVBQUUsWUFBWSxRQUEyQyxDQUFBO0lBQ3pFLElBQU0sUUFBUSxHQUFHLEtBQUssQ0FBQyxN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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUmFuZ2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3JhbmdlL1JhbmdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFBO0FBRXpCLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUNoRSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sa0NBQWtDLENBQUE7QUFFM0QsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDhCQUE4QixDQUFBO0FBRXhEOzs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQW9CRztBQUNILElBQU0sS0FBSyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQzVCLFVBQ0UsRUFnQmEsRUFDYixHQUE4QjtRQWhCNUIsR0FBRyxTQUFBLEVBQ0gsR0FBRyxTQUFBLEVBQ0gsS0FBSyxXQUFBLEVBQ0wsY0FBYyxvQkFBQSxFQUNkLGNBQWMsb0JBQUEsRUFDZCxtQkFBbUIseUJBQUEsRUFDbkIsbUJBQW1CLHlCQUFBLEVBQ25CLFdBQVcsaUJBQUEsRUFDWCxXQUFXLGlCQUFBLEVBQ1gsT0FBTyxhQUFBLEVBQ1AsS0FBSyxXQUFBLEVBQ0wsT0FBTyxhQUFBLEVBQ1AsS0FBSyxXQUFBLEVBQ0wsTUFBTSxZQUFBLEVBQ04sV0FBTyxFQUFQLEdBQUcsbUJBQUcsQ0FBQyxLQUFBO0lBSUgsSUFBQSxLQVFGLFFBQVEsQ0FBQyxFQUFFLGNBQWMsZ0JBQUEsRUFBRSxjQUFjLGdCQUFBLEVBQUUsR0FBRyxLQUFBLEVBQUUsR0FBRyxLQUFBLEVBQUUsV0FBVyxhQUFBLEVBQUUsV0FBVyxhQUFBLEVBQUUsT0FBTyxTQUFBLEVBQUUsT0FBTyxTQUFBLEVBQUUsQ0FBQyxFQVBwRyxRQUFRLGNBQUEsRUFDUixTQUFTLGVBQUEsRUFDVCxTQUFTLGVBQUEsRUFDVCxnQkFBZ0Isc0JBQUEsRUFDaEIscUJBQXFCLDJCQUFBLEVBQ3JCLGdCQUFnQixzQkFBQSxFQUNoQixxQkFBcUIsMkJBQytFLENBQUE7SUFFdEcsT0FBTyxDQUNMLDRDQUFrQixNQUFNLEVBQUUsU0FBUyxFQUFFLFNBQVMsQ0FBQyxJQUFJLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxFQUFFLEdBQUcsRUFBRSxHQUFHO1FBQy9FLCtCQUFPLFNBQVMsRUFBRSxTQUFTLENBQUMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxDQUFDLElBQUcsS0FBSyxDQUFTO1FBQ2pFLDZCQUFLLFNBQVMsRUFBRSxTQUFTLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1lBQ3RDLDZCQUFLLEdBQUcsRUFBRSxRQUFRLEVBQUUsU0FBUyxFQUFFLFNBQVMsQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUMsR0FBUTtZQUNyRSw4Q0FDZSxVQUFHLE1BQU0sU0FBTSxFQUM1QixTQUFTLEVBQUUsU0FBUyxDQUFDLElBQUksQ0FBQywrQkFBK0IsQ0FBQyxDQUFDLEVBQzNELFNBQVMsRUFBRSxnQkFBZ0IsRUFDM0IsUUFBUSxFQUFFLHFCQUFxQixFQUMvQixVQUFVLEVBQUUsZ0JBQWdCLEVBQzVCLEtBQUssRUFBRSxTQUFTLEVBQ2hCLElBQUksRUFBQyxPQUFPLEVBQ1osR0FBRyxFQUFFLEdBQUcsRUFDUixHQUFHLEVBQUUsR0FBRyxFQUNSLElBQUksRUFBRSxPQUFPLEVBQ2IsRUFBRSxFQUFFLEtBQUssZ0JBQ0csS0FBSyxHQUNqQjtZQUNGLDhDQUNlLFVBQUcsTUFBTSxTQUFNLEVBQzVCLFNBQVMsRUFBRSxTQUFTLENBQUMsSUFBSSxDQUFDLCtCQUErQixDQUFDLENBQUMsRUFDM0QsU0FBUyxFQUFFLGdCQUFnQixFQUMzQixRQUFRLEVBQUUscUJBQXFCLEVBQy9CLFVBQVUsRUFBRSxnQkFBZ0IsRUFDNUIsS0FBSyxFQUFFLFNBQVMsRUFDaEIsSUFBSSxFQUFDLE9BQU8sRUFDWixHQUFHLEVBQUUsR0FBRyxFQUNSLEdBQUcsRUFBRSxHQUFHLEVBQ1IsSUFBSSxFQUFFLE9BQU8sRUFDYixFQUFFLEVBQUUsS0FBSyxnQkFDRyxLQUFLLEdBQ2pCLENBQ0U7UUFDTiw2QkFBSyxTQUFTLEVBQUUsU0FBUyxDQUFDLElBQUksQ0FBQyxjQUFjLENBQUMsQ0FBQztZQUM3QztnQkFDRSw4QkFBTSxTQUFTLEVBQUUsU0FBUyxDQUFDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDLElBQUcsU0FBUyxDQUFRO2dCQUN0RSxtQkFBbUIsSUFBSTs7b0JBQVEsbUJBQW1CLENBQVEsQ0FDdkQ7WUFDTjtnQkFDRSw4QkFBTSxTQUFTLEVBQUUsU0FBUyxDQUFDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDLElBQUcsU0FBUyxDQUFRO2dCQUN0RSxtQkFBbUIsSUFBSTs7b0JBQVEsbUJBQW1CLENBQVEsQ0FDdkQsQ0FDRixDQUNGLENBQ1AsQ0FBQTtBQUNILENBQUMsQ0FDRixDQUFBO0FBRUQsS0FBSyxDQUFDLFdBQVcsR0FBRyxhQUFhLENBQUMsS0FBSyxDQUFBO0FBQ3ZDLGVBQWUsS0FBSyxDQUFBIn0=

package/lib/components/range/Range.native.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
-import { RangeProps } from './RangeProps';
-import { ComponentName } from '../../components/enumsComponentsName';
+import React from 'react';
+import { View } from 'react-native';
+import { RangeProps } from '../../components/range/RangeProps';
 /**
  * Range Component
  * - -------------------------- MOBILE PROPERTIES -------------------------------
@@ -8,11 +8,19 @@ import { ComponentName } from '../../components/enumsComponentsName';
  * @param max {number} max length
  * @param label {string} label of range
  * @param labelValueCursorMin {string} label to display next to value display
+ * @param labelValueCursorMax {string} label to display next to value display
  * @param onChange {function}
  * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param nameMin {string} name input min
+ * @param idMin {string} id input min
+ * @param nameMax{string} name input max
+ * @param idMax {string} id input max
+ * @param gap {number} space max between min and max cursor
+ * @param valueCursorMin {number} number of input min
+ * @param valueCursorMax {number} number of input max
+ * @param onChangeMin {function} on change min cursor
+ * @param onChangeMax {function} on change max cursor
+ * @param testId {string} Test Id for Test Integration
  */
-declare const Range: {
-    ({ min, max, label, unit, onChange }: RangeProps): JSX.Element;
-    displayName: ComponentName;
-};
+declare const Range: React.ForwardRefExoticComponent<RangeProps & React.RefAttributes<View>>;
 export default Range;

package/lib/components/range/Range.native.js

@@ -1,10 +1,11 @@
 import { __read } from "tslib";
-import * as React from 'react';
+import React from 'react';
 import { StyleSheet, View } from 'react-native';
-import MultiSlider from '@ptomasroos/react-native-multi-slider';
-import { Text, TextLevels } from '../text';
-import { getColorStyle, TrilogyColor, TypographyBold } from '../../objects';
 import { ComponentName } from '../../components/enumsComponentsName';
+import { Text, TextLevels } from '../../components/text';
+import { getColorStyle, TrilogyColor } from '../../objects/facets/Color';
+import { TypographyBold } from '../../objects/Typography/TypographyBold';
+import MultiSlider from '@ptomasroos/react-native-multi-slider';
 /**
  * Range Component
  * - -------------------------- MOBILE PROPERTIES -------------------------------
@@ -12,11 +13,22 @@ import { ComponentName } from '../../components/enumsComponentsName';
  * @param max {number} max length
  * @param label {string} label of range
  * @param labelValueCursorMin {string} label to display next to value display
+ * @param labelValueCursorMax {string} label to display next to value display
  * @param onChange {function}
  * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param nameMin {string} name input min
+ * @param idMin {string} id input min
+ * @param nameMax{string} name input max
+ * @param idMax {string} id input max
+ * @param gap {number} space max between min and max cursor
+ * @param valueCursorMin {number} number of input min
+ * @param valueCursorMax {number} number of input max
+ * @param onChangeMin {function} on change min cursor
+ * @param onChangeMax {function} on change max cursor
+ * @param testId {string} Test Id for Test Integration
  */
-var Range = function (_a) {
-    var min = _a.min, max = _a.max, label = _a.label, unit = _a.unit, onChange = _a.onChange;
+var Range = React.forwardRef(function (_a, ref) {
+    var min = _a.min, max = _a.max, label = _a.label, labelValueCursorMin = _a.labelValueCursorMin, labelValueCursorMax = _a.labelValueCursorMax, onChange = _a.onChange;
     var _b = __read(React.useState([0, 100]), 2), values = _b[0], setValues = _b[1];
     var _c = __read(React.useState(0), 2), width = _c[0], setWidth = _c[1];
     var styles = StyleSheet.create({
@@ -41,7 +53,7 @@ var Range = function (_a) {
         },
     });
     var Marker = function () { return React.createElement(View, { style: styles.marker }); };
-    return (React.createElement(View, { onLayout: function (event) {
+    return (React.createElement(View, { ref: ref, onLayout: function (event) {
             var width = event.nativeEvent.layout.width;
             setWidth(width);
         } },
@@ -60,11 +72,11 @@ var Range = function (_a) {
         React.createElement(View, { style: styles.markerLabels },
             React.createElement(View, { style: { flexDirection: 'row' } },
                 React.createElement(Text, { level: TextLevels.THREE, typo: TypographyBold.TEXT_WEIGHT_SEMIBOLD }, values[0]),
-                unit && (React.createElement(Text, { level: TextLevels.THREE, typo: TypographyBold.TEXT_WEIGHT_SEMIBOLD }, unit))),
+                labelValueCursorMin && (React.createElement(Text, { level: TextLevels.THREE, typo: TypographyBold.TEXT_WEIGHT_SEMIBOLD }, labelValueCursorMin))),
             React.createElement(View, { style: { flexDirection: 'row' } },
                 React.createElement(Text, { level: TextLevels.THREE, typo: TypographyBold.TEXT_WEIGHT_SEMIBOLD }, values[1]),
-                unit && (React.createElement(Text, { level: TextLevels.THREE, typo: TypographyBold.TEXT_WEIGHT_SEMIBOLD }, unit))))));
-};
+                labelValueCursorMax && (React.createElement(Text, { level: TextLevels.THREE, typo: TypographyBold.TEXT_WEIGHT_SEMIBOLD }, labelValueCursorMax))))));
+});
 Range.displayName = ComponentName.Range;
 export default Range;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUmFuZ2UubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9yYW5nZS9SYW5nZS5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssS0FBSyxNQUFNLE9BQU8sQ0FBQTtBQUM5QixPQUFPLEVBQUUsVUFBVSxFQUFFLElBQUksRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUUvQyxPQUFPLFdBQVcsTUFBTSx1Q0FBdUMsQ0FBQTtBQUMvRCxPQUFPLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRSxNQUFNLFNBQVMsQ0FBQTtBQUMxQyxPQUFPLEVBQUUsYUFBYSxFQUFFLFlBQVksRUFBRSxjQUFjLEVBQUUsTUFBTSxXQUFXLENBQUE7QUFDdkUsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBRWhFOzs7Ozs7Ozs7R0FTRztBQUNILElBQU0sS0FBSyxHQUFHLFVBQUMsRUFBK0M7UUFBN0MsR0FBRyxTQUFBLEVBQUUsR0FBRyxTQUFBLEVBQUUsS0FBSyxXQUFBLEVBQUUsSUFBSSxVQUFBLEVBQUUsUUFBUSxjQUFBO0lBQ3hDLElBQUEsS0FBQSxPQUFzQixLQUFLLENBQUMsUUFBUSxDQUFXLENBQUMsQ0FBQyxFQUFFLEdBQUcsQ0FBQyxDQUFDLElBQUEsRUFBdkQsTUFBTSxRQUFBLEVBQUUsU0FBUyxRQUFzQyxDQUFBO0lBQ3hELElBQUEsS0FBQSxPQUFvQixLQUFLLENBQUMsUUFBUSxDQUFTLENBQUMsQ0FBQyxJQUFBLEVBQTVDLEtBQUssUUFBQSxFQUFFLFFBQVEsUUFBNkIsQ0FBQTtJQUVuRCxJQUFNLE1BQU0sR0FBRyxVQUFVLENBQUMsTUFBTSxDQUFDO1FBQy9CLE1BQU0sRUFBRTtZQUNOLEtBQUssRUFBRSxFQUFFO1lBQ1QsTUFBTSxFQUFFLEVBQUU7WUFDVixZQUFZLEVBQUUsRUFBRTtZQUNoQixlQUFlLEVBQUUsT0FBTztZQUN4QixXQUFXLEVBQUUsTUFB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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiUmFuZ2UubmF0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9yYW5nZS9SYW5nZS5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUE7QUFDekIsT0FBTyxFQUFFLFVBQVUsRUFBRSxJQUFJLEVBQUUsTUFBTSxjQUFjLENBQUE7QUFFL0MsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLGtDQUFrQyxDQUFBO0FBRWhFLE9BQU8sRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLE1BQU0sbUJBQW1CLENBQUE7QUFDcEQsT0FBTyxFQUFFLGFBQWEsRUFBRSxZQUFZLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQTtBQUNwRSxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0scUNBQXFDLENBQUE7QUFDcEUsT0FBTyxXQUFXLE1BQU0sdUNBQXVDLENBQUE7QUFFL0Q7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBb0JHO0FBQ0gsSUFBTSxLQUFLLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FDNUIsVUFDRSxFQUFtRixFQUNuRixHQUFvQjtRQURsQixHQUFHLFNBQUEsRUFBRSxHQUFHLFNBQUEsRUFBRSxLQUFLLFdBQUEsRUFBRSxtQkFBbUIseUJBQUEsRUFBRSxtQkFBbUIseUJBQUEsRUFBRSxRQUFRLGNBQUE7SUFHL0QsSUFBQSxLQUFBLE9BQXNCLEtBQUssQ0FBQyxRQUFRLENBQVcsQ0FBQyxDQUFDLEVBQUUsR0FBRyxDQUFDLENBQUMsSUFBQSxFQUF2RCxNQUFNLFFBQUEsRUFBRSxTQUFTLFFBQXNDLENBQUE7SUFDeEQsSUFBQSxLQUFBLE9BQW9CLEtBQUssQ0FBQyxRQUFRLENBQVMsQ0FBQyxDQUFDLElBQUEsRUFBNUMsS0FBSyxRQUFBLEVBQUUsUUFBUSxRQUE2QixDQUFBO0lBRW5ELElBQU0sTUFBTSxHQUFHLFVBQVUsQ0FBQyxNQUFNLENBQUM7UUFDL0IsTUFBTSxFQUFFO1lB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

package/lib/components/range/RangeProps.d.ts

@@ -1,8 +1,8 @@
 /**
  * range Interface
  */
-import { Accessibility, Dev } from '../../objects';
-import { CommonProps } from '../../objects/facets/CommonProps';
+import { Accessibility } from '../../objects/facets/Accessibility';
+import { Dev } from '../../objects/facets/Dev';
 export type InputChangeEventHandlerNative = (event: {
     inputValue: number[];
     inputName: string;
@@ -11,16 +11,20 @@ export type InputChangeEventHandlerWeb = (event: {
     inputValue: number;
     inputName: string | undefined;
 }) => void;
-export interface RangeProps extends Accessibility, Dev, CommonProps {
+export interface RangeProps extends Accessibility, Dev {
     min: number;
     max: number;
     label?: string;
-    valueMin?: number;
-    valueMax?: number;
-    unit?: string;
+    valueCursorMin?: number;
+    valueCursorMax?: number;
+    labelValueCursorMin?: string;
+    labelValueCursorMax?: string;
     onChangeMin?: InputChangeEventHandlerWeb;
     onChangeMax?: InputChangeEventHandlerWeb;
-    name?: string;
+    nameMin?: string;
+    idMin?: string;
+    nameMax?: string;
+    idMax?: string;
     gap?: number;
     onChange?: InputChangeEventHandlerNative;
 }