@trafilea/afrodita-components 7.25.5 → 7.25.7
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.
- package/build/es/components/checkbox/Checkbox.js +1 -1
- package/build/es/components/color/ColorPickerWithTooltip.js +1 -1
- package/build/es/components/color/styles/ColorPickerwithTootip.styled.js +1 -1
- package/build/index.d.ts +4 -2
- package/build/lib/components/checkbox/Checkbox.js +1 -1
- package/build/lib/components/color/ColorPickerWithTooltip.js +1 -1
- package/build/lib/components/color/styles/ColorPickerwithTootip.styled.js +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{__makeTemplateObject as e,__assign as o}from"tslib";import{jsxs as n,jsx as
|
|
1
|
+
import{__makeTemplateObject as e,__assign as o}from"tslib";import{jsxs as n,jsx as i}from"react/jsx-runtime";import t from"@emotion/styled";import{useTheme as r}from"../../core/theme/Theme.js";import{ComponentSize as a}from"../../types/enums.js";import{Icon as c}from"../icons/index.js";import s from"../shared/label/label.js";import{CustomCheckboxStyles as l}from"./styles.js";var d,u,h=t.div(d||(d=e(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n user-select: none;\n position: relative;\n"],["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n user-select: none;\n position: relative;\n"]))),b=function(e,o){if(!e&&!o)return!1;var n=(null==e?void 0:e.toLowerCase().trim())||"",i=(null==o?void 0:o.toLowerCase().trim())||"";return n.includes("white")||"#fff"===n||"#ffffff"===n||"white"===n||"#daa070"===n||"#f1cb75"===n||n.includes("beige")||n.includes("latte")||n.includes("sand")||("white"===i||"beige"===i||"latte"===i||"sand"===i)},f=t.div(l.baseStyles,(function(e){var o,n=e.backgroundImage?"\n background-image: url(".concat(e.backgroundImage,");\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n "):"",i=e.backgroundColor?"background-color: ".concat(e.backgroundColor,";"):"",t=b(null===(o=e.backgroundColor)||void 0===o?void 0:o.toString(),e.text)?"\n svg {\n path {\n fill: var(--colors-shades-black-color);\n }\n }":"",r=e.hasHightligthBorder?"border: 0.27px var(--colors-shades-300-color) solid;":"";return[l[e.size](e.theme),l[e.variant](e.theme,e.isChecked,e.disabled),"\n ".concat(n,"\n ").concat(i,"\n ").concat(t,"\n ").concat(r)]})),g=t.input(u||(u=e(["\n position: absolute;\n height: 100%;\n width: 100%;\n margin: 0;\n opacity: 0;\n cursor: ",";\n\n &:focus-visible {\n outline: none;\n }\n\n &:focus-visible + div {\n outline: 2px solid var(--colors-shades-700-color);\n outline-offset: 2px;\n ","\n }\n"],["\n position: absolute;\n height: 100%;\n width: 100%;\n margin: 0;\n opacity: 0;\n cursor: ",";\n\n &:focus-visible {\n outline: none;\n }\n\n &:focus-visible + div {\n outline: 2px solid var(--colors-shades-700-color);\n outline-offset: 2px;\n ","\n }\n"])),(function(e){return e.disabled?"not-allowed":"pointer"}),(function(e){return e.$isColorVariant&&"border-radius: 50%;"})),m=function(e){var t=e.disabled,l=void 0!==t&&t,d=e.onChange,u=e.size,m=void 0===u?a.Medium:u,v=e.sizeLabel,p=void 0===v?a.Medium:v,k=e.colorLabel,x=e.text,C=e.checked,y=void 0!==C&&C,w=e.id,j=e.variant,z=e.blockUncheck,L=e.backgroundColor,I=e.backgroundImage,B=e.hasHightligthBorder,H=void 0!==B&&B,M=e.ariaLabel,S=r();return n(h,{children:[i(g,{type:"checkbox",checked:y,disabled:l,onChange:function(e){l||!1===e.target.checked&&z?e.preventDefault():d(e.target.checked)},id:w,"aria-label":M,$isColorVariant:"color"===j},void 0),i(f,o({theme:S,size:m,disabled:l,isChecked:y,"data-testid":"checkbox",variant:j,backgroundColor:L,backgroundImage:I,text:x,hasHightligthBorder:H},{children:y&&i(c.Actions.Check,{fill:b(L,x)?S.colors.shades.black.color:S.colors.shades.white.color},void 0)}),void 0),i(s,o({"data-testid":"checkbox-text",size:p,style:{color:k||S.colors.shades[700].color},variant:y?"demi":"regular",htmlFor:w,disabled:l},{children:x}),void 0)]},void 0)};export{m as Checkbox};
|
|
2
2
|
//# sourceMappingURL=Checkbox.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{__assign as o}from"tslib";import{jsxs as i,jsx as e}from"@emotion/react/jsx-runtime";import"react/jsx-runtime";import"../../core/theme/Theme.js";import"react";import"../../types/enums.js";import"../pricing/clubOffer/ClubOfferTag.js";import"../pricing/discount/styled.js";import"../pricing/styles.js";import{Tooltip as t}from"../tooltip/Tooltip.js";import"../atoms/PriceLabel/PriceLabel.js";import"../atoms/ClubPriceMemberLabel/ClubPriceMemberLabel.styled.js";import"../atoms/HorizontalDivider/HorizontalDivider.js";import{Icon as r}from"../atoms/Icon/Icon.js";import"../atoms/Image/styled.js";import"../atoms/PriceLabelV2/PriceLabelV2.js";import"../atoms/Toggle/toggle.styled.js";import l from"./ColorRadioGroup.js";import{renderOptions as s}from"./SingleColorPicker.js";import{ColorPickerWrapper as n,NumericTooltip as
|
|
1
|
+
import{__assign as o}from"tslib";import{jsxs as i,jsx as e}from"@emotion/react/jsx-runtime";import"react/jsx-runtime";import"../../core/theme/Theme.js";import"react";import"../../types/enums.js";import"../pricing/clubOffer/ClubOfferTag.js";import"../pricing/discount/styled.js";import"../pricing/styles.js";import{Tooltip as t}from"../tooltip/Tooltip.js";import"../atoms/PriceLabel/PriceLabel.js";import"../atoms/ClubPriceMemberLabel/ClubPriceMemberLabel.styled.js";import"../atoms/HorizontalDivider/HorizontalDivider.js";import{Icon as r}from"../atoms/Icon/Icon.js";import"../atoms/Image/styled.js";import"../atoms/PriceLabelV2/PriceLabelV2.js";import"../atoms/Toggle/toggle.styled.js";import l from"./ColorRadioGroup.js";import{renderOptions as s}from"./SingleColorPicker.js";import{ColorPickerWrapper as n,TooltipContent as a,NumericTooltip as m}from"./styles/ColorPickerwithTootip.styled.js";var d=function(d){var c,p=d.options,v=void 0===p?[]:p,u=d.selectedValue,h=d.label,b=d.onChange,g=d.inline,j=void 0!==g&&g,f=d.maxVisibleOptions,C=void 0===f?5:f,w=d.showCross,y=d.className,L=d.tooltipOptions,P=d.translatedLabels,I=v.slice(0,C),x=v.slice(C),T=(null!=L?L:{}).showCloseIcon,O=(null==L?void 0:L.numeric)?null==x?void 0:x.length:0,N=u?null!==(c=null==P?void 0:P[u.label])&&void 0!==c?c:u.label:void 0;return i(n,o({className:y,value:u,onChange:b,css:{flexDirection:j?"row":"column",alignItems:j?"center":"start"}},{children:[e(l.Label,{label:h,values:N&&!j?N:void 0},void 0),i(l.OptionsContainer,o({css:{marginTop:j?"0":"0.63rem",marginLeft:j?"1.5rem":"0"},"data-testid":"radio-group-options-container"},{children:[s(I,w,void 0,P),!!x.length&&e("div",o({style:{display:"flex",alignItems:"center",justifyContent:"center"}},{children:e(t,o({showCloseIcon:T,position:1,elementContent:e(a,o({className:"tooltip-content"},{children:s(x,w,void 0,P)}),void 0),withArrow:!0},{children:(null==L?void 0:L.numeric)?i(m,o({"data-testid":"numeric-tooltip"},{children:["+",O]}),void 0):e("div",o({className:"arrow","data-testid":"tooltip-arrow"},{children:e(r,{name:"arrows/chevron_down",width:1,height:1},void 0)}),void 0)}),void 0)}),void 0)]}),void 0)]}),void 0)};export{d as default};
|
|
2
2
|
//# sourceMappingURL=ColorPickerWithTooltip.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{__makeTemplateObject as n}from"tslib";import
|
|
1
|
+
import{__makeTemplateObject as n}from"tslib";import e from"@emotion/styled";import t from"../ColorRadioGroup.js";var i,o,r,l=e(t)(i||(i=n(["\n position: relative;\n max-width: 300px;\n\n .tooltip-container {\n position: absolute;\n transform: translateX(-30%);\n &::before,\n &::after {\n left: 80%;\n }\n }\n\n .arrow {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-bottom: 10px;\n }\n"],["\n position: relative;\n max-width: 300px;\n\n .tooltip-container {\n position: absolute;\n transform: translateX(-30%);\n &::before,\n &::after {\n left: 80%;\n }\n }\n\n .arrow {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-bottom: 10px;\n }\n"]))),a=e.div(o||(o=n(["\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n gap: 8px;\n\n > [role='radio'] {\n display: inline-flex;\n margin: 0;\n }\n"],["\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n gap: 8px;\n\n > [role='radio'] {\n display: inline-flex;\n margin: 0;\n }\n"]))),p=e.div(r||(r=n(["\n display: flex;\n flex-direction: column;\n align-items: center;\n\n font-size: 12px;\n font-weight: 400;\n line-height: 20px;\n text-align: center;\n height: 100%;\n"],["\n display: flex;\n flex-direction: column;\n align-items: center;\n\n font-size: 12px;\n font-weight: 400;\n line-height: 20px;\n text-align: center;\n height: 100%;\n"])));export{l as ColorPickerWrapper,p as NumericTooltip,a as TooltipContent};
|
|
2
2
|
//# sourceMappingURL=ColorPickerwithTootip.styled.js.map
|
package/build/index.d.ts
CHANGED
|
@@ -1364,11 +1364,12 @@ declare const AssetsProvider: FC<{
|
|
|
1364
1364
|
}>;
|
|
1365
1365
|
declare const useThemeAssets: () => ThemeAssets;
|
|
1366
1366
|
|
|
1367
|
+
declare type CheckboxSize = ComponentSize.Large | ComponentSize.Medium | ComponentSize.Small;
|
|
1367
1368
|
interface CheckboxProps {
|
|
1368
1369
|
disabled?: boolean;
|
|
1369
1370
|
onChange: (checked: boolean) => void;
|
|
1370
|
-
size?:
|
|
1371
|
-
sizeLabel?:
|
|
1371
|
+
size?: CheckboxSize;
|
|
1372
|
+
sizeLabel?: CheckboxSize;
|
|
1372
1373
|
colorLabel?: string;
|
|
1373
1374
|
text: string;
|
|
1374
1375
|
checked?: boolean;
|
|
@@ -1378,6 +1379,7 @@ interface CheckboxProps {
|
|
|
1378
1379
|
backgroundImage?: string;
|
|
1379
1380
|
variant: 'primary' | 'secondary' | 'color';
|
|
1380
1381
|
hasHightligthBorder?: boolean;
|
|
1382
|
+
ariaLabel?: string;
|
|
1381
1383
|
}
|
|
1382
1384
|
declare const Checkbox: react__default.FC<CheckboxProps>;
|
|
1383
1385
|
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),n=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),n=require("react/jsx-runtime"),o=require("@emotion/styled"),t=require("../../core/theme/Theme.js"),i=require("../../types/enums.js"),r=require("../icons/index.js"),a=require("../shared/label/label.js"),s=require("./styles.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l,d,u=c(o),h=u.default.div(l||(l=e.__makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n user-select: none;\n position: relative;\n"],["\n display: flex;\n align-items: center;\n justify-content: center;\n width: fit-content;\n user-select: none;\n position: relative;\n"]))),b=function(e,n){if(!e&&!n)return!1;var o=(null==e?void 0:e.toLowerCase().trim())||"",t=(null==n?void 0:n.toLowerCase().trim())||"";return o.includes("white")||"#fff"===o||"#ffffff"===o||"white"===o||"#daa070"===o||"#f1cb75"===o||o.includes("beige")||o.includes("latte")||o.includes("sand")||("white"===t||"beige"===t||"latte"===t||"sand"===t)},f=u.default.div(s.CustomCheckboxStyles.baseStyles,(function(e){var n,o=e.backgroundImage?"\n background-image: url(".concat(e.backgroundImage,");\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n "):"",t=e.backgroundColor?"background-color: ".concat(e.backgroundColor,";"):"",i=b(null===(n=e.backgroundColor)||void 0===n?void 0:n.toString(),e.text)?"\n svg {\n path {\n fill: var(--colors-shades-black-color);\n }\n }":"",r=e.hasHightligthBorder?"border: 0.27px var(--colors-shades-300-color) solid;":"";return[s.CustomCheckboxStyles[e.size](e.theme),s.CustomCheckboxStyles[e.variant](e.theme,e.isChecked,e.disabled),"\n ".concat(o,"\n ").concat(t,"\n ").concat(i,"\n ").concat(r)]})),g=u.default.input(d||(d=e.__makeTemplateObject(["\n position: absolute;\n height: 100%;\n width: 100%;\n margin: 0;\n opacity: 0;\n cursor: ",";\n\n &:focus-visible {\n outline: none;\n }\n\n &:focus-visible + div {\n outline: 2px solid var(--colors-shades-700-color);\n outline-offset: 2px;\n ","\n }\n"],["\n position: absolute;\n height: 100%;\n width: 100%;\n margin: 0;\n opacity: 0;\n cursor: ",";\n\n &:focus-visible {\n outline: none;\n }\n\n &:focus-visible + div {\n outline: 2px solid var(--colors-shades-700-color);\n outline-offset: 2px;\n ","\n }\n"])),(function(e){return e.disabled?"not-allowed":"pointer"}),(function(e){return e.$isColorVariant&&"border-radius: 50%;"}));exports.Checkbox=function(o){var s=o.disabled,c=void 0!==s&&s,l=o.onChange,d=o.size,u=void 0===d?i.ComponentSize.Medium:d,v=o.sizeLabel,k=void 0===v?i.ComponentSize.Medium:v,m=o.colorLabel,p=o.text,x=o.checked,C=void 0!==x&&x,j=o.id,y=o.variant,w=o.blockUncheck,_=o.backgroundColor,q=o.backgroundImage,z=o.hasHightligthBorder,S=void 0!==z&&z,I=o.ariaLabel,L=t.useTheme(),T="color"===y;return n.jsxs(h,{children:[n.jsx(g,{type:"checkbox",checked:C,disabled:c,onChange:function(e){c||!1===e.target.checked&&w?e.preventDefault():l(e.target.checked)},id:j,"aria-label":I,$isColorVariant:T},void 0),n.jsx(f,e.__assign({theme:L,size:u,disabled:c,isChecked:C,"data-testid":"checkbox",variant:y,backgroundColor:_,backgroundImage:q,text:p,hasHightligthBorder:S},{children:C&&n.jsx(r.Icon.Actions.Check,{fill:b(_,p)?L.colors.shades.black.color:L.colors.shades.white.color},void 0)}),void 0),n.jsx(a,e.__assign({"data-testid":"checkbox-text",size:k,style:{color:m||L.colors.shades[700].color},variant:C?"demi":"regular",htmlFor:j,disabled:c},{children:p}),void 0)]},void 0)};
|
|
2
2
|
//# sourceMappingURL=Checkbox.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("tslib"),i=require("@emotion/react/jsx-runtime");require("react/jsx-runtime"),require("../../core/theme/Theme.js"),require("react"),require("../../types/enums.js"),require("../pricing/clubOffer/ClubOfferTag.js"),require("../pricing/discount/styled.js"),require("../pricing/styles.js");var r=require("../tooltip/Tooltip.js");require("../atoms/PriceLabel/PriceLabel.js"),require("../atoms/ClubPriceMemberLabel/ClubPriceMemberLabel.styled.js"),require("../atoms/HorizontalDivider/HorizontalDivider.js");var
|
|
1
|
+
"use strict";var e=require("tslib"),i=require("@emotion/react/jsx-runtime");require("react/jsx-runtime"),require("../../core/theme/Theme.js"),require("react"),require("../../types/enums.js"),require("../pricing/clubOffer/ClubOfferTag.js"),require("../pricing/discount/styled.js"),require("../pricing/styles.js");var r=require("../tooltip/Tooltip.js");require("../atoms/PriceLabel/PriceLabel.js"),require("../atoms/ClubPriceMemberLabel/ClubPriceMemberLabel.styled.js"),require("../atoms/HorizontalDivider/HorizontalDivider.js");var o=require("../atoms/Icon/Icon.js");require("../atoms/Image/styled.js"),require("../atoms/PriceLabelV2/PriceLabelV2.js"),require("../atoms/Toggle/toggle.styled.js");var s=require("./ColorRadioGroup.js"),t=require("./SingleColorPicker.js"),l=require("./styles/ColorPickerwithTootip.styled.js");module.exports=function(n){var a,d=n.options,c=void 0===d?[]:d,u=n.selectedValue,m=n.label,v=n.onChange,p=n.inline,j=void 0!==p&&p,g=n.maxVisibleOptions,h=void 0===g?5:g,b=n.showCross,q=n.className,C=n.tooltipOptions,x=n.translatedLabels,_=c.slice(0,h),w=c.slice(h),y=(null!=C?C:{}).showCloseIcon,f=(null==C?void 0:C.numeric)?null==w?void 0:w.length:0,L=u?null!==(a=null==x?void 0:x[u.label])&&void 0!==a?a:u.label:void 0;return i.jsxs(l.ColorPickerWrapper,e.__assign({className:q,value:u,onChange:v,css:{flexDirection:j?"row":"column",alignItems:j?"center":"start"}},{children:[i.jsx(s.Label,{label:m,values:L&&!j?L:void 0},void 0),i.jsxs(s.OptionsContainer,e.__assign({css:{marginTop:j?"0":"0.63rem",marginLeft:j?"1.5rem":"0"},"data-testid":"radio-group-options-container"},{children:[t.renderOptions(_,b,void 0,x),!!w.length&&i.jsx("div",e.__assign({style:{display:"flex",alignItems:"center",justifyContent:"center"}},{children:i.jsx(r.Tooltip,e.__assign({showCloseIcon:y,position:1,elementContent:i.jsx(l.TooltipContent,e.__assign({className:"tooltip-content"},{children:t.renderOptions(w,b,void 0,x)}),void 0),withArrow:!0},{children:(null==C?void 0:C.numeric)?i.jsxs(l.NumericTooltip,e.__assign({"data-testid":"numeric-tooltip"},{children:["+",f]}),void 0):i.jsx("div",e.__assign({className:"arrow","data-testid":"tooltip-arrow"},{children:i.jsx(o.Icon,{name:"arrows/chevron_down",width:1,height:1},void 0)}),void 0)}),void 0)}),void 0)]}),void 0)]}),void 0)};
|
|
2
2
|
//# sourceMappingURL=ColorPickerWithTooltip.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("tslib"),e=require("@emotion/styled"),t=require("../ColorRadioGroup.js");function i(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var o,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("tslib"),e=require("@emotion/styled"),t=require("../ColorRadioGroup.js");function i(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var r,o,l,a=i(e),p=a.default(t)(r||(r=n.__makeTemplateObject(["\n position: relative;\n max-width: 300px;\n\n .tooltip-container {\n position: absolute;\n transform: translateX(-30%);\n &::before,\n &::after {\n left: 80%;\n }\n }\n\n .arrow {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-bottom: 10px;\n }\n"],["\n position: relative;\n max-width: 300px;\n\n .tooltip-container {\n position: absolute;\n transform: translateX(-30%);\n &::before,\n &::after {\n left: 80%;\n }\n }\n\n .arrow {\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n margin-bottom: 10px;\n }\n"]))),s=a.default.div(o||(o=n.__makeTemplateObject(["\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n gap: 8px;\n\n > [role='radio'] {\n display: inline-flex;\n margin: 0;\n }\n"],["\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n gap: 8px;\n\n > [role='radio'] {\n display: inline-flex;\n margin: 0;\n }\n"]))),f=a.default.div(l||(l=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n\n font-size: 12px;\n font-weight: 400;\n line-height: 20px;\n text-align: center;\n height: 100%;\n"],["\n display: flex;\n flex-direction: column;\n align-items: center;\n\n font-size: 12px;\n font-weight: 400;\n line-height: 20px;\n text-align: center;\n height: 100%;\n"])));exports.ColorPickerWrapper=p,exports.NumericTooltip=f,exports.TooltipContent=s;
|
|
2
2
|
//# sourceMappingURL=ColorPickerwithTootip.styled.js.map
|
package/package.json
CHANGED