@trafilea/afrodita-components 5.0.0-beta.205 → 5.0.0-beta.207

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 (5) hide show
  1. package/build/index.d.ts +4 -2
  2. package/build/index.esm.js +4 -4
  3. package/build/index.js +4 -4
  4. package/build/theme/tsd-theme.js +59 -27
  5. package/package.json +1 -1
package/build/index.d.ts CHANGED
@@ -2615,10 +2615,12 @@ interface TabProps {
2615
2615
  }
2616
2616
  declare const Tab: ({ title, titleSize, height, selectedTitleWeight, selected, onClick, color, tabsMaxWidth, }: TabProps) => JSX.Element;
2617
2617
 
2618
- interface IconList {
2618
+ interface IconsWithTitleProps {
2619
2619
  backgroundColor: string;
2620
2620
  iconColor: string;
2621
2621
  iconName: string;
2622
+ iconFolder?: string;
2623
+ withWrapper?: boolean;
2622
2624
  iconTitle: string;
2623
2625
  iconSizeDesktop?: number;
2624
2626
  iconSizeMobile?: number;
@@ -2627,7 +2629,7 @@ interface IconList {
2627
2629
  iconStyle?: string;
2628
2630
  isTitleInnerHtml?: boolean;
2629
2631
  }
2630
- declare const IconsWithTitle: ({ iconName, iconTitle, backgroundColor, iconColor, iconSizeDesktop, iconSizeMobile, iconTitlePosition, iconTitleStyle, iconStyle, isTitleInnerHtml, }: IconList) => JSX.Element | null;
2632
+ declare const IconsWithTitle: ({ iconName, iconTitle, iconFolder, withWrapper, backgroundColor, iconColor, iconSizeDesktop, iconSizeMobile, iconTitlePosition, iconTitleStyle, iconStyle, isTitleInnerHtml, }: IconsWithTitleProps) => JSX.Element | null;
2631
2633
 
2632
2634
  interface NoteProps {
2633
2635
  accentColor?: string;
package/build/index.esm.js CHANGED
@@ -12638,7 +12638,7 @@ var OrderBar = function (_a) {
12638
12638
  var templateObject_1$O, templateObject_2$x;
12639
12639
 
12640
12640
  var TableElement$1 = newStyled.table(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n box-sizing: border-box;\n border-radius: 0.5rem;\n border: 0.063rem solid ", ";\n border-spacing: 0;\n font-size: 0.875rem;\n line-height: 3.125rem;\n width: 100%;\n color: ", ";\n"], ["\n box-sizing: border-box;\n border-radius: 0.5rem;\n border: 0.063rem solid ", ";\n border-spacing: 0;\n font-size: 0.875rem;\n line-height: 3.125rem;\n width: 100%;\n color: ", ";\n"])), function (props) { return props.borderColor; }, function (props) { return props.color; });
12641
- var TableCell$1 = newStyled.td(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 0 1.25rem;\n text-align: center;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"], ["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 0 1.25rem;\n text-align: center;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
12641
+ var TableCell$1 = newStyled.td(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 8px;\n text-align: center;\n line-height: 20px;\n height: 52px;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"], ["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 8px;\n text-align: center;\n line-height: 20px;\n height: 52px;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
12642
12642
  var TableHead$1 = newStyled.th(templateObject_3$t || (templateObject_3$t = __makeTemplateObject(["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n font-weight: 700;\n\n &:last-child {\n border-right: none;\n }\n"], ["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n font-weight: 700;\n\n &:last-child {\n border-right: none;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
12643
12643
  var TableRow$1 = newStyled.tr(templateObject_4$k || (templateObject_4$k = __makeTemplateObject(["\n &:last-child {\n td {\n border-bottom: none;\n }\n }\n\n &.background {\n background-color: ", ";\n }\n"], ["\n &:last-child {\n td {\n border-bottom: none;\n }\n }\n\n &.background {\n background-color: ", ";\n }\n"])), function (props) { return props.backgroundColor; });
12644
12644
  var SizeTable = function (_a) {
@@ -17761,10 +17761,10 @@ var IconWrapper = newStyled.div(function (props) { return ({
17761
17761
  }); });
17762
17762
  var IconsWithTitle = function (_a) {
17763
17763
  var _b;
17764
- var iconName = _a.iconName, iconTitle = _a.iconTitle, backgroundColor = _a.backgroundColor, iconColor = _a.iconColor, _c = _a.iconSizeDesktop, iconSizeDesktop = _c === void 0 ? 4 : _c, _d = _a.iconSizeMobile, iconSizeMobile = _d === void 0 ? 3 : _d, _e = _a.iconTitlePosition, iconTitlePosition = _e === void 0 ? 'bottom' : _e, _f = _a.iconTitleStyle, iconTitleStyle = _f === void 0 ? '' : _f, _g = _a.iconStyle, iconStyle = _g === void 0 ? '' : _g, _h = _a.isTitleInnerHtml, isTitleInnerHtml = _h === void 0 ? false : _h;
17764
+ var iconName = _a.iconName, iconTitle = _a.iconTitle, _c = _a.iconFolder, iconFolder = _c === void 0 ? 'MyAccount' : _c, _d = _a.withWrapper, withWrapper = _d === void 0 ? true : _d, backgroundColor = _a.backgroundColor, iconColor = _a.iconColor, _e = _a.iconSizeDesktop, iconSizeDesktop = _e === void 0 ? 4 : _e, _f = _a.iconSizeMobile, iconSizeMobile = _f === void 0 ? 3 : _f, _g = _a.iconTitlePosition, iconTitlePosition = _g === void 0 ? 'bottom' : _g, _h = _a.iconTitleStyle, iconTitleStyle = _h === void 0 ? '' : _h, _j = _a.iconStyle, iconStyle = _j === void 0 ? '' : _j, _k = _a.isTitleInnerHtml, isTitleInnerHtml = _k === void 0 ? false : _k;
17765
17765
  var isMobile = useWindowDimensions({ mobile: 0, desktop: 768 }).isMobile;
17766
17766
  // @ts-ignore
17767
- var IconComponent = (_b = Icon['MyAccount'][iconName]) !== null && _b !== void 0 ? _b : (function () { return 'Not found'; });
17767
+ var IconComponent = (_b = Icon[iconFolder][iconName]) !== null && _b !== void 0 ? _b : (function () { return 'Not found'; });
17768
17768
  if (IconComponent == null) {
17769
17769
  console.error('Icon', iconName, 'not found');
17770
17770
  return null;
@@ -17785,7 +17785,7 @@ var IconsWithTitle = function (_a) {
17785
17785
  textAlign: 'center',
17786
17786
  lineHeight: '18px',
17787
17787
  };
17788
- return (jsx$1(Fragment$1, { children: jsxs$1(Container$d, __assign$1({ textPosition: iconTitlePosition }, { children: [jsx$1(IconWrapper, __assign$1({ backgroundColor: backgroundColor, style: iconStyles, iconSize: isMobile ? iconSizeMobile : iconSizeDesktop }, { children: jsx$1(IconComponent, { width: isMobile ? iconSizeMobile : iconSizeDesktop, height: isMobile ? iconSizeMobile : iconSizeDesktop, fill: iconColor }, void 0) }), void 0), jsx$1(Text$6, { variant: "heading6", weight: "demi", style: titleStyles ? titleStyles : defaultTitleStyle, dangerouslySetInnerHTML: isTitleInnerHtml ? { __html: iconTitle } : { __html: "<span>".concat(iconTitle, "</span>") } }, void 0)] }), void 0) }, void 0));
17788
+ return (jsx$1(Fragment$1, { children: jsxs$1(Container$d, __assign$1({ textPosition: iconTitlePosition }, { children: [withWrapper ? (jsx$1(IconWrapper, __assign$1({ backgroundColor: backgroundColor, style: iconStyles, iconSize: isMobile ? iconSizeMobile : iconSizeDesktop }, { children: jsx$1(IconComponent, { width: isMobile ? iconSizeMobile : iconSizeDesktop, height: isMobile ? iconSizeMobile : iconSizeDesktop, fill: iconColor }, void 0) }), void 0)) : (jsx$1(IconComponent, { width: isMobile ? iconSizeMobile : iconSizeDesktop, height: isMobile ? iconSizeMobile : iconSizeDesktop, fill: iconColor }, void 0)), jsx$1(Text$6, { variant: "heading6", weight: "demi", style: titleStyles ? titleStyles : defaultTitleStyle, dangerouslySetInnerHTML: isTitleInnerHtml ? { __html: iconTitle } : { __html: "<span>".concat(iconTitle, "</span>") } }, void 0)] }), void 0) }, void 0));
17789
17789
  };
17790
17790
 
17791
17791
  var ImageWrapper$1 = newStyled.div(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n position: relative;\n display: flex;\n max-height: fit-content;\n"], ["\n position: relative;\n display: flex;\n max-height: fit-content;\n"])));
package/build/index.js CHANGED
@@ -12664,7 +12664,7 @@ var OrderBar = function (_a) {
12664
12664
  var templateObject_1$O, templateObject_2$x;
12665
12665
 
12666
12666
  var TableElement$1 = newStyled.table(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n box-sizing: border-box;\n border-radius: 0.5rem;\n border: 0.063rem solid ", ";\n border-spacing: 0;\n font-size: 0.875rem;\n line-height: 3.125rem;\n width: 100%;\n color: ", ";\n"], ["\n box-sizing: border-box;\n border-radius: 0.5rem;\n border: 0.063rem solid ", ";\n border-spacing: 0;\n font-size: 0.875rem;\n line-height: 3.125rem;\n width: 100%;\n color: ", ";\n"])), function (props) { return props.borderColor; }, function (props) { return props.color; });
12667
- var TableCell$1 = newStyled.td(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 0 1.25rem;\n text-align: center;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"], ["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 0 1.25rem;\n text-align: center;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
12667
+ var TableCell$1 = newStyled.td(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 8px;\n text-align: center;\n line-height: 20px;\n height: 52px;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"], ["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n padding: 8px;\n text-align: center;\n line-height: 20px;\n height: 52px;\n\n &:last-child {\n border-right: none;\n }\n\n &:first-of-type {\n font-weight: 700;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
12668
12668
  var TableHead$1 = newStyled.th(templateObject_3$t || (templateObject_3$t = __makeTemplateObject(["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n font-weight: 700;\n\n &:last-child {\n border-right: none;\n }\n"], ["\n border-bottom: 0.063rem solid ", ";\n border-right: 0.063rem solid ", ";\n font-weight: 700;\n\n &:last-child {\n border-right: none;\n }\n"])), function (props) { return props.borderColor; }, function (props) { return props.borderColor; });
12669
12669
  var TableRow$1 = newStyled.tr(templateObject_4$k || (templateObject_4$k = __makeTemplateObject(["\n &:last-child {\n td {\n border-bottom: none;\n }\n }\n\n &.background {\n background-color: ", ";\n }\n"], ["\n &:last-child {\n td {\n border-bottom: none;\n }\n }\n\n &.background {\n background-color: ", ";\n }\n"])), function (props) { return props.backgroundColor; });
12670
12670
  var SizeTable = function (_a) {
@@ -17787,10 +17787,10 @@ var IconWrapper = newStyled.div(function (props) { return ({
17787
17787
  }); });
17788
17788
  var IconsWithTitle = function (_a) {
17789
17789
  var _b;
17790
- var iconName = _a.iconName, iconTitle = _a.iconTitle, backgroundColor = _a.backgroundColor, iconColor = _a.iconColor, _c = _a.iconSizeDesktop, iconSizeDesktop = _c === void 0 ? 4 : _c, _d = _a.iconSizeMobile, iconSizeMobile = _d === void 0 ? 3 : _d, _e = _a.iconTitlePosition, iconTitlePosition = _e === void 0 ? 'bottom' : _e, _f = _a.iconTitleStyle, iconTitleStyle = _f === void 0 ? '' : _f, _g = _a.iconStyle, iconStyle = _g === void 0 ? '' : _g, _h = _a.isTitleInnerHtml, isTitleInnerHtml = _h === void 0 ? false : _h;
17790
+ var iconName = _a.iconName, iconTitle = _a.iconTitle, _c = _a.iconFolder, iconFolder = _c === void 0 ? 'MyAccount' : _c, _d = _a.withWrapper, withWrapper = _d === void 0 ? true : _d, backgroundColor = _a.backgroundColor, iconColor = _a.iconColor, _e = _a.iconSizeDesktop, iconSizeDesktop = _e === void 0 ? 4 : _e, _f = _a.iconSizeMobile, iconSizeMobile = _f === void 0 ? 3 : _f, _g = _a.iconTitlePosition, iconTitlePosition = _g === void 0 ? 'bottom' : _g, _h = _a.iconTitleStyle, iconTitleStyle = _h === void 0 ? '' : _h, _j = _a.iconStyle, iconStyle = _j === void 0 ? '' : _j, _k = _a.isTitleInnerHtml, isTitleInnerHtml = _k === void 0 ? false : _k;
17791
17791
  var isMobile = useWindowDimensions({ mobile: 0, desktop: 768 }).isMobile;
17792
17792
  // @ts-ignore
17793
- var IconComponent = (_b = Icon['MyAccount'][iconName]) !== null && _b !== void 0 ? _b : (function () { return 'Not found'; });
17793
+ var IconComponent = (_b = Icon[iconFolder][iconName]) !== null && _b !== void 0 ? _b : (function () { return 'Not found'; });
17794
17794
  if (IconComponent == null) {
17795
17795
  console.error('Icon', iconName, 'not found');
17796
17796
  return null;
@@ -17811,7 +17811,7 @@ var IconsWithTitle = function (_a) {
17811
17811
  textAlign: 'center',
17812
17812
  lineHeight: '18px',
17813
17813
  };
17814
- return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs(Container$d, __assign$1({ textPosition: iconTitlePosition }, { children: [jsxRuntime.jsx(IconWrapper, __assign$1({ backgroundColor: backgroundColor, style: iconStyles, iconSize: isMobile ? iconSizeMobile : iconSizeDesktop }, { children: jsxRuntime.jsx(IconComponent, { width: isMobile ? iconSizeMobile : iconSizeDesktop, height: isMobile ? iconSizeMobile : iconSizeDesktop, fill: iconColor }, void 0) }), void 0), jsxRuntime.jsx(Text$6, { variant: "heading6", weight: "demi", style: titleStyles ? titleStyles : defaultTitleStyle, dangerouslySetInnerHTML: isTitleInnerHtml ? { __html: iconTitle } : { __html: "<span>".concat(iconTitle, "</span>") } }, void 0)] }), void 0) }, void 0));
17814
+ return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs(Container$d, __assign$1({ textPosition: iconTitlePosition }, { children: [withWrapper ? (jsxRuntime.jsx(IconWrapper, __assign$1({ backgroundColor: backgroundColor, style: iconStyles, iconSize: isMobile ? iconSizeMobile : iconSizeDesktop }, { children: jsxRuntime.jsx(IconComponent, { width: isMobile ? iconSizeMobile : iconSizeDesktop, height: isMobile ? iconSizeMobile : iconSizeDesktop, fill: iconColor }, void 0) }), void 0)) : (jsxRuntime.jsx(IconComponent, { width: isMobile ? iconSizeMobile : iconSizeDesktop, height: isMobile ? iconSizeMobile : iconSizeDesktop, fill: iconColor }, void 0)), jsxRuntime.jsx(Text$6, { variant: "heading6", weight: "demi", style: titleStyles ? titleStyles : defaultTitleStyle, dangerouslySetInnerHTML: isTitleInnerHtml ? { __html: iconTitle } : { __html: "<span>".concat(iconTitle, "</span>") } }, void 0)] }), void 0) }, void 0));
17815
17815
  };
17816
17816
 
17817
17817
  var ImageWrapper$1 = newStyled.div(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n position: relative;\n display: flex;\n max-height: fit-content;\n"], ["\n position: relative;\n display: flex;\n max-height: fit-content;\n"])));
package/build/theme/tsd-theme.js CHANGED
@@ -869,6 +869,60 @@ var tsd = {
869
869
  fonts: {
870
870
  url: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/fonts/tsd',
871
871
  config: [
872
+ {
873
+ family: 'Poppins',
874
+ src: 'Poppins-Regular.ttf',
875
+ },
876
+ {
877
+ family: 'Poppins',
878
+ src: 'Poppins-Italic.ttf',
879
+ style: 'italic',
880
+ },
881
+ {
882
+ family: 'Poppins',
883
+ src: 'Poppins-Bold.ttf',
884
+ },
885
+ {
886
+ family: 'Poppins',
887
+ src: 'Poppins-BoldItalic.ttf',
888
+ style: 'italic',
889
+ },
890
+ {
891
+ family: 'Poppins',
892
+ src: 'Poppins-ExtraBold.ttf',
893
+ },
894
+ {
895
+ family: 'Poppins',
896
+ src: 'Poppins-ExtraBoldItalic.ttf',
897
+ style: 'italic',
898
+ },
899
+ {
900
+ family: 'Poppins',
901
+ src: 'Poppins-Medium.ttf',
902
+ },
903
+ {
904
+ family: 'Poppins',
905
+ src: 'Poppins-MediumItalic.ttf',
906
+ style: 'italic',
907
+ },
908
+ {
909
+ family: 'Poppins',
910
+ src: 'Poppins-SemiBold.ttf',
911
+ },
912
+ {
913
+ family: 'Poppins',
914
+ src: 'Poppins-SemiBoldItalic.ttf',
915
+ style: 'italic',
916
+ },
917
+ {
918
+ family: 'Poppins',
919
+ src: 'Poppins-Light.ttf',
920
+ },
921
+ {
922
+ family: 'Poppins',
923
+ src: 'Poppins-LightItalic.ttf',
924
+ style: 'italic',
925
+ },
872
926
  {
873
927
  family: 'PlayfairDisplay',
874
928
  src: 'PlayfairDisplay-Regular.ttf',
@@ -924,28 +978,6 @@ var tsd = {
924
978
  src: 'PlayfairDisplay-SemiBoldItalic.ttf',
925
979
  style: 'italic',
926
980
  },
927
- {
928
- family: 'Raleway',
929
- src: 'Raleway-Regular.ttf',
930
- },
931
- {
932
- family: 'Raleway',
933
- src: 'Raleway-Bold.ttf',
934
- },
935
- {
936
- family: 'Raleway',
937
- src: 'Raleway-BoldItalic.ttf',
938
- style: 'italic',
939
- },
940
- {
941
- family: 'Raleway',
942
- src: 'Raleway-Light.ttf',
943
- },
944
- {
945
- family: 'Raleway',
946
- src: 'Raleway-LightItalic.ttf',
947
- style: 'italic',
948
- },
949
981
  {
950
982
  family: 'Montserrat',
951
983
  src: 'Montserrat-Regular.ttf',
@@ -971,13 +1003,13 @@ var tsd = {
971
1003
  },
972
1004
  assets: {
973
1005
  images: {
974
- favicon: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/revel/revel_favicon.png',
975
- logo: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/revel/revelbeauty.svg',
1006
+ favicon: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/tsd/tsd_favicon.png',
1007
+ logo: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/tsd/tsd_logo.svg',
976
1008
  logoSize: {
977
- width: '342',
978
- height: '22',
1009
+ width: '375',
1010
+ height: '165',
979
1011
  },
980
- logoMobile: 'https://cdn11.bigcommerce.com/s-fjtlubkm6t/images/stencil/original/image-manager/mobilelogo.png?t=1667205066&_gl=1*1rjjnv8*_ga*MTM1MjY2Nzk4OS4xNjYzMjQ5ODIy*_ga_WS2VZYPC6G*MTY2NzIwNDk0OS41Ni4xLjE2NjcyMDUwNTguMTQuMC4w',
1012
+ logoMobile: 'https://cdn.jsdelivr.net/gh/trafilea/storefront-static@main/images/tsd/tsd_logo.svg',
981
1013
  },
982
1014
  },
983
1015
  };
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Trafilea's Design System",
4
4
  "author": "Trafilea",
5
5
  "repository": "https://github.com/trafilea/afrodita-components",
6
- "version": "5.0.0-beta.205",
6
+ "version": "5.0.0-beta.207",
7
7
  "private": false,
8
8
  "main": "build/index.js",
9
9
  "style": "build/index.css",