@rovula/ui 0.0.30 → 0.0.32

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 (75) hide show
  1. package/dist/cjs/bundle.css +1173 -243
  2. package/dist/cjs/bundle.js +2 -2
  3. package/dist/cjs/bundle.js.map +1 -1
  4. package/dist/cjs/types/components/Dropdown/Dropdown.d.ts +12 -2
  5. package/dist/cjs/types/components/Dropdown/Dropdown.stories.d.ts +12 -2
  6. package/dist/cjs/types/components/InputFilter/InputFilter.d.ts +63 -4
  7. package/dist/cjs/types/components/InputFilter/InputFilter.stories.d.ts +54 -18
  8. package/dist/cjs/types/components/InputFilter/InputFilter.styles.d.ts +1 -0
  9. package/dist/cjs/types/components/Search/Search.stories.d.ts +7 -1
  10. package/dist/cjs/types/stories/ColorPreview.d.ts +9 -5
  11. package/dist/cjs/types/utils/colors.d.ts +1 -0
  12. package/dist/components/ActionButton/ActionButton.stories.js +1 -1
  13. package/dist/components/Checkbox/Checkbox.js +3 -3
  14. package/dist/components/Checkbox/Checkbox.stories.js +1 -1
  15. package/dist/components/Dropdown/Dropdown.js +12 -8
  16. package/dist/components/Dropdown/Dropdown.styles.js +1 -1
  17. package/dist/components/InputFilter/InputFilter.js +118 -12
  18. package/dist/components/InputFilter/InputFilter.stories.js +5 -4
  19. package/dist/components/InputFilter/InputFilter.styles.js +9 -4
  20. package/dist/components/RadioGroup/RadioGroup.js +5 -2
  21. package/dist/components/RadioGroup/RadioGroup.stories.js +1 -1
  22. package/dist/components/Search/Search.stories.js +2 -1
  23. package/dist/components/Text/Text.stories.js +5 -1
  24. package/dist/components/TextInput/TextInput.js +2 -1
  25. package/dist/components/TextInput/TextInput.styles.js +10 -9
  26. package/dist/esm/bundle.css +1173 -243
  27. package/dist/esm/bundle.js +2 -2
  28. package/dist/esm/bundle.js.map +1 -1
  29. package/dist/esm/types/components/Dropdown/Dropdown.d.ts +12 -2
  30. package/dist/esm/types/components/Dropdown/Dropdown.stories.d.ts +12 -2
  31. package/dist/esm/types/components/InputFilter/InputFilter.d.ts +63 -4
  32. package/dist/esm/types/components/InputFilter/InputFilter.stories.d.ts +54 -18
  33. package/dist/esm/types/components/InputFilter/InputFilter.styles.d.ts +1 -0
  34. package/dist/esm/types/components/Search/Search.stories.d.ts +7 -1
  35. package/dist/esm/types/stories/ColorPreview.d.ts +9 -5
  36. package/dist/esm/types/utils/colors.d.ts +1 -0
  37. package/dist/index.d.ts +83 -14
  38. package/dist/src/theme/global.css +1526 -348
  39. package/dist/stories/ColorGroupPreview.js +282 -472
  40. package/dist/stories/ColorPreview.js +76 -6
  41. package/dist/theme/main-preset.js +8 -0
  42. package/dist/theme/plugins/utilities/typography.js +3 -0
  43. package/dist/theme/presets/colors.js +18 -0
  44. package/dist/theme/themes/xspector/color.css +13 -0
  45. package/dist/theme/themes/xspector/components/action-button.css +44 -42
  46. package/dist/theme/themes/xspector/state.css +1 -1
  47. package/dist/theme/tokens/color.css +13 -0
  48. package/dist/theme/tokens/components/action-button.css +42 -55
  49. package/dist/utils/colors.js +31 -0
  50. package/package.json +1 -1
  51. package/src/components/ActionButton/ActionButton.stories.tsx +1 -1
  52. package/src/components/Checkbox/Checkbox.stories.tsx +1 -1
  53. package/src/components/Checkbox/Checkbox.tsx +4 -4
  54. package/src/components/Dropdown/Dropdown.styles.ts +1 -1
  55. package/src/components/Dropdown/Dropdown.tsx +22 -8
  56. package/src/components/InputFilter/InputFilter.stories.tsx +9 -8
  57. package/src/components/InputFilter/InputFilter.styles.ts +9 -4
  58. package/src/components/InputFilter/InputFilter.tsx +301 -42
  59. package/src/components/RadioGroup/RadioGroup.stories.tsx +1 -1
  60. package/src/components/RadioGroup/RadioGroup.tsx +7 -9
  61. package/src/components/Search/Search.stories.tsx +2 -1
  62. package/src/components/Text/Text.stories.tsx +5 -1
  63. package/src/components/TextInput/TextInput.styles.ts +10 -9
  64. package/src/components/TextInput/TextInput.tsx +11 -10
  65. package/src/stories/ColorGroupPreview.tsx +394 -486
  66. package/src/stories/ColorPreview.tsx +122 -33
  67. package/src/theme/main-preset.js +8 -0
  68. package/src/theme/plugins/utilities/typography.js +3 -0
  69. package/src/theme/presets/colors.js +18 -0
  70. package/src/theme/themes/xspector/color.css +13 -0
  71. package/src/theme/themes/xspector/components/action-button.css +44 -42
  72. package/src/theme/themes/xspector/state.css +1 -1
  73. package/src/theme/tokens/color.css +13 -0
  74. package/src/theme/tokens/components/action-button.css +42 -55
  75. package/src/utils/colors.ts +33 -0
