sbwb-ds 3.30.0 → 3.31.0

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 (21) hide show
  1. package/dist/sbwb-ds.js +9143 -9131
  2. package/dist/sbwb-ds.umd.cjs +215 -215
  3. package/dist/src/main/assets/icons/index.d.ts +2 -0
  4. package/dist/src/main/helpers/functions/icons.d.ts +60 -0
  5. package/dist/src/presentation/components/molecules/TabBar/styles.d.ts +1 -0
  6. package/package.json +2 -2
  7. package/src/main/assets/icons/ant/person-off-fill.svg +3 -0
  8. package/src/main/assets/icons/ant/person-off.svg +3 -0
  9. package/src/main/assets/icons/extraLarge/person-off-fill.svg +3 -0
  10. package/src/main/assets/icons/extraLarge/person-off.svg +3 -0
  11. package/src/main/assets/icons/index.ts +2 -0
  12. package/src/main/assets/icons/large/person-off-fill.svg +3 -0
  13. package/src/main/assets/icons/large/person-off.svg +3 -0
  14. package/src/main/assets/icons/medium/person-off-fill.svg +3 -0
  15. package/src/main/assets/icons/medium/person-off.svg +3 -0
  16. package/src/main/assets/icons/small/person-off-fill.svg +3 -0
  17. package/src/main/assets/icons/small/person-off.svg +3 -0
  18. package/src/main/helpers/functions/icons.ts +22 -0
  19. package/src/presentation/components/molecules/TabBar/TabBar.stories.tsx +38 -0
  20. package/src/presentation/components/molecules/TabBar/index.tsx +1 -0
  21. package/src/presentation/components/molecules/TabBar/styles.ts +6 -3
package/dist/src/main/assets/icons/index.d.ts CHANGED
@@ -213,3 +213,5 @@ export { default as PanelLeftClose } from './ant/panel-left-close.svg';
213
213
  export { default as PanelLeftCloseFill } from './ant/panel-left-close-fill.svg';
214
214
  export { default as Notifications } from './ant/notifications-off.svg';
215
215
  export { default as NotificationsFill } from './ant/notifications-off-fill.svg';
216
+ export { default as PersonOff } from './ant/person-off.svg';
217
+ export { default as PersonOffFill } from './ant/person-off-fill.svg';
package/dist/src/main/helpers/functions/icons.d.ts CHANGED
@@ -7344,4 +7344,64 @@ export declare const Icons: {
7344
7344
  desc?: string;
7345
7345
  descId?: string;
7346
7346
  }>;
7347
+ PersonOffAnt: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7348
+ title?: string;
7349
+ titleId?: string;
7350
+ desc?: string;
7351
+ descId?: string;
7352
+ }>;
7353
+ PersonOffEl: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7354
+ title?: string;
7355
+ titleId?: string;
7356
+ desc?: string;
7357
+ descId?: string;
7358
+ }>;
7359
+ PersonOffLg: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7360
+ title?: string;
7361
+ titleId?: string;
7362
+ desc?: string;
7363
+ descId?: string;
7364
+ }>;
7365
+ PersonOffMd: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7366
+ title?: string;
7367
+ titleId?: string;
7368
+ desc?: string;
7369
+ descId?: string;
7370
+ }>;
7371
+ PersonOffSm: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7372
+ title?: string;
7373
+ titleId?: string;
7374
+ desc?: string;
7375
+ descId?: string;
7376
+ }>;
7377
+ PersonOffFillAnt: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7378
+ title?: string;
7379
+ titleId?: string;
7380
+ desc?: string;
7381
+ descId?: string;
7382
+ }>;
7383
+ PersonOffFillEl: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7384
+ title?: string;
7385
+ titleId?: string;
7386
+ desc?: string;
7387
+ descId?: string;
7388
+ }>;
7389
+ PersonOffFillLg: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7390
+ title?: string;
7391
+ titleId?: string;
7392
+ desc?: string;
7393
+ descId?: string;
7394
+ }>;
7395
+ PersonOffFillMd: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7396
+ title?: string;
7397
+ titleId?: string;
7398
+ desc?: string;
7399
+ descId?: string;
7400
+ }>;
7401
+ PersonOffFillSm: import("react").FunctionComponent<import("react").SVGProps<SVGSVGElement> & {
7402
+ title?: string;
7403
+ titleId?: string;
7404
+ desc?: string;
7405
+ descId?: string;
7406
+ }>;
7347
7407
  };
