@agility/plenum-ui 2.1.1 → 2.1.3

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 (17) hide show
  1. package/dist/index.js +1 -1
  2. package/dist/index.js.map +2 -2
  3. package/package.json +1 -1
  4. package/stories/atoms/Avatar/Avatar.tsx +1 -1
  5. package/stories/atoms/badges/Badge.tsx +1 -1
  6. package/stories/atoms/buttons/Button/Button.tsx +2 -2
  7. package/stories/atoms/buttons/Capsule/Capsule.tsx +1 -1
  8. package/stories/molecules/inputs/InputCounter/InputCounter.tsx +1 -1
  9. package/stories/molecules/inputs/InputLabel/InputLabel.tsx +2 -2
  10. package/stories/molecules/inputs/NestedInputButton/NestedInputButton.tsx +1 -1
  11. package/stories/molecules/inputs/combobox/ComboBox.tsx +2 -2
  12. package/stories/organisms/DropdownComponent/DropdownComponent.tsx +1 -1
  13. package/stories/organisms/EmptySectionPlaceholder/EmptySectionPlaceholder.stories.tsx +1 -1
  14. package/stories/organisms/EmptySectionPlaceholder/EmptySectionPlaceholder.tsx +1 -1
  15. package/stories/organisms/FormInputWithAddons/FormInputWithAddons.tsx +1 -1
  16. package/stories/organisms/TextInputSelect/InputSelect.tsx +1 -1
  17. package/stories/organisms/TextInputSelect/TextInputSelect.tsx +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@agility/plenum-ui",
3
- "version": "2.1.1",
3
+ "version": "2.1.3",
4
4
  "license": "MIT",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
package/stories/atoms/Avatar/Avatar.tsx CHANGED
@@ -44,7 +44,7 @@ const Avatar: FC<IAvatarProps> = ({ src, status, size = "md", alt = "Avatar imag
44
44
  "h-14 w-14": size === "lg",
45
45
  "h-16 w-16": size === "xl"
46
46
  })