package/dist/components/RadioGroup/RadioGroup.stories.js CHANGED
@@ -9,7 +9,7 @@ const meta = {
9
9
  layout: "fullscreen",
10
10
  },
11
11
  decorators: [
12
- (Story) => (_jsx("div", { className: "p-5 flex w-full", children: _jsx(Story, {}) })),
12
+ (Story) => (_jsx("div", { className: "p-5 flex w-full bg-base-bg2", children: _jsx(Story, {}) })),
13
13
  ],
14
14
  };
15
15
  export default meta;
package/dist/components/Search/Search.stories.js CHANGED
@@ -8,7 +8,7 @@ const meta = {
8
8
  layout: "fullscreen",
9
9
  },
10
10
  decorators: [
11
- (Story) => (_jsx("div", { className: "p-5 flex w-full", children: _jsx(Story, {}) })),
11
+ (Story) => (_jsx("div", { className: "p-5 flex w-full bg-base-bg2", children: _jsx(Story, {}) })),
12
12
  ],
13
13
  };
14
14
  export default meta;
@@ -20,6 +20,7 @@ export const Default = {
20
20
  args: {
21
21
  label: "Choose an option:",
22
22
  fullwidth: true,
23
+ size: "md",
23
24
  options,
24
25
  },
25
26
  render: (args) => {
package/dist/components/Text/Text.stories.js CHANGED
@@ -10,7 +10,7 @@ const meta = {
10
10
  layout: "fullscreen",
11
11
  },
12
12
  decorators: [
13
- (Story) => (_jsx("div", { className: "p-5 flex w-full", children: _jsx(Story, {}) })),
13
+ (Story) => (_jsx("div", { className: "p-5 flex w-full bg-base-bg2", children: _jsx(Story, {}) })),
14
14
  ],
15
15
  };
16
16
  export default meta;
@@ -36,6 +36,10 @@ const variant = [
36
36
  "small3",
37
37
  "small4",
38
38
  "small5",
39
+ "small6",
40
+ "small7",
41
+ "small8",
42
+ "small9",
39
43
  "label1",
40
44
  "label2",
41
45
  "buttonL",
package/dist/components/TextInput/TextInput.js CHANGED
@@ -70,7 +70,8 @@ export const TextInput = forwardRef((_a, ref) => {
70
70
  }, [disabled, onClickEndIcon]);
71
71
  return (_jsxs("div", { className: `inline-flex flex-col ${fullwidth ? "w-full" : ""}`, children: [_jsxs("div", { className: "relative", children: [hasSearchIcon && (_jsx("div", { className: iconSearchWrapperClassname, children: _jsx(MagnifyingGlassIcon, { className: iconClassname }) })), _jsx("input", Object.assign({}, props, { placeholder: " ", ref: inputRef, type: type, id: _id, disabled: disabled, className: cn(inputClassname, props.className) })), hasClearIcon && !hasRightSectionIcon && (_jsx("div", { className: iconWrapperClassname, style: {
72
72
  display: keepCloseIconOnValue && props.value ? "flex" : undefined,
73
- }, children: _jsx(XCircleIcon, { type: "button", className: iconClassname, onMouseDown: handleClearInput }) })), hasRightSectionIcon && renderEndIcon ? (renderEndIcon()) : (_jsx("div", { className: endIconWrapperClassname, onClick: handleOnClickRightSectionIcon, children: endIcon })), _jsxs("label", { htmlFor: _id, className: cn(labelClassname, labelClassName), children: [label, " ", required && (_jsx("span", { className: cn("text-error", {
73
+ }, children: _jsx(XCircleIcon, { type: "button", className: iconClassname, onMouseDown: handleClearInput }) })), hasRightSectionIcon &&
74
+ (renderEndIcon ? (renderEndIcon()) : (_jsx("div", { className: endIconWrapperClassname, onClick: handleOnClickRightSectionIcon, children: endIcon }))), _jsxs("label", { htmlFor: _id, className: cn(labelClassname, labelClassName), children: [label, " ", required && (_jsx("span", { className: cn("text-error", {
74
75
  "text-input-disable-text": disabled,
75
76
  }), children: "*" }))] })] }), (errorMessage || helperText) && (_jsxs("span", { className: helperTextClassname, children: [_jsx("span", { className: "h-full", children: _jsx(ExclamationCircleIcon, { width: 16, height: 16, className: error ? "fill-error" : "" }) }), errorMessage || helperText] }))] }));
76
77
  });
package/dist/components/TextInput/TextInput.styles.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import { cva } from "class-variance-authority";
2
2
  export const inputVariant = cva([
3
+ "truncate",
3
4
  "border-0 outline-none",
4
5
  "p-1 flex w-auto box-border",
5
6
  "peer text-input-filled-text placeholder:text-transparent bg-transparent caret-primary",
@@ -72,47 +73,47 @@ export const inputVariant = cva([
72
73
  {
73
74
  hasSearchIcon: true,
74
75
  size: "sm",
75
- class: "ps-6",
76
+ class: "!ps-6",
76
77
  },
77
78
  {
78
79
  hasSearchIcon: true,
79
80
  size: "md",
80
- class: "ps-9",
81
+ class: "!ps-9",
81
82
  },
82
83
  {
83
84
  hasSearchIcon: true,
84
85
  size: "lg",
85
- class: "ps-11",
86
+ class: "!ps-11",
86
87
  },
87
88
  {
88
89
  leftSectionIcon: true,
89
90
  size: "sm",
90
- class: "ps-[38px]",
91
+ class: "!ps-[38px]",
91
92
  },
92
93
  {
93
94
  leftSectionIcon: true,
94
95
  size: "md",
95
- class: "ps-[46px]",
96
+ class: "!ps-[46px]",
96
97
  },
97
98
  {
98
99
  leftSectionIcon: true,
99
100
  size: "lg",
100
- class: "ps-[72px]",
101
+ class: "!ps-[72px]",
101
102
  },
102
103
  {
103
104
  rightSectionIcon: true,
104
105
  size: "sm",
105
- class: "pe-[38px]",
106
+ class: "!pe-[38px]",
106
107
  },
107
108
  {
108
109
  rightSectionIcon: true,
109
110
  size: "md",
110
- class: "pe-[46px]",
111
+ class: "!pe-[46px]",
111
112
  },
112
113
  {
113
114
  rightSectionIcon: true,
114
115
  size: "lg",
115
- class: "pe-[72px]",
116
+ class: "!pe-[72px]",
116
117
  },
117
118
  ],
118
119
  defaultVariants: {