package/dist/src/presentation/components/molecules/TabBar/styles.d.ts CHANGED
@@ -15,6 +15,7 @@ interface TabHeaderProps {
15
15
  isLast?: boolean;
16
16
  isFirst?: boolean;
17
17
  isEdit?: boolean;
18
+ hasCustomIconColor?: boolean;
18
19
  }
19
20
  export declare const TabHeader: import("styled-components").StyledComponent<"div", any, TabHeaderProps, never>;
20
21
  interface EmptySpaceProps {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sbwb-ds",
3
- "version": "3.30.0",
3
+ "version": "3.31.0",
4
4
  "type": "module",
5
5
  "description": "Sistema de design para padronização dos processos visuais do portal SUBWEB",
6
6
  "main": "dist/sbwb-ds.js",
@@ -42,7 +42,7 @@
42
42
  "react-mosaic-component": "^6.1.0",
43
43
  "react-router-dom": "^6.9.0",
44
44
  "react-syntax-highlighter": "^15.5.0",
45
- "sbwb-icons": "^1.17.0",
45
+ "sbwb-icons": "^1.18.0",
46
46
  "svgo": "^2.6.4",
47
47
  "ts-node": "^10.9.1",
48
48
  "vite-plugin-svgr": "^4.3.0"
package/src/main/assets/icons/ant/person-off-fill.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M16 18.125L13.875 16H4V14.0833C4 13.7222 4.08681 13.3924 4.26042 13.0938C4.43403 12.7951 4.67361 12.5556 4.97917 12.375C5.57639 12.0139 6.20833 11.7222 6.875 11.5C7.54167 11.2778 8.22917 11.1319 8.9375 11.0625L1.875 4L2.9375 2.9375L17.0625 17.0625L16 18.125ZM15.0417 12.375C15.3194 12.5278 15.5417 12.7361 15.7083 13C15.875 13.2639 15.9722 13.5556 16 13.875L13.9375 11.8125C14.1319 11.8958 14.3194 11.9826 14.5 12.0729C14.6806 12.1632 14.8611 12.2639 15.0417 12.375ZM11.6458 9.5L7.5 5.35417C7.77778 4.92361 8.13889 4.59028 8.58333 4.35417C9.02778 4.11806 9.5 4 10 4C10.8333 4 11.5417 4.29167 12.125 4.875C12.7083 5.45833 13 6.16667 13 7C13 7.5 12.8819 7.97222 12.6458 8.41667C12.4097 8.86111 12.0764 9.22222 11.6458 9.5Z" fill="black"/>
3
+ </svg>
package/src/main/assets/icons/ant/person-off.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M16 18.125L13.875 16H4V14.0833C4 13.7253 4.08681 13.3962 4.26042 13.096C4.43403 12.7959 4.67361 12.5556 4.97917 12.375C5.57639 12.0139 6.20833 11.7222 6.875 11.5C7.54167 11.2778 8.22917 11.1319 8.9375 11.0625L1.875 4L2.9375 2.9375L17.0625 17.0625L16 18.125ZM5.5 14.5H12.375L10.3958 12.5H10C9.25 12.5 8.51389 12.5972 7.79167 12.7917C7.06944 12.9861 6.38194 13.2778 5.72917 13.6667C5.66042 13.7075 5.605 13.7647 5.56292 13.8383C5.52097 13.9118 5.5 13.9935 5.5 14.0833V14.5ZM15.0417 12.375C15.3194 12.5278 15.5417 12.7361 15.7083 13C15.875 13.2639 15.9722 13.5556 16 13.875L13.9375 11.8125C14.1268 11.9 14.3135 11.9875 14.4975 12.075C14.6815 12.1625 14.8629 12.2625 15.0417 12.375ZM11.6458 9.5L10.5208 8.39583C10.8153 8.28361 11.0521 8.09958 11.2312 7.84375C11.4104 7.58806 11.5 7.30431 11.5 6.9925C11.5 6.58083 11.3539 6.22917 11.0617 5.9375C10.7694 5.64583 10.4182 5.5 10.0079 5.5C9.69708 5.5 9.41354 5.58958 9.15729 5.76875C8.90104 5.94792 8.71667 6.18472 8.60417 6.47917L7.5 5.35417C7.77778 4.92361 8.13889 4.59028 8.58333 4.35417C9.02778 4.11806 9.5 4 10 4C10.8333 4 11.5417 4.29167 12.125 4.875C12.7083 5.45833 13 6.16667 13 7C13 7.5 12.8819 7.97222 12.6458 8.41667C12.4097 8.86111 12.0764 9.22222 11.6458 9.5Z" fill="black"/>
3
+ </svg>
package/src/main/assets/icons/extraLarge/person-off-fill.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M33.5695 37.5417L29.3612 33.3333H6.66659V29.1667C6.66659 28.1481 6.92353 27.2568 7.43742 26.4929C7.95131 25.729 8.62034 25.1481 9.4445 24.75C10.9723 24.0369 12.4653 23.4768 13.9237 23.0696C15.382 22.6621 16.8519 22.4074 18.3333 22.3054L2.45825 6.43041L4.4445 4.44458L35.5553 35.5554L33.5695 37.5417ZM30.5278 24.75C31.3703 25.1389 32.0462 25.7153 32.5553 26.4792C33.0648 27.2431 33.3241 28.1296 33.3333 29.1387V29.3612L27.4999 23.5279C27.9999 23.7037 28.5023 23.8935 29.007 24.0971C29.5114 24.301 30.0184 24.5186 30.5278 24.75ZM23.1666 19.1946L14.3887 10.4167C14.9537 9.39805 15.7362 8.60639 16.7362 8.04166C17.7362 7.47694 18.8241 7.19458 19.9999 7.19458C21.7777 7.19458 23.287 7.81486 24.5278 9.05541C25.7684 10.2962 26.3887 11.8056 26.3887 13.5833C26.3887 14.7592 26.1063 15.8471 25.5416 16.8471C24.9769 17.8471 24.1852 18.6296 23.1666 19.1946Z" fill="black"/>
3
+ </svg>
package/src/main/assets/icons/extraLarge/person-off.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M33.5695 37.5417L29.3612 33.3333H6.66659V29.1667C6.66659 28.1481 6.92353 27.2568 7.43742 26.4929C7.95131 25.729 8.62034 25.1481 9.4445 24.75C10.9723 24.0369 12.4653 23.4768 13.9237 23.0696C15.382 22.6621 16.8519 22.4074 18.3333 22.3054L2.45825 6.43041L4.4445 4.44458L35.5553 35.5554L33.5695 37.5417ZM9.4445 30.5554H26.5833L21.0553 25.0279C20.8887 25.0093 20.7174 25 20.5416 25H19.9999C18.4258 25 16.8841 25.169 15.3749 25.5071C13.8658 25.8449 12.2778 26.4258 10.6112 27.25C10.2684 27.4258 9.98825 27.6897 9.77075 28.0417C9.55325 28.3936 9.4445 28.7686 9.4445 29.1667V30.5554ZM30.5278 24.75C31.3703 25.1389 32.0462 25.7153 32.5553 26.4792C33.0648 27.2431 33.3241 28.1296 33.3333 29.1387V29.3612L27.4999 23.5279C27.9999 23.7037 28.5023 23.8935 29.007 24.0971C29.5114 24.301 30.0184 24.5186 30.5278 24.75ZM23.1666 19.1946L21.0137 17.0417C21.7823 16.8286 22.4073 16.405 22.8887 15.7708C23.3703 15.1367 23.6112 14.4075 23.6112 13.5833C23.6112 12.5742 23.2616 11.72 22.5624 11.0208C21.8633 10.3217 21.0091 9.97208 19.9999 9.97208C19.1758 9.97208 18.4466 10.2129 17.8124 10.6946C17.1783 11.176 16.7546 11.801 16.5416 12.5696L14.3887 10.4167C14.9537 9.39805 15.7362 8.60639 16.7362 8.04166C17.7362 7.47694 18.8241 7.19458 19.9999 7.19458C21.7777 7.19458 23.287 7.81486 24.5278 9.05541C25.7684 10.2962 26.3887 11.8056 26.3887 13.5833C26.3887 14.7592 26.1063 15.8471 25.5416 16.8471C24.9769 17.8471 24.1852 18.6296 23.1666 19.1946Z" fill="black"/>
3
+ </svg>
package/src/main/assets/icons/index.ts CHANGED
@@ -213,3 +213,5 @@ export { default as PanelLeftClose } from './ant/panel-left-close.svg';
213
213
  export { default as PanelLeftCloseFill } from './ant/panel-left-close-fill.svg';
214
214
  export { default as Notifications } from './ant/notifications-off.svg';
215
215
  export { default as NotificationsFill } from './ant/notifications-off-fill.svg';
216
+ export { default as PersonOff } from './ant/person-off.svg';
217
+ export { default as PersonOffFill } from './ant/person-off-fill.svg';
package/src/main/assets/icons/large/person-off-fill.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M26.8556 30.0333L23.4889 26.6667H5.33322V23.3333C5.33322 22.5184 5.53877 21.8054 5.94989 21.1943C6.361 20.5832 6.89622 20.1184 7.55555 19.8C8.77777 19.2296 9.97222 18.7814 11.1389 18.4557C12.3056 18.1297 13.4814 17.9259 14.6666 17.8443L1.96655 5.14433L3.55555 3.55566L28.4442 28.4443L26.8556 30.0333ZM24.4222 19.8C25.0962 20.1111 25.6369 20.5722 26.0442 21.1833C26.4518 21.7944 26.6592 22.5037 26.6666 23.311V23.489L21.9999 18.8223C22.3999 18.963 22.8018 19.1148 23.2056 19.2777C23.6091 19.4408 24.0147 19.6149 24.4222 19.8ZM18.5332 15.3557L11.5109 8.33333C11.9629 7.51844 12.5889 6.88511 13.3889 6.43333C14.1889 5.98155 15.0592 5.75566 15.9999 5.75566C17.4221 5.75566 18.6296 6.25189 19.6222 7.24433C20.6147 8.237 21.1109 9.44444 21.1109 10.8667C21.1109 11.8073 20.885 12.6777 20.4332 13.4777C19.9814 14.2777 19.3481 14.9037 18.5332 15.3557Z" fill="black"/>
3
+ </svg>
package/src/main/assets/icons/large/person-off.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M26.8556 30.0333L23.4889 26.6667H5.33322V23.3333C5.33322 22.5184 5.53877 21.8054 5.94989 21.1943C6.361 20.5832 6.89622 20.1184 7.55555 19.8C8.77777 19.2296 9.97222 18.7814 11.1389 18.4557C12.3056 18.1297 13.4814 17.9259 14.6666 17.8443L1.96655 5.14433L3.55555 3.55566L28.4442 28.4443L26.8556 30.0333ZM7.55555 24.4443H21.2666L16.8442 20.0223C16.7109 20.0074 16.5739 20 16.4332 20H15.9999C14.7406 20 13.5072 20.1352 12.2999 20.4057C11.0926 20.6759 9.82222 21.1407 8.48889 21.8C8.21466 21.9407 7.99055 22.1518 7.81655 22.4333C7.64255 22.7149 7.55555 23.0149 7.55555 23.3333V24.4443ZM24.4222 19.8C25.0962 20.1111 25.6369 20.5722 26.0442 21.1833C26.4518 21.7944 26.6592 22.5037 26.6666 23.311V23.489L21.9999 18.8223C22.3999 18.963 22.8018 19.1148 23.2056 19.2777C23.6091 19.4408 24.0147 19.6149 24.4222 19.8ZM18.5332 15.3557L16.8109 13.6333C17.4258 13.4629 17.9258 13.124 18.3109 12.6167C18.6962 12.1093 18.8889 11.526 18.8889 10.8667C18.8889 10.0593 18.6092 9.376 18.0499 8.81666C17.4906 8.25733 16.8072 7.97766 15.9999 7.97766C15.3406 7.97766 14.7572 8.17033 14.2499 8.55566C13.7426 8.94077 13.4037 9.44077 13.2332 10.0557L11.5109 8.33333C11.9629 7.51844 12.5889 6.88511 13.3889 6.43333C14.1889 5.98155 15.0592 5.75566 15.9999 5.75566C17.4221 5.75566 18.6296 6.25189 19.6222 7.24433C20.6147 8.237 21.1109 9.44444 21.1109 10.8667C21.1109 11.8073 20.885 12.6777 20.4332 13.4777C19.9814 14.2777 19.3481 14.9037 18.5332 15.3557Z" fill="black"/>
3
+ </svg>
package/src/main/assets/icons/medium/person-off-fill.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M19.775 22.625L17.15 20H4V17.2C4 16.6333 4.14583 16.1125 4.4375 15.6375C4.72917 15.1625 5.11667 14.8 5.6 14.55C6.35 14.1667 7.1125 13.8583 7.8875 13.625C8.6625 13.3917 9.45 13.2167 10.25 13.1L1.375 4.22499L2.8 2.79999L21.2 21.2L19.775 22.625ZM18.4 14.55C18.8833 14.7833 19.2667 15.1375 19.55 15.6125C19.8333 16.0875 19.9833 16.6 20 17.15L16.65 13.8C16.95 13.9167 17.2458 14.0333 17.5375 14.15C17.8292 14.2667 18.1167 14.4 18.4 14.55ZM14.2 11.35L8.65 5.79999C9.03333 5.23332 9.51667 4.79165 10.1 4.47499C10.6833 4.15832 11.3167 3.99999 12 3.99999C13.1 3.99999 14.0417 4.39165 14.825 5.17499C15.6083 5.95832 16 6.89999 16 7.99999C16 8.68332 15.8417 9.31665 15.525 9.89999C15.2083 10.4833 14.7667 10.9667 14.2 11.35Z" fill="black"/>
3
+ </svg>
package/src/main/assets/icons/medium/person-off.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M19.775 22.625L17.15 20H4V17.2C4 16.6333 4.14583 16.1125 4.4375 15.6375C4.72917 15.1625 5.11667 14.8 5.6 14.55C6.35 14.1667 7.1125 13.8583 7.8875 13.625C8.6625 13.3917 9.45 13.2167 10.25 13.1L1.375 4.22499L2.8 2.79999L21.2 21.2L19.775 22.625ZM6 18H15.15L12.15 15H12C11.0667 15 10.1417 15.1125 9.225 15.3375C8.30833 15.5625 7.4 15.9 6.5 16.35C6.35 16.4333 6.22917 16.55 6.1375 16.7C6.04583 16.85 6 17.0167 6 17.2V18ZM18.4 14.55C18.8833 14.7833 19.2667 15.1375 19.55 15.6125C19.8333 16.0875 19.9833 16.6 20 17.15L16.65 13.8C16.95 13.9167 17.2458 14.0333 17.5375 14.15C17.8292 14.2667 18.1167 14.4 18.4 14.55ZM14.2 11.35L12.725 9.87499C13.1083 9.72499 13.4167 9.47915 13.65 9.13749C13.8833 8.79582 14 8.41665 14 7.99999C14 7.44999 13.8042 6.97915 13.4125 6.58749C13.0208 6.19582 12.55 5.99999 12 5.99999C11.5833 5.99999 11.2042 6.11665 10.8625 6.34999C10.5208 6.58332 10.275 6.89165 10.125 7.27499L8.65 5.79999C9.03333 5.23332 9.51667 4.79165 10.1 4.47499C10.6833 4.15832 11.3167 3.99999 12 3.99999C13.1 3.99999 14.0417 4.39165 14.825 5.17499C15.6083 5.95832 16 6.89999 16 7.99999C16 8.68332 15.8417 9.31665 15.525 9.89999C15.2083 10.4833 14.7667 10.9667 14.2 11.35Z" fill="black"/>
3
+ </svg>
package/src/main/assets/icons/small/person-off-fill.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M12.8 14.5L11.1 12.8H3.2V11.2667C3.2 10.9778 3.26944 10.7139 3.40833 10.475C3.54722 10.2361 3.73889 10.0445 3.98333 9.90001C4.46111 9.61112 4.96667 9.37778 5.5 9.20001C6.03333 9.02223 6.58333 8.90556 7.15 8.85001L1.5 3.20001L2.35 2.35001L13.65 13.65L12.8 14.5ZM12.0333 9.90001C12.2556 10.0222 12.4333 10.1889 12.5667 10.4C12.7 10.6111 12.7778 10.8445 12.8 11.1L11.15 9.45001C11.3056 9.51667 11.4556 9.58612 11.6 9.65834C11.7444 9.73056 11.8889 9.81112 12.0333 9.90001ZM9.31667 7.60001L6 4.28334C6.22222 3.93889 6.51111 3.67223 6.86667 3.48334C7.22222 3.29445 7.6 3.20001 8 3.20001C8.66667 3.20001 9.23333 3.43334 9.7 3.90001C10.1667 4.36667 10.4 4.93334 10.4 5.60001C10.4 6.00001 10.3056 6.37778 10.1167 6.73334C9.92778 7.08889 9.66111 7.37778 9.31667 7.60001Z" fill="black"/>
3
+ </svg>
package/src/main/assets/icons/small/person-off.svg ADDED
@@ -0,0 +1,3 @@
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M12.8 14.5L11.1 12.8H3.2V11.2667C3.2 10.9802 3.26944 10.7169 3.40833 10.4768C3.54722 10.2367 3.73889 10.0445 3.98333 9.90001C4.46111 9.61112 4.96667 9.37778 5.5 9.20001C6.03333 9.02223 6.58333 8.90556 7.15 8.85001L1.5 3.20001L2.35 2.35001L13.65 13.65L12.8 14.5ZM4.4 11.6H9.9L8.31667 10H8C7.4 10 6.81111 10.0778 6.23333 10.2333C5.65556 10.3889 5.10556 10.6222 4.58333 10.9333C4.52833 10.966 4.484 11.0118 4.45033 11.0707C4.41678 11.1294 4.4 11.1948 4.4 11.2667V11.6ZM12.0333 9.90001C12.2556 10.0222 12.4333 10.1889 12.5667 10.4C12.7 10.6111 12.7778 10.8445 12.8 11.1L11.15 9.45001C11.3014 9.52001 11.4508 9.59001 11.598 9.66001C11.7452 9.73001 11.8903 9.81001 12.0333 9.90001ZM9.31667 7.60001L8.41667 6.71667C8.65222 6.62689 8.84167 6.47967 8.985 6.27501C9.12833 6.07045 9.2 5.84345 9.2 5.59401C9.2 5.26467 9.08311 4.98334 8.84933 4.75001C8.61556 4.51667 8.33456 4.40001 8.00633 4.40001C7.75767 4.40001 7.53083 4.47167 7.32583 4.61501C7.12083 4.75834 6.97333 4.94778 6.88333 5.18334L6 4.28334C6.22222 3.93889 6.51111 3.67223 6.86667 3.48334C7.22222 3.29445 7.6 3.20001 8 3.20001C8.66667 3.20001 9.23333 3.43334 9.7 3.90001C10.1667 4.36667 10.4 4.93334 10.4 5.60001C10.4 6.00001 10.3056 6.37778 10.1167 6.73334C9.92778 7.08889 9.66111 7.37778 9.31667 7.60001Z" fill="black"/>
3
+ </svg>
package/src/main/helpers/functions/icons.ts CHANGED
@@ -1470,6 +1470,18 @@ import NotificationsOffFillLg from '../../assets/icons/large/notifications-off-f
1470
1470
  import NotificationsOffFillMd from '../../assets/icons/medium/notifications-off-fill.svg?react';
1471
1471
  import NotificationsOffFillSm from '../../assets/icons/small/notifications-off-fill.svg?react';
1472
1472
 
1473
+ import PersonOffAnt from '../../assets/icons/ant/person-off.svg?react';
1474
+ import PersonOffEl from '../../assets/icons/extraLarge/person-off.svg?react';
1475
+ import PersonOffLg from '../../assets/icons/large/person-off.svg?react';
1476
+ import PersonOffMd from '../../assets/icons/medium/person-off.svg?react';
1477
+ import PersonOffSm from '../../assets/icons/small/person-off.svg?react';
1478
+
1479
+ import PersonOffFillAnt from '../../assets/icons/ant/person-off-fill.svg?react';
1480
+ import PersonOffFillEl from '../../assets/icons/extraLarge/person-off-fill.svg?react';
1481
+ import PersonOffFillLg from '../../assets/icons/large/person-off-fill.svg?react';
1482
+ import PersonOffFillMd from '../../assets/icons/medium/person-off-fill.svg?react';
1483
+ import PersonOffFillSm from '../../assets/icons/small/person-off-fill.svg?react';
1484
+
1473
1485
  export const Icons = {
1474
1486
  ExpandedCircleDown,
1475
1487
  ExpandedCircleRight,
@@ -2695,4 +2707,14 @@ export const Icons = {
2695
2707
  NotificationsOffFillLg,
2696
2708
  NotificationsOffFillMd,
2697
2709
  NotificationsOffFillSm,
2710
+ PersonOffAnt,
2711
+ PersonOffEl,
2712
+ PersonOffLg,
2713
+ PersonOffMd,
2714
+ PersonOffSm,
2715
+ PersonOffFillAnt,
2716
+ PersonOffFillEl,
2717
+ PersonOffFillLg,
2718
+ PersonOffFillMd,
2719
+ PersonOffFillSm,
2698
2720
  };
package/src/presentation/components/molecules/TabBar/TabBar.stories.tsx CHANGED
@@ -110,6 +110,44 @@ WithIcons.args = {
110
110
  })),