47
- const fontStyles = cn("font-medium leading-none text-white uppercase", {
47
+ const fontStyles = cn(" leading-none text-white uppercase", {
48
48
  "text-xs": size === "xxs" || size === "xs",
49
49
  "text-sm": size === "sm",
50
50
  "text-base": size === "md",
package/stories/atoms/badges/Badge.tsx CHANGED
@@ -31,7 +31,7 @@ const Badge: React.FC<IBadgeProps> = ({
31
31
  actionButton
32
32
  }) => {
33
33
  const badgeStyles = cn(
34
- "text-sm flex items-center font-medium py-[2px] focus:ring-1 focus:ring-purple-600 focus:ring-offset-2 focus:ring-offset-white outline-0",
34
+ "text-sm flex items-center py-[2px] focus:ring-1 focus:ring-purple-600 focus:ring-offset-2 focus:ring-offset-white outline-0",
35
35
  {
36
36
  "rounded-[3px]": variant === "rounded",
37
37
  "rounded-full px-[6px]": variant === "pill",
package/stories/atoms/buttons/Button/Button.tsx CHANGED
@@ -77,7 +77,7 @@ const _Button = (
77
77
  target: asLink.target,
78
78
  title: asLink.title,
79
79
  className: cn(
80
- "inline-flex items-center justify-center gap-x-2 font-medium rounded-[3px] !ring-offset-white outline-none focus-visible:ring-2 focus-visible:ring-purple-600 focus-visible:ring-offset-2 focus-within:ring-2 focus-within:ring-purple-600 focus-within:ring-offset-2 focus:ring-2 focus:ring-purple-600 focus:ring-offset-2 active:ring-2 active:ring-purple-600 active:ring-offset-2 transition-all",
80
+ "inline-flex items-center justify-center gap-x-2 font rounded-[3px] !ring-offset-white outline-none focus-visible:ring-2 focus-visible:ring-purple-600 focus-visible:ring-offset-2 focus-within:ring-2 focus-within:ring-purple-600 focus-within:ring-offset-2 focus:ring-2 focus:ring-purple-600 focus:ring-offset-2 active:ring-2 active:ring-purple-600 active:ring-offset-2 transition-all",
81
81
  { "w-full": fullWidth },
82
82
  { "px-[11px] py-[7px] text-xs": size === "xs" },
83
83
  { "px-[13px] py-[9px] text-sm": size === "sm" },
@@ -157,7 +157,7 @@ const _Button = (
157
157
  <button
158
158
  type="button"
159
159
  className={cn(
160
- "inline-flex items-center justify-center gap-x-2 font-medium rounded-[3px] !ring-offset-white outline-none focus-visible:ring-2 focus-visible:ring-purple-600 focus-visible:ring-offset-2 focus-within:ring-2 focus-within:ring-purple-600 focus-within:ring-offset-2 focus:ring-2 focus:ring-purple-600 focus:ring-offset-2 active:ring-2 active:ring-purple-600 active:ring-offset-2 transition-all",
160
+ "inline-flex items-center justify-center gap-x-2 rounded-[3px] !ring-offset-white outline-none focus-visible:ring-2 focus-visible:ring-purple-600 focus-visible:ring-offset-2 focus-within:ring-2 focus-within:ring-purple-600 focus-within:ring-offset-2 focus:ring-2 focus:ring-purple-600 focus:ring-offset-2 active:ring-2 active:ring-purple-600 active:ring-offset-2 transition-all",
161
161
  { "w-full": fullWidth },
162
162
  { "px-[11px] py-[7px] text-xs": size === "xs" },
163
163
  { "px-[13px] py-[9px] text-sm": size === "sm" },
package/stories/atoms/buttons/Capsule/Capsule.tsx CHANGED
@@ -54,7 +54,7 @@ const Capsule = ({
54
54
  <button
55
55
  type="button"
56
56
  className={cn(
57
- "inline-flex items-center justify-center gap-x-2 text-sm font-medium p-2 !ring-offset-white outline-none focus-visible:ring-2 focus-visible:ring-purple-600 focus-visible:ring-offset-2 focus-within:ring-2 focus-within:ring-purple-600 focus-within:ring-offset-2 focus:ring-2 focus:ring-purple-600 focus:ring-offset-2 active:ring-2 active:ring-purple-600 active:ring-offset-2 transition-all",
57
+ "inline-flex items-center justify-center gap-x-2 text-sm p-2 !ring-offset-white outline-none focus-visible:ring-2 focus-visible:ring-purple-600 focus-visible:ring-offset-2 focus-within:ring-2 focus-within:ring-purple-600 focus-within:ring-offset-2 focus:ring-2 focus:ring-purple-600 focus:ring-offset-2 active:ring-2 active:ring-purple-600 active:ring-offset-2 transition-all",
58
58
  { "w-full": fullWidth },
59
59
  { "px-[11px] py-[7px] text-xs rounded-[15px]": size === "xs" },
60
60
  { "px-[15px] py-[9px] text-sm rounded-[17px]": size === "sm" },
package/stories/molecules/inputs/InputCounter/InputCounter.tsx CHANGED
@@ -10,7 +10,7 @@ export interface IInputCounterProps {
10
10
  /** Primary UI component for user interaction */
11
11
  const InputCounter: FC<IInputCounterProps> = ({ current = 0, limit }) => {
12
12
  return (
13
- <div className="mt-3 text-center text-xs leading-4 font-medium text-gray-500 flex gap-1">
13
+ <div className="mt-3 text-center text-xs leading-4 text-gray-500 flex gap-1">
14
14
  <div className="currentCount">{current ?? 0}</div>
15
15
  {(limit || 0) > 0 && (
16
16
  <>
package/stories/molecules/inputs/InputLabel/InputLabel.tsx CHANGED
@@ -25,13 +25,13 @@ const InputLabel: FC<IInputLabelProps> = ({
25
25
  }: IInputLabelProps) => {
26
26
  const labelStyles = cn(
27
27
  "z-[2] ",
28
- { "inline-block font-medium ml-2 relative transition-all": isPlaceholder },
28
+ { "inline-block ml-2 relative transition-all": isPlaceholder },
29
29
  { "text-sm text-gray-400 px-2 top-8": isPlaceholder && !isActive },
30
30
  { "text-xs text-gray-700 px-1 top-[10px] bg-white": isPlaceholder && isActive },
31
31
  { "text-xs text-red-500 px-1 top-[10px] bg-white": isPlaceholder && isError },
32
32
  { "text-red-500 bg-white": !isPlaceholder && isError },
33
33
  { "text-gray-500/[.5]": isDisabled },
34
- { "inline-block font-medium transition-all text-sm text-gray-700 mb-1": !isPlaceholder }
34
+ { "inline-block transition-all text-sm text-gray-700 mb-1": !isPlaceholder }
35
35
  )
36
36
  if (!label) return null
37
37
  return (
package/stories/molecules/inputs/NestedInputButton/NestedInputButton.tsx CHANGED
@@ -23,7 +23,7 @@ const NestedInputButton: React.FC<INestedInputButtonProps> = ({
23
23
  const { ...buttonProps } = props
24
24
  const { onClick } = buttonProps
25
25
  const buttonStyle = cn(
26
- "relative flex items-center space-x-2 px-4 py-2 leading-5 border border-gray-300 text-sm font-medium focus:outline-none focus:ring-1 focus:ring-purple-500 focus:border-purple-500",
26
+ "relative flex items-center space-x-2 px-4 py-2 leading-5 border border-gray-300 text-sm focus:outline-none focus:ring-1 focus:ring-purple-500 focus:border-purple-500",
27
27
  {
28
28
  "rounded-r text-gray-500 -ml-px": align === "right"
29
29
  },
package/stories/molecules/inputs/combobox/ComboBox.tsx CHANGED
@@ -87,7 +87,7 @@ const Combobox = <T extends Record<string, unknown>>({
87
87
  : items.filter((item) => {
88
88
  return `${item[displayProperty]}`.toLowerCase().includes(query.toLowerCase())
89
89
  })
90
- const labelStyles = cn("block text-sm font-medium text-gray-700")
90
+ const labelStyles = cn("block text-sm text-gray-700")
91
91
  const buttonStyles = cn("absolute inset-y-0 right-0 flex items-center rounded-r px-2 focus:outline-none")
92
92
  const optionStyles = cn(
93
93
  "absolute z-30 mt-1 max-h-60 w-full overflow-auto rounded bg-white py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm"
@@ -151,7 +151,7 @@ const Combobox = <T extends Record<string, unknown>>({
151
151
  >
152
152
  {({ active, selected }) => (
153
153
  <>
154
- <span className={classNames("block truncate", selected ? "font-semibold" : "")}>
154
+ <span className={classNames("block truncate", selected ? "font-medium" : "")}>
155
155
  {`${item[displayProperty]}`}
156
156
  </span>
157
157
 
package/stories/organisms/DropdownComponent/DropdownComponent.tsx CHANGED
@@ -59,7 +59,7 @@ export const defaultClassNames = {
59
59
  groupClassname: "flex inline-block text-left",
60
60
  itemsClassname: "mt-2 origin-bottom-right rounded bg-white shadow-lg z-[99999] border border-gray-300 ",
61
61
  itemClassname:
62
- "group flex font-muli cursor-pointer items-center px-4 py-2 text-sm transition-all hover:bg-gray-100 hover:text-gray-900 justify-between gap-4 ",
62
+ "group flex font-sans cursor-pointer items-center px-4 py-2 text-sm transition-all hover:bg-gray-100 hover:text-gray-900 justify-between gap-4 ",
63
63
  activeItemClassname: "block px-4 py-2 text-sm text-gray-700 bg-gray-100 hover:bg-gray-200 hover:text-gray-900",
64
64
  buttonClassname:
65
65
  "py-[2px] flex items-center rounded outline-purple-500 transition-all text-gray-400 hover:text-gray-600 ",
package/stories/organisms/EmptySectionPlaceholder/EmptySectionPlaceholder.stories.tsx CHANGED
@@ -15,7 +15,7 @@ type Story = StoryObj<typeof EmptySectionPlaceholder>
15
15
  const MissingAttachmentCTA = () => {
16
16
  const fileInputRef = useRef<HTMLInputElement>(null)
17
17
  return (
18
- <div className="mb-2 block text-sm font-medium text-gray-600">
18
+ <div className="mb-2 block text-sm text-gray-600">
19
19
  <input type="file" className="hidden" ref={fileInputRef} />
20
20
  <button
21
21
  className="hover:underline hover:text-gray-700 transition-all"
package/stories/organisms/EmptySectionPlaceholder/EmptySectionPlaceholder.tsx CHANGED
@@ -34,7 +34,7 @@ const EmptySectionPlaceholder: React.FC<IEmptySectionPlaceholderProps> = ({
34
34
  {CallToActionComponent ? (
35
35
  CallToActionComponent
36
36
  ) : (
37
- <p className="mb-2 block text-sm font-medium text-gray-600">{primaryMessage}</p>
37
+ <p className="mb-2 block text-sm text-gray-600">{primaryMessage}</p>
38
38
  )}
39
39
  {actions.length > 0 ? (
40
40
  <div className={cn("mt-2 flex gap-2", isWide ? "" : "flex-col items-center")}>
package/stories/organisms/FormInputWithAddons/FormInputWithAddons.tsx CHANGED
@@ -62,7 +62,7 @@ const FormInputWithAddons: React.FC<IFormInputWithAddonsProps> = ({
62
62
  return (
63
63
  <div className={cn("group flex flex-col", containerClassName)}>
64
64
  {!leadLabel && !trailLabel && topLabel && (
65
- <label htmlFor={id} className={cn("flex items-center text-sm font-medium text-gray-600", labelClass)}>
65
+ <label htmlFor={id} className={cn("flex items-center text-sm text-gray-600", labelClass)}>
66
66
  {topLabel}
67
67
  </label>
68
68
  )}
package/stories/organisms/TextInputSelect/InputSelect.tsx CHANGED
@@ -35,7 +35,7 @@ export const InputSelect: FC<InputSelectProps> = ({
35
35
  return (
36
36
  <select
37
37
  className={cn(
38
- "relative z-10 inline-flex items-center space-x-2 border border-gray-300 bg-white px-4 py-2 pr-7 text-sm font-medium",
38
+ "relative z-10 inline-flex items-center space-x-2 border border-gray-300 bg-white px-4 py-2 pr-7 text-sm ",
39
39
  "focus:border-purple-500 focus:outline-none focus:ring-1 focus:ring-purple-500",
40
40
  align === "right"
41
41
  ? "-ml-px rounded-r border-l-white text-gray-700"
package/stories/organisms/TextInputSelect/TextInputSelect.tsx CHANGED
@@ -110,7 +110,7 @@ const TextInputSelect: FC<ITextInputSelectProps> = ({
110
110
  setIsFocus(false)
111
111
  // add other focus effects here
112
112
  }
113
- const labelStyles = cn("block inline-block font-medium transition-all text-sm text-gray-700 mb-1", {
113
+ const labelStyles = cn("block inline-block transition-all text-sm text-gray-700 mb-1", {
114
114
  "text-red-500 bg-white": isError
115
115
  })
116
116