@seeqdev/qomponents 0.0.112 → 0.0.114

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (45) hide show
  1. package/dist/Alert/Alert.types.d.ts +5 -2
  2. package/dist/Collapse/Collapse.d.ts +4 -0
  3. package/dist/Collapse/Collapse.js +20 -0
  4. package/dist/Collapse/Collapse.js.map +1 -0
  5. package/dist/Collapse/Collapse.stories.d.ts +5 -0
  6. package/dist/Collapse/Collapse.stories.js +37 -0
  7. package/dist/Collapse/Collapse.stories.js.map +1 -0
  8. package/dist/Collapse/Collapse.test.d.ts +1 -0
  9. package/dist/Collapse/Collapse.test.js +24 -0
  10. package/dist/Collapse/Collapse.test.js.map +1 -0
  11. package/dist/Collapse/Collapse.types.d.ts +4 -0
  12. package/dist/Collapse/Collapse.types.js +2 -0
  13. package/dist/Collapse/Collapse.types.js.map +1 -0
  14. package/dist/Collapse/index.d.ts +1 -0
  15. package/dist/Collapse/index.js +2 -0
  16. package/dist/Collapse/index.js.map +1 -0
  17. package/dist/InputGroup/InputGroup.types.d.ts +1 -1
  18. package/dist/InputGroup/index.d.ts +1 -0
  19. package/dist/ProgressBar/ProgressBar.types.d.ts +2 -0
  20. package/dist/index.esm.js +15 -12
  21. package/dist/index.esm.js.map +1 -1
  22. package/dist/index.js +15 -12
  23. package/dist/index.js.map +1 -1
  24. package/dist/styles.css +17 -0
  25. package/package.json +1 -1
  26. package/dist/ProgressBar/ProgressBar.js +0 -16
  27. package/dist/ProgressBar/ProgressBar.js.map +0 -1
  28. package/dist/ProgressBar/ProgressBar.stories.js +0 -42
  29. package/dist/ProgressBar/ProgressBar.stories.js.map +0 -1
  30. package/dist/ProgressBar/ProgressBar.test.js +0 -32
  31. package/dist/ProgressBar/ProgressBar.test.js.map +0 -1
  32. package/dist/ProgressBar/ProgressBar.types.js +0 -2
  33. package/dist/ProgressBar/ProgressBar.types.js.map +0 -1
  34. package/dist/ProgressBar/index.js +0 -2
  35. package/dist/ProgressBar/index.js.map +0 -1
  36. package/dist/Slider/Slider.js +0 -13
  37. package/dist/Slider/Slider.js.map +0 -1
  38. package/dist/Slider/Slider.stories.js +0 -58
  39. package/dist/Slider/Slider.stories.js.map +0 -1
  40. package/dist/Slider/Slider.test.js +0 -38
  41. package/dist/Slider/Slider.test.js.map +0 -1
  42. package/dist/Slider/Slider.types.js +0 -2
  43. package/dist/Slider/Slider.types.js.map +0 -1
  44. package/dist/Slider/index.js +0 -2
  45. package/dist/Slider/index.js.map +0 -1
package/dist/styles.css CHANGED
@@ -1838,6 +1838,10 @@ ol,
1838
1838
  left: 50%;
1839
1839
  }
1840
1840
 
1841
+ .tw-right-\[10px\] {
1842
+ right: 10px;
1843
+ }
1844
+
1841
1845
  .tw-top-0 {
1842
1846
  top: 0px;
1843
1847
  }
@@ -1846,6 +1850,10 @@ ol,
1846
1850
  top: 50%;
1847
1851
  }
1848
1852
 
1853
+ .tw-top-\[10px\] {
1854
+ top: 10px;
1855
+ }
1856
+
1849
1857
  .\!tw-z-\[9000\] {
1850
1858
  z-index: 9000 !important;
1851
1859
  }
@@ -2061,6 +2069,10 @@ ol,
2061
2069
  height: 1px;
2062
2070
  }
2063
2071
 
2072
+ .tw-h-\[200px\] {
2073
+ height: 200px;
2074
+ }
2075
+
2064
2076
  .tw-h-\[27px\] {
2065
2077
  height: 27px;
2066
2078
  }
@@ -2495,6 +2507,11 @@ ol,
2495
2507
  border-color: rgb(var(--sq-danger-color));
2496
2508
  }
2497
2509
 