111
111
  };
112
112
 
113
+ export const WithIconColors = Template.bind({});
114
+ WithIconColors.args = {
115
+ tabs: [
116
+ {
117
+ label: 'Primary',
118
+ child: <h1>page 1</h1>,
119
+ icon: {
120
+ iconName: 'InfoFill1Sm',
121
+ iconColor: sg.colors.brandColors.colorBrandPrimary,
122
+ },
123
+ },
124
+ {
125
+ label: 'Success',
126
+ child: <h1>page 2</h1>,
127
+ icon: {
128
+ iconName: 'CheckCircleFill1Sm',
129
+ iconColor: sg.colors.feedbackColors.colorFeedbackSuccess,
130
+ },
131
+ },
132
+ {
133
+ label: 'Warning',
134
+ child: <h1>page 3</h1>,
135
+ icon: {
136
+ iconName: 'WarningFillSm',
137
+ iconColor: sg.colors.feedbackColors.colorFeedbackWarning,
138
+ },
139
+ },
140
+ {
141
+ label: 'Error',
142
+ child: <h1>page 4</h1>,
143
+ icon: {
144
+ iconName: 'ErrorFill1Sm',
145
+ iconColor: sg.colors.feedbackColors.colorFeedbackError,
146
+ },
147
+ },
148
+ ],
149
+ };
150
+
113
151
  export const Editable = Template.bind({});