2510
+ .tw-border-sq-darkish-gray {
2511
+ --tw-border-opacity: 1;
2512
+ border-color: rgb(var(--sq-darkish-gray));
2513
+ }
2514
+
2498
2515
  .tw-border-sq-disabled-gray {
2499
2516
  --tw-border-opacity: 1;
2500
2517
  border-color: rgb(var(--sq-disabled-gray));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@seeqdev/qomponents",
3
- "version": "0.0.112",
3
+ "version": "0.0.114",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/index.esm.js",
6
6
  "types": "dist/index.js",
@@ -1,16 +0,0 @@
1
- import React from 'react';
2
- import * as Progress from '@radix-ui/react-progress';
3
- import { getQTipData } from '../Tooltip/qTip.utilities';
4
- const ProgressBar = ({ value, max = 100, label, extraClasses }) => {
5
- const tooltipData = getQTipData({ tooltip: label });
6
- const [progress, setProgress] = React.useState(0);
7
- React.useEffect(() => {
8
- const timer = setTimeout(() => setProgress(value), 500);
9
- return () => clearTimeout(timer);
10
- }, []);
11
- return (React.createElement("span", { ...tooltipData },
12
- React.createElement(Progress.Root, { className: "tw-relative tw-h-[18px] tw-w-full tw-overflow-hidden tw-rounded-[2.5px] tw-bg-sq-dark-gray dark:tw-bg-sq-dark-disabled-gray", max: max, value: value },
13
- React.createElement(Progress.Indicator, { className: `tw-ease-[cubic-bezier(0.65, 0, 0.35, 1)] tw-h-full tw-bg-sq-color-dark tw-transition-transform tw-duration-[660ms] ${extraClasses}`, style: { transform: `translateX(-${100 - progress}%)` } }))));
14
- };
15
- export default ProgressBar;
16
- //# sourceMappingURL=ProgressBar.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../src/ProgressBar/ProgressBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,QAAQ,MAAM,0BAA0B,CAAC;AAErD,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAExD,MAAM,WAAW,GAA8C,CAAC,EAAE,KAAK,EAAE,GAAG,GAAG,GAAG,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,EAAE;IAC3G,MAAM,WAAW,GAAG,WAAW,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;IAEpD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAElD,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,GAAG,CAAC,CAAC;QACxD,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,OAAO,CACL,iCAAU,WAAW;QACnB,oBAAC,QAAQ,CAAC,IAAI,IACZ,SAAS,EAAC,6HAA6H,EACvI,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK;YACZ,oBAAC,QAAQ,CAAC,SAAS,IACjB,SAAS,EAAE,sHAAsH,YAAY,EAAE,EAC/I,KAAK,EAAE,EAAE,SAAS,EAAE,eAAe,GAAG,GAAG,QAAQ,IAAI,EAAE,GACvD,CACY,CACX,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -1,42 +0,0 @@
1
- import React from 'react';
2
- import ProgressBar from './ProgressBar';
3
- import { QTip } from '../Tooltip';
4
- export default {
5
- title: 'ProgressBar',
6
- };
7
- export const AllProgressBars = () => {
8
- const renderAllVariations = () => (React.createElement(React.Fragment, null,
9
- React.createElement("div", { className: "tw-p-4 light" },
10
- React.createElement("div", { className: "tw-p-4" },
11
- React.createElement(ProgressBar, { max: 100, value: 40, label: "40%" })),
12
- React.createElement("div", { className: "tw-p-4" },
13
- React.createElement(ProgressBar, { max: 100, value: 10, label: "100%" })),
14
- React.createElement("div", { className: "tw-p-4" },
15
- React.createElement(ProgressBar, { value: 0, max: 100, label: "10%" })),
16
- React.createElement("div", { className: "tw-p-4" },
17
- React.createElement(ProgressBar, { value: 70, max: 100, label: "70%", extraClasses: "tw-bg-sq-text-color" }))),
18
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
19
- React.createElement("div", { className: "tw-p-4" },
20
- React.createElement(ProgressBar, { max: 10, value: 4, label: "40%" })),
21
- React.createElement("div", { className: "tw-p-4" },
22
- React.createElement(ProgressBar, { max: 10, value: 10, label: "100%" })),
23
- React.createElement("div", { className: "tw-p-4" },
24
- React.createElement(ProgressBar, { value: 0, max: 10, label: "0%" })),
25
- React.createElement("div", { className: "tw-p-4" },
26
- React.createElement(ProgressBar, { value: 70, max: 100, label: "70%", extraClasses: "tw-bg-sq-text-color" })))));
27
- return (React.createElement("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4" },
28
- React.createElement(QTip, null),
29
- React.createElement("div", { className: "color_topic" },
30
- React.createElement("b", null, "Topic Colors"),
31
- renderAllVariations()),
32
- React.createElement("div", { className: "color_analysis" },
33
- React.createElement("b", null, "Analysis Colors"),
34
- renderAllVariations()),
35
- React.createElement("div", { className: "color_datalab" },
36
- React.createElement("b", null, "Datalab Colors"),
37
- renderAllVariations()),
38
- React.createElement("div", { className: "color_vantage" },
39
- React.createElement("b", null, "Vantage Colors"),
40
- renderAllVariations())));
41
- };
42
- //# sourceMappingURL=ProgressBar.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ProgressBar.stories.js","sourceRoot":"","sources":["../../src/ProgressBar/ProgressBar.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAElC,eAAe;IACb,KAAK,EAAE,aAAa;CACrB,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,EAAE;IAClC,MAAM,mBAAmB,GAAG,GAAG,EAAE,CAAC,CAChC;QACE,6BAAK,SAAS,EAAC,cAAc;YAC3B,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,WAAW,IAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAC,KAAK,GAAG,CAC5C;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,WAAW,IAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAC,MAAM,GAAG,CAC7C;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,WAAW,IAAC,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAC,KAAK,GAAG,CAC3C;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,WAAW,IAAC,KAAK,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAC,KAAK,EAAC,YAAY,EAAC,qBAAqB,GAAG,CAC/E,CACF;QAEN,6BAAK,SAAS,EAAC,yCAAyC;YACtD,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,WAAW,IAAC,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAC,KAAK,GAAG,CAC1C;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,WAAW,IAAC,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAC,MAAM,GAAG,CAC5C;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,WAAW,IAAC,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,KAAK,EAAC,IAAI,GAAG,CACzC;YACN,6BAAK,SAAS,EAAC,QAAQ;gBACrB,oBAAC,WAAW,IAAC,KAAK,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAC,KAAK,EAAC,YAAY,EAAC,qBAAqB,GAAG,CAC/E,CACF,CACL,CACJ,CAAC;IACF,OAAO,CACL,6BAAK,SAAS,EAAC,iCAAiC;QAC9C,oBAAC,IAAI,OAAG;QACR,6BAAK,SAAS,EAAC,aAAa;YAC1B,8CAAmB;YAClB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,gBAAgB;YAC7B,iDAAsB;YACrB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,eAAe;YAC5B,gDAAqB;YACpB,mBAAmB,EAAE,CAClB;QAEN,6BAAK,SAAS,EAAC,eAAe;YAC5B,gDAAqB;YACpB,mBAAmB,EAAE,CAClB,CACF,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -1,32 +0,0 @@
1
- import React from 'react';
2
- import { render, screen, waitFor } from '@testing-library/react';
3
- import '@testing-library/jest-dom/extend-expect';
4
- import ProgressBar from './ProgressBar';
5
- import userEvent from '@testing-library/user-event';
6
- describe('ProgressBar', () => {
7
- it('renders without crashing', () => {
8
- render(React.createElement(ProgressBar, { value: 50, label: "50%" }));
9
- const progressBar = screen.getByRole('progressbar');
10
- expect(progressBar).toBeInTheDocument();
11
- });
12
- it('displays the correct progress value', () => {
13
- render(React.createElement(ProgressBar, { value: 75, label: "75%" }));
14
- const progressBarIndicator = screen.getByRole('progressbar').firstChild;
15
- waitFor(() => {
16
- expect(progressBarIndicator).toHaveStyle('transform: translateX(-25%)');
17
- });
18
- });
19
- it('applies the correct max value', () => {
20
- render(React.createElement(ProgressBar, { value: 50, max: 200, label: "25%" }));
21
- const progressBar = screen.getByRole('progressbar');
22
- expect(progressBar).toHaveAttribute('data-max', '200');
23
- });
24
- it('displays the tooltip with the correct label', () => {
25
- render(React.createElement(ProgressBar, { value: 50, label: "Progress" }));
26
- userEvent.hover(screen.getByRole('progressbar'));
27
- waitFor(() => {
28
- expect(screen.getByText('Progress')).toBeInTheDocument();
29
- });
30
- });
31
- });
32
- //# sourceMappingURL=ProgressBar.test.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ProgressBar.test.js","sourceRoot":"","sources":["../../src/ProgressBar/ProgressBar.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,yCAAyC,CAAC;AACjD,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,SAAS,MAAM,6BAA6B,CAAC;AAEpD,QAAQ,CAAC,aAAa,EAAE,GAAG,EAAE;IAC3B,EAAE,CAAC,0BAA0B,EAAE,GAAG,EAAE;QAClC,MAAM,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAC,KAAK,GAAG,CAAC,CAAC;QAC/C,MAAM,WAAW,GAAG,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC;QACpD,MAAM,CAAC,WAAW,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAC1C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qCAAqC,EAAE,GAAG,EAAE;QAC7C,MAAM,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAC,KAAK,GAAG,CAAC,CAAC;QAC/C,MAAM,oBAAoB,GAAG,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC;QACxE,OAAO,CAAC,GAAG,EAAE;YACX,MAAM,CAAC,oBAAoB,CAAC,CAAC,WAAW,CAAC,6BAA6B,CAAC,CAAC;QAC1E,CAAC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+BAA+B,EAAE,GAAG,EAAE;QACvC,MAAM,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAC,KAAK,GAAG,CAAC,CAAC;QACzD,MAAM,WAAW,GAAG,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC;QACpD,MAAM,CAAC,WAAW,CAAC,CAAC,eAAe,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;IACzD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,6CAA6C,EAAE,GAAG,EAAE;QACrD,MAAM,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,EAAE,EAAE,KAAK,EAAC,UAAU,GAAG,CAAC,CAAC;QACpD,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC,CAAC;QACjD,OAAO,CAAC,GAAG,EAAE;YACb,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;QACzD,CAAC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=ProgressBar.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ProgressBar.types.js","sourceRoot":"","sources":["../../src/ProgressBar/ProgressBar.types.ts"],"names":[],"mappings":""}
@@ -1,2 +0,0 @@
1
- export { default } from './ProgressBar';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/ProgressBar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC"}
@@ -1,13 +0,0 @@
1
- import React from 'react';
2
- import * as RadixSlider from '@radix-ui/react-slider';
3
- /**
4
- * Slider .
5
- */
6
- export const Slider = (props) => {
7
- const { onValueChange, onPointerUp, id, value, name, disabled = false, extraClassNames = '', testId, step, min, max, } = props;
8
- return (React.createElement(RadixSlider.Root, { className: `tw-relative tw-flex tw-h-5 tw-w-full tw-touch-none tw-select-none tw-items-center ${extraClassNames}`, defaultValue: [value], value: [value], onValueChange: (value) => onValueChange && onValueChange(value), onPointerUp: (e) => onPointerUp && onPointerUp(e), name: name, id: id, max: max, min: min, disabled: disabled, step: step },
9
- React.createElement(RadixSlider.Track, { className: "tw-relative tw-h-[5px] tw-grow tw-rounded-[4px] tw-bg-sq-dark-gray dark:tw-bg-sq-dark-disabled-gray" },
10
- React.createElement(RadixSlider.Range, { className: "tw-absolute tw-h-full tw-rounded-full" })),
11
- React.createElement(RadixSlider.Thumb, { className: "tw-block tw-h-[15px] tw-w-[15px] tw-rounded-full tw-bg-sq-color-dark tw-shadow-[0_1px_3px] active:tw-shadow-[0_1px_6px] focus:outline-none focus-visible:tw-outline-none aria-disabled:tw-bg-sq-dark-gray dark:aria-disabled:tw-bg-sq-dark-disabled-gray tw-transition tw-ease-in-out", "aria-disabled": disabled })));
12
- };
13
- //# sourceMappingURL=Slider.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../src/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,WAAW,MAAM,wBAAwB,CAAC;AAEtD;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAyC,CAAC,KAAK,EAAE,EAAE;IACpE,MAAM,EACJ,aAAa,EACb,WAAW,EACX,EAAE,EACF,KAAK,EACL,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,eAAe,GAAG,EAAE,EACpB,MAAM,EACN,IAAI,EACJ,GAAG,EACH,GAAG,GACJ,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,oBAAC,WAAW,CAAC,IAAI,IACf,SAAS,EAAE,qFAAqF,eAAe,EAAE,EACjH,YAAY,EAAE,CAAC,KAAK,CAAC,EACrB,KAAK,EAAE,CAAC,KAAK,CAAC,EACd,aAAa,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,aAAa,IAAI,aAAa,CAAC,KAAK,CAAC,EAC/D,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,WAAW,IAAI,WAAW,CAAC,CAAC,CAAC,EACjD,IAAI,EAAE,IAAI,EACV,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI;QACV,oBAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAC,qGAAqG;YAChI,oBAAC,WAAW,CAAC,KAAK,IAAC,SAAS,EAAC,uCAAuC,GAAG,CACrD;QACpB,oBAAC,WAAW,CAAC,KAAK,IAChB,SAAS,EAAC,uRAAuR,mBAClR,QAAQ,GACvB,CACe,CACpB,CAAC;AACJ,CAAC,CAAC"}
@@ -1,58 +0,0 @@
1
- import React from 'react';
2
- import { Slider } from './Slider';
3
- import { QTip } from '../Tooltip';
4
- export default {
5
- title: 'Slider',
6
- };
7
- export const AllSliders = () => {
8
- const [value1, setValue1] = React.useState(0);
9
- const [value2, setValue2] = React.useState(0);
10
- const renderAllVariations = () => (React.createElement(React.Fragment, null,
11
- React.createElement("div", { className: "tw-p-4 light" },
12
- React.createElement("div", { className: "tw-p-4" },
13
- React.createElement(Slider, { min: 0, max: 10, value: 4 })),
14
- React.createElement("div", { className: "tw-p-4" },
15
- React.createElement(Slider, { min: 0, max: 10, value: 10 })),
16
- React.createElement("div", { className: "tw-p-4" },
17
- React.createElement(Slider, { value: 0, min: 0, max: 10 })),
18
- React.createElement("div", { className: "tw-p-4" },
19
- React.createElement("div", null, "1 Step"),
20
- React.createElement(Slider, { value: value1, min: 0, max: 20, step: 4, onValueChange: (v) => setValue1(v[0]) })),
21
- React.createElement("div", { className: "tw-p-4" },
22
- React.createElement("div", null, "10 Steps"),
23
- React.createElement(Slider, { value: value2, min: 0, max: 20, step: 10, onValueChange: (v) => setValue2(v[0]) })),
24
- React.createElement("div", { className: "tw-p-4" },
25
- React.createElement("div", { className: "tw-sq-text-color" }, "Disabled"),
26
- React.createElement(Slider, { value: 10, min: 0, max: 20, step: 10, disabled: true }))),
27
- React.createElement("div", { className: "tw-p-4 tw-dark tw-bg-sq-dark-background" },
28
- React.createElement("div", { className: "tw-p-4" },
29
- React.createElement(Slider, { min: 0, max: 10, value: 4 })),
30
- React.createElement("div", { className: "tw-p-4" },
31
- React.createElement(Slider, { min: 0, max: 10, value: 10 })),
32
- React.createElement("div", { className: "tw-p-4" },
33
- React.createElement(Slider, { value: 0, min: 0, max: 10 })),
34
- React.createElement("div", { className: "tw-p-4" },
35
- React.createElement("div", { className: "dark:tw-text-white" }, "1 Step"),
36
- React.createElement(Slider, { value: value1, min: 0, max: 20, step: 4, onValueChange: (v) => setValue1(v[0]) })),
37
- React.createElement("div", { className: "tw-p-4" },
38
- React.createElement("div", { className: "dark:tw-text-white" }, "10 Steps"),
39
- React.createElement(Slider, { value: value2, min: 0, max: 20, step: 10, onValueChange: (v) => setValue2(v[0]) })),
40
- React.createElement("div", { className: "tw-p-4" },
41
- React.createElement("div", { className: "dark:tw-text-white" }, "Disabled"),
42
- React.createElement(Slider, { value: 10, min: 0, max: 20, step: 10, disabled: true })))));
43
- return (React.createElement("div", { className: "tw-grid tw-grid-cols-4 tw-gap-4" },
44
- React.createElement(QTip, null),
45
- React.createElement("div", { className: "color_topic" },
46
- React.createElement("b", null, "Topic Colors"),
47
- renderAllVariations()),
48
- React.createElement("div", { className: "color_analysis" },
49
- React.createElement("b", null, "Analysis Colors"),
50
- renderAllVariations()),
51
- React.createElement("div", { className: "color_datalab" },
52
- React.createElement("b", null, "Datalab Colors"),
53
- renderAllVariations()),
54
- React.createElement("div", { className: "color_vantage" },
55
- React.createElement("b", null, "Vantage Colors"),
56
- renderAllVariations())));
57
- };
58
- //# sourceMappingURL=Slider.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Slider.stories.js","sourceRoot":"","sources":["../../src/Slider/Slider.stories.tsx"],"names":[],"mappings":"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"}
@@ -1,38 +0,0 @@
1
- import React from 'react';
2
- import { render } from '@testing-library/react';
3
- import '@testing-library/jest-dom/extend-expect';
4
- import { Slider } from './Slider';
5
- describe('Slider Component', () => {
6
- const defaultProps = {
7
- onValueChange: jest.fn(),
8
- onPointerUp: jest.fn(),
9
- id: 'test-slider',
10
- value: 50,
11
- name: 'slider',
12
- disabled: false,
13
- extraClassNames: '',
14
- testId: 'slider',
15
- step: 1,
16
- min: 0,
17
- max: 100,
18
- };
19
- beforeEach(() => {
20
- global.ResizeObserver = jest.fn().mockImplementation(() => {
21
- return { observe: jest.fn(), disconnect: jest.fn(), unobserve: jest.fn() };
22
- });
23
- });
24
- it('renders without crashing', () => {
25
- const { getByRole } = render(React.createElement(Slider, { ...defaultProps }));
26
- expect(getByRole('slider')).toBeInTheDocument();
27
- });
28
- it('is disabled when disabled prop is true', () => {
29
- const { getByRole } = render(React.createElement(Slider, { ...defaultProps, disabled: true }));
30
- const thumb = getByRole('slider');
31
- expect(thumb).toHaveAttribute('data-disabled', '');
32
- });
33
- it('applies extra class names', () => {
34
- const { container } = render(React.createElement(Slider, { ...defaultProps, extraClassNames: "extra-class" }));
35
- expect(container.firstChild).toHaveClass('extra-class');
36
- });
37
- });
38
- //# sourceMappingURL=Slider.test.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Slider.test.js","sourceRoot":"","sources":["../../src/Slider/Slider.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,yCAAyC,CAAC;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAGlC,QAAQ,CAAC,kBAAkB,EAAE,GAAG,EAAE;IAChC,MAAM,YAAY,GAAgB;QAChC,aAAa,EAAE,IAAI,CAAC,EAAE,EAAE;QACxB,WAAW,EAAE,IAAI,CAAC,EAAE,EAAE;QACtB,EAAE,EAAE,aAAa;QACjB,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,QAAQ;QACd,QAAQ,EAAE,KAAK;QACf,eAAe,EAAE,EAAE;QACnB,MAAM,EAAE,QAAQ;QAChB,IAAI,EAAE,CAAC;QACP,GAAG,EAAE,CAAC;QACN,GAAG,EAAE,GAAG;KACT,CAAC;IAEF,UAAU,CAAC,GAAG,EAAE;QACd,MAAM,CAAC,cAAc,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC,kBAAkB,CAAC,GAAG,EAAE;YACxD,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE,EAAE,CAAC;QAC7E,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,0BAA0B,EAAE,GAAG,EAAE;QAClC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,oBAAC,MAAM,OAAK,YAAY,GAAI,CAAC,CAAC;QAC3D,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;IAClD,CAAC,CAAC,CAAC;IAGH,EAAE,CAAC,wCAAwC,EAAE,GAAG,EAAE;QAChD,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,oBAAC,MAAM,OAAK,YAAY,EAAE,QAAQ,EAAE,IAAI,GAAI,CAAC,CAAC;QAC3E,MAAM,KAAK,GAAG,SAAS,CAAC,QAAQ,CAAC,CAAC;QAClC,MAAM,CAAC,KAAK,CAAC,CAAC,eAAe,CAAC,eAAe,EAAE,EAAE,CAAC,CAAC;IACrD,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;QACnC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,oBAAC,MAAM,OAAK,YAAY,EAAE,eAAe,EAAC,aAAa,GAAG,CAAC,CAAC;QACzF,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;IAC1D,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
@@ -1,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=Slider.types.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Slider.types.js","sourceRoot":"","sources":["../../src/Slider/Slider.types.ts"],"names":[],"mappings":""}
@@ -1,2 +0,0 @@
1
- export { Slider as default } from './Slider';
2
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Slider/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,OAAO,EAAE,MAAM,UAAU,CAAC"}