114
152
  Editable.args = {
115
153
  isTabsEditable: true,
package/src/presentation/components/molecules/TabBar/index.tsx CHANGED
@@ -180,6 +180,7 @@ const TabItem: React.FC<TabItemProps> = ({
180
180
  isLast={isLast}
181
181
  isFirst={isFirst}
182
182
  isEdit={isEdit}
183
+ hasCustomIconColor={!!tab.icon?.iconColor}
183
184
  data-testid={dataTestid}
184
185
  data-cy={dataCy}
185
186
  >
package/src/presentation/components/molecules/TabBar/styles.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { sg, resetStyles } from '../../../styles';
2
1
  import styled, { css } from 'styled-components';
2
+ import { resetStyles, sg } from '../../../styles';
3
3
 
4
4
  interface ContainerProps {
5
5
  direction?: 'horizontal' | 'vertical';
@@ -32,6 +32,7 @@ interface TabHeaderProps {
32
32
  isLast?: boolean;
33
33
  isFirst?: boolean;
34
34
  isEdit?: boolean;
35
+ hasCustomIconColor?: boolean;
35
36
  }
36
37
 
37
38
  export const TabHeader = styled.div<TabHeaderProps>`
@@ -103,8 +104,10 @@ export const TabHeader = styled.div<TabHeaderProps>`
103
104
  & > i {
104
105
  path {
105
106
  ${resetStyles}
106
- fill: ${({ active }) =>
107
- active
107
+ fill: ${({ active, hasCustomIconColor }) =>
108
+ hasCustomIconColor
109
+ ? undefined
110
+ : active
108
111
  ? sg.colors.brandColors.colorBrandPrimary
109
112
  : sg.colors.neutralColors.colorNeutralDark};
110
113
  }