@activecollab/components 1.0.48 → 1.0.49
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/dist/cjs/components/CounterButton/CounterButton.js +1 -1
- package/dist/cjs/components/CounterButton/CounterButton.js.map +1 -1
- package/dist/cjs/components/CounterButton/Styles.js +1 -1
- package/dist/cjs/components/CounterButton/Styles.js.map +1 -1
- package/dist/esm/components/CounterButton/CounterButton.js +1 -1
- package/dist/esm/components/CounterButton/CounterButton.js.map +1 -1
- package/dist/esm/components/CounterButton/Styles.js +1 -1
- package/dist/esm/components/CounterButton/Styles.js.map +1 -1
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -59,7 +59,7 @@ var CounterButton = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
59
59
|
color: "secondary",
|
|
60
60
|
weight: "medium",
|
|
61
61
|
className: "c-counter-button__label",
|
|
62
|
-
$active: active
|
|
62
|
+
$active: counter > 0 || active
|
|
63
63
|
}, label), counter > 0 ? /*#__PURE__*/_react.default.createElement(_Styles.StyledCounterButtonCounter, {
|
|
64
64
|
className: "c-counter-button__counter"
|
|
65
65
|
}, counter) : null), counter > 0 ? /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/CounterButton/CounterButton.tsx"],"names":["CounterButton","ref","label","icon","active","counter","tooltipText","onClearAll","className","args","React","cloneElement","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;AAwBO,IAAMA,aAAa,gBAAG,uBAC3B,gBAWEC,GAXF,EAYK;AAAA,MAVDC,KAUC,QAVDA,KAUC;AAAA,MATDC,IASC,QATDA,IASC;AAAA,MARDC,MAQC,QARDA,MAQC;AAAA,0BAPDC,OAOC;AAAA,MAPDA,OAOC,6BAPS,CAOT;AAAA,MANDC,WAMC,QANDA,WAMC;AAAA,MALDC,UAKC,QALDA,UAKC;AAAA,MAJDC,SAIC,QAJDA,SAIC;AAAA,MAHEC,IAGF;;AACH,sBACE;AAAK,IAAA,SAAS,EAAE,yBAAW,4BAAX,EAAyCD,SAAzC;AAAhB,kBACE,6BAAC,2BAAD;AACE,IAAA,SAAS,EAAE,yBAAW,kBAAX,EAA+B;AACxC,oCAA8BH;AADU,KAA/B;AADb,KAIMI,IAJN;AAKE,IAAA,GAAG,EAAER,GALP;AAME,IAAA,OAAO,EAAE,WANX;AAOE,IAAA,OAAO,EAAEI,OAAO,GAAG,CAAV,IAAeD,MAP1B;AAQE,IAAA,SAAS,EAAEC,OAAO,GAAG;AARvB,MAUGF,IAAI,iBACHO,eAAMC,YAAN,CAAmBR,IAAnB,EAAyB;AACvBK,IAAAA,SAAS,EAAE,yBAAW,wBAAX;AADY,GAAzB,CAXJ,EAcGN,KAAK,iBACJ,6BAAC,gCAAD;AACE,IAAA,KAAK,EAAC,WADR;AAEE,IAAA,MAAM,EAAC,QAFT;AAGE,IAAA,SAAS,EAAE,yBAHb;AAIE,IAAA,OAAO,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/CounterButton/CounterButton.tsx"],"names":["CounterButton","ref","label","icon","active","counter","tooltipText","onClearAll","className","args","React","cloneElement","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;AAwBO,IAAMA,aAAa,gBAAG,uBAC3B,gBAWEC,GAXF,EAYK;AAAA,MAVDC,KAUC,QAVDA,KAUC;AAAA,MATDC,IASC,QATDA,IASC;AAAA,MARDC,MAQC,QARDA,MAQC;AAAA,0BAPDC,OAOC;AAAA,MAPDA,OAOC,6BAPS,CAOT;AAAA,MANDC,WAMC,QANDA,WAMC;AAAA,MALDC,UAKC,QALDA,UAKC;AAAA,MAJDC,SAIC,QAJDA,SAIC;AAAA,MAHEC,IAGF;;AACH,sBACE;AAAK,IAAA,SAAS,EAAE,yBAAW,4BAAX,EAAyCD,SAAzC;AAAhB,kBACE,6BAAC,2BAAD;AACE,IAAA,SAAS,EAAE,yBAAW,kBAAX,EAA+B;AACxC,oCAA8BH;AADU,KAA/B;AADb,KAIMI,IAJN;AAKE,IAAA,GAAG,EAAER,GALP;AAME,IAAA,OAAO,EAAE,WANX;AAOE,IAAA,OAAO,EAAEI,OAAO,GAAG,CAAV,IAAeD,MAP1B;AAQE,IAAA,SAAS,EAAEC,OAAO,GAAG;AARvB,MAUGF,IAAI,iBACHO,eAAMC,YAAN,CAAmBR,IAAnB,EAAyB;AACvBK,IAAAA,SAAS,EAAE,yBAAW,wBAAX;AADY,GAAzB,CAXJ,EAcGN,KAAK,iBACJ,6BAAC,gCAAD;AACE,IAAA,KAAK,EAAC,WADR;AAEE,IAAA,MAAM,EAAC,QAFT;AAGE,IAAA,SAAS,EAAE,yBAHb;AAIE,IAAA,OAAO,EAAEG,OAAO,GAAG,CAAV,IAAeD;AAJ1B,KAMGF,KANH,CAfJ,EAwBGG,OAAO,GAAG,CAAV,gBACC,6BAAC,kCAAD;AAA4B,IAAA,SAAS,EAAE;AAAvC,KACGA,OADH,CADD,GAIG,IA5BN,CADF,EA+BGA,OAAO,GAAG,CAAV,gBACC,6BAAC,gBAAD;AACE,IAAA,KAAK,YAAKC,WAAL,CADP;AAEE,IAAA,sBAAsB,EAAC;AAFzB,kBAIE,6BAAC,gCAAD;AACE,IAAA,OAAO,EAAC,cADV;AAEE,IAAA,SAAS,EAAC,yBAFZ;AAGE,IAAA,OAAO,EAAEC;AAHX,kBAKE,6BAAC,mBAAD,OALF,CAJF,CADD,GAaG,IA5CN,CADF;AAgDD,CA9D0B,CAAtB;;AAiEPP,aAAa,CAACY,WAAd,GAA4B,eAA5B","sourcesContent":["import React, { forwardRef, ReactElement } from \"react\";\nimport classNames from \"classnames\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport CloseSmallIcon from \"../Icons/collection/CloseSmall\";\nimport {\n StyledCounterButton,\n StyledCounterButtonCounter,\n StyledCounterButtonLabel,\n StyledCounterButtonReset,\n} from \"./Styles\";\n\ninterface ICounterButtonProps {\n /** Set active state */\n active?: boolean;\n /** Label for value */\n label?: string;\n /** Icon */\n icon?: ReactElement;\n /** Number of applied filters */\n counter?: number;\n /** OnClearAll callback */\n onClearAll: () => void;\n /** Tooltip content */\n tooltipText?: string;\n /** Applies passed classes */\n className?: string;\n}\n\nexport const CounterButton = forwardRef<HTMLButtonElement, ICounterButtonProps>(\n (\n {\n label,\n icon,\n active,\n counter = 0,\n tooltipText,\n onClearAll,\n className,\n ...args\n },\n ref\n ) => {\n return (\n <div className={classNames(\"tw-flex ac-font box-sizing\", className)}>\n <StyledCounterButton\n className={classNames(\"c-counter-button\", {\n \"c-counter-button__selected\": counter,\n })}\n {...args}\n ref={ref}\n variant={\"text gray\"}\n $active={counter > 0 || active}\n $selected={counter > 0}\n >\n {icon &&\n React.cloneElement(icon, {\n className: classNames(\"c-counter-button__icon\"),\n })}\n {label && (\n <StyledCounterButtonLabel\n color=\"secondary\"\n weight=\"medium\"\n className={\"c-counter-button__label\"}\n $active={counter > 0 || active}\n >\n {label}\n </StyledCounterButtonLabel>\n )}\n {counter > 0 ? (\n <StyledCounterButtonCounter className={\"c-counter-button__counter\"}>\n {counter}\n </StyledCounterButtonCounter>\n ) : null}\n </StyledCounterButton>\n {counter > 0 ? (\n <Tooltip\n title={`${tooltipText}`}\n popperTooltipClassName=\"z-index-1300\"\n >\n <StyledCounterButtonReset\n variant=\"text colored\"\n className=\"c-counter-button__reset\"\n onClick={onClearAll}\n >\n <CloseSmallIcon />\n </StyledCounterButtonReset>\n </Tooltip>\n ) : null}\n </div>\n );\n }\n);\n\nCounterButton.displayName = \"CounterButton\";\n"],"file":"CounterButton.js"}
|
|
@@ -44,7 +44,7 @@ StyledCounterButtonReset.displayName = "StyledCounterButtonReset";
|
|
|
44
44
|
var StyledCounterButtonLabel = (0, _styledComponents.default)(_Body.Body2).withConfig({
|
|
45
45
|
displayName: "Styles__StyledCounterButtonLabel",
|
|
46
46
|
componentId: "sc-1ecrcba-3"
|
|
47
|
-
})(["", " ", ":hover
|
|
47
|
+
})(["", " ", ":hover &&{", "}", ""], {
|
|
48
48
|
"pointerEvents": "none"
|
|
49
49
|
}, StyledCounterButton, function (props) {
|
|
50
50
|
return !props.$active && (0, _styledComponents.css)(["color:var(--color-theme-900);"]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/CounterButton/Styles.ts"],"names":["StyledCounterButton","Button","props","$active","css","$selected","displayName","StyledCounterButtonCounter","styled","div","StyledCounterButtonReset","StyledCounterButtonLabel","Body2"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;;;;;AAOO,IAAMA,mBAAmB,GAAG,+BAAOC,cAAP,CAAH;AAAA;AAAA;AAAA,kBAC5B,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,QACAC,qBADA,iGADA;AAAA,CAD4B,EAe5B,UAACF,KAAD;AAAA,SACAA,KAAK,CAACG,SAAN,QACAD,qBADA,wGADA;AAAA,CAf4B,CAAzB;;AAwBPJ,mBAAmB,CAACM,WAApB,GAAkC,qBAAlC;;AAEO,IAAMC,0BAA0B,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,6MAAhC;;;AAaPF,0BAA0B,CAACD,WAA3B,GAAyC,4BAAzC;AAEO,IAAMI,wBAAwB,GAAG,+BAAOT,cAAP,CAAH;AAAA;AAAA;AAAA,+MAA9B;;AAYPS,wBAAwB,CAACJ,WAAzB,GAAuC,0BAAvC;AAEO,IAAMK,wBAAwB,GAAG,+BAAOC,WAAP,CAAH;AAAA;AAAA;AAAA,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/CounterButton/Styles.ts"],"names":["StyledCounterButton","Button","props","$active","css","$selected","displayName","StyledCounterButtonCounter","styled","div","StyledCounterButtonReset","StyledCounterButtonLabel","Body2"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;;;;;AAOO,IAAMA,mBAAmB,GAAG,+BAAOC,cAAP,CAAH;AAAA;AAAA;AAAA,kBAC5B,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,QACAC,qBADA,iGADA;AAAA,CAD4B,EAe5B,UAACF,KAAD;AAAA,SACAA,KAAK,CAACG,SAAN,QACAD,qBADA,wGADA;AAAA,CAf4B,CAAzB;;AAwBPJ,mBAAmB,CAACM,WAApB,GAAkC,qBAAlC;;AAEO,IAAMC,0BAA0B,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,6MAAhC;;;AAaPF,0BAA0B,CAACD,WAA3B,GAAyC,4BAAzC;AAEO,IAAMI,wBAAwB,GAAG,+BAAOT,cAAP,CAAH;AAAA;AAAA;AAAA,+MAA9B;;AAYPS,wBAAwB,CAACJ,WAAzB,GAAuC,0BAAvC;AAEO,IAAMK,wBAAwB,GAAG,+BAAOC,WAAP,CAAH;AAAA;AAAA;AAAA,qCAC/B;AAAA;AAAA,CAD+B,EAGjCZ,mBAHiC,EAI/B,UAACE,KAAD;AAAA,SACA,CAACA,KAAK,CAACC,OAAP,QACAC,qBADA,oCADA;AAAA,CAJ+B,EAWjC,UAACF,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,QACAC,qBADA,kCADA;AAAA,CAXiC,CAA9B;;AAkBPO,wBAAwB,CAACL,WAAzB,GAAuC,0BAAvC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { Body2 } from \"../Typography/Variants/Body2\";\nimport { Button } from \"../Button/Button\";\n\ninterface StyledCounterButtonProps {\n $active?: boolean;\n $selected?: boolean;\n}\n\nexport const StyledCounterButton = styled(Button)<StyledCounterButtonProps>`\n ${(props) =>\n props.$active &&\n css`\n padding: 0 8px;\n\n svg {\n fill: var(--color-primary);\n }\n\n &:hover {\n background: var(--color-primary-300);\n }\n `}\n\n ${(props) =>\n props.$selected &&\n css`\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n background-color: var(--color-primary-200);\n `}\n`;\n\nStyledCounterButton.displayName = \"StyledCounterButton\";\n\nexport const StyledCounterButtonCounter = styled.div<{ $selected?: boolean }>`\n border-radius: 50%;\n background-color: var(--color-primary);\n color: var(--page-paper-main);\n line-height: 15px;\n width: 15px;\n font-weight: bold;\n font-size: 10px;\n text-align: center;\n margin-left: 4px;\n margin-right: -6px;\n`;\n\nStyledCounterButtonCounter.displayName = \"StyledCounterButtonCounter\";\n\nexport const StyledCounterButtonReset = styled(Button)`\n background-color: var(--color-primary-200);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n &:hover {\n background-color: var(--color-primary-300);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n`;\n\nStyledCounterButtonReset.displayName = \"StyledCounterButtonReset\";\n\nexport const StyledCounterButtonLabel = styled(Body2)<{ $active?: boolean }>`\n ${tw`tw-pointer-events-none`}\n\n ${StyledCounterButton}:hover && {\n ${(props) =>\n !props.$active &&\n css`\n color: var(--color-theme-900);\n `}\n }\n\n ${(props) =>\n props.$active &&\n css`\n color: var(--color-primary);\n `}\n`;\n\nStyledCounterButtonLabel.displayName = \"StyledCounterButtonLabel\";\n"],"file":"Styles.js"}
|
|
@@ -34,7 +34,7 @@ export var CounterButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
34
34
|
color: "secondary",
|
|
35
35
|
weight: "medium",
|
|
36
36
|
className: "c-counter-button__label",
|
|
37
|
-
$active: active
|
|
37
|
+
$active: counter > 0 || active
|
|
38
38
|
}, label), counter > 0 ? /*#__PURE__*/React.createElement(StyledCounterButtonCounter, {
|
|
39
39
|
className: "c-counter-button__counter"
|
|
40
40
|
}, counter) : null), counter > 0 ? /*#__PURE__*/React.createElement(Tooltip, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/CounterButton/CounterButton.tsx"],"names":["React","forwardRef","classNames","Tooltip","CloseSmallIcon","StyledCounterButton","StyledCounterButtonCounter","StyledCounterButtonLabel","StyledCounterButtonReset","CounterButton","ref","label","icon","active","counter","tooltipText","onClearAll","className","args","cloneElement","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IAAgBC,UAAhB,QAAgD,OAAhD;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,OAAT,QAAwB,oBAAxB;AACA,OAAOC,cAAP,MAA2B,gCAA3B;AACA,SACEC,mBADF,EAEEC,0BAFF,EAGEC,wBAHF,EAIEC,wBAJF,QAKO,UALP;AAwBA,OAAO,IAAMC,aAAa,gBAAGR,UAAU,CACrC,gBAWES,GAXF,EAYK;AAAA,MAVDC,KAUC,QAVDA,KAUC;AAAA,MATDC,IASC,QATDA,IASC;AAAA,MARDC,MAQC,QARDA,MAQC;AAAA,0BAPDC,OAOC;AAAA,MAPDA,OAOC,6BAPS,CAOT;AAAA,MANDC,WAMC,QANDA,WAMC;AAAA,MALDC,UAKC,QALDA,UAKC;AAAA,MAJDC,SAIC,QAJDA,SAIC;AAAA,MAHEC,IAGF;;AACH,sBACE;AAAK,IAAA,SAAS,EAAEhB,UAAU,CAAC,4BAAD,EAA+Be,SAA/B;AAA1B,kBACE,oBAAC,mBAAD;AACE,IAAA,SAAS,EAAEf,UAAU,CAAC,kBAAD,EAAqB;AACxC,oCAA8BY;AADU,KAArB;AADvB,KAIMI,IAJN;AAKE,IAAA,GAAG,EAAER,GALP;AAME,IAAA,OAAO,EAAE,WANX;AAOE,IAAA,OAAO,EAAEI,OAAO,GAAG,CAAV,IAAeD,MAP1B;AAQE,IAAA,SAAS,EAAEC,OAAO,GAAG;AARvB,MAUGF,IAAI,iBACHZ,KAAK,CAACmB,YAAN,CAAmBP,IAAnB,EAAyB;AACvBK,IAAAA,SAAS,EAAEf,UAAU,CAAC,wBAAD;AADE,GAAzB,CAXJ,EAcGS,KAAK,iBACJ,oBAAC,wBAAD;AACE,IAAA,KAAK,EAAC,WADR;AAEE,IAAA,MAAM,EAAC,QAFT;AAGE,IAAA,SAAS,EAAE,yBAHb;AAIE,IAAA,OAAO,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/CounterButton/CounterButton.tsx"],"names":["React","forwardRef","classNames","Tooltip","CloseSmallIcon","StyledCounterButton","StyledCounterButtonCounter","StyledCounterButtonLabel","StyledCounterButtonReset","CounterButton","ref","label","icon","active","counter","tooltipText","onClearAll","className","args","cloneElement","displayName"],"mappings":";;;AAAA,OAAOA,KAAP,IAAgBC,UAAhB,QAAgD,OAAhD;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,SAASC,OAAT,QAAwB,oBAAxB;AACA,OAAOC,cAAP,MAA2B,gCAA3B;AACA,SACEC,mBADF,EAEEC,0BAFF,EAGEC,wBAHF,EAIEC,wBAJF,QAKO,UALP;AAwBA,OAAO,IAAMC,aAAa,gBAAGR,UAAU,CACrC,gBAWES,GAXF,EAYK;AAAA,MAVDC,KAUC,QAVDA,KAUC;AAAA,MATDC,IASC,QATDA,IASC;AAAA,MARDC,MAQC,QARDA,MAQC;AAAA,0BAPDC,OAOC;AAAA,MAPDA,OAOC,6BAPS,CAOT;AAAA,MANDC,WAMC,QANDA,WAMC;AAAA,MALDC,UAKC,QALDA,UAKC;AAAA,MAJDC,SAIC,QAJDA,SAIC;AAAA,MAHEC,IAGF;;AACH,sBACE;AAAK,IAAA,SAAS,EAAEhB,UAAU,CAAC,4BAAD,EAA+Be,SAA/B;AAA1B,kBACE,oBAAC,mBAAD;AACE,IAAA,SAAS,EAAEf,UAAU,CAAC,kBAAD,EAAqB;AACxC,oCAA8BY;AADU,KAArB;AADvB,KAIMI,IAJN;AAKE,IAAA,GAAG,EAAER,GALP;AAME,IAAA,OAAO,EAAE,WANX;AAOE,IAAA,OAAO,EAAEI,OAAO,GAAG,CAAV,IAAeD,MAP1B;AAQE,IAAA,SAAS,EAAEC,OAAO,GAAG;AARvB,MAUGF,IAAI,iBACHZ,KAAK,CAACmB,YAAN,CAAmBP,IAAnB,EAAyB;AACvBK,IAAAA,SAAS,EAAEf,UAAU,CAAC,wBAAD;AADE,GAAzB,CAXJ,EAcGS,KAAK,iBACJ,oBAAC,wBAAD;AACE,IAAA,KAAK,EAAC,WADR;AAEE,IAAA,MAAM,EAAC,QAFT;AAGE,IAAA,SAAS,EAAE,yBAHb;AAIE,IAAA,OAAO,EAAEG,OAAO,GAAG,CAAV,IAAeD;AAJ1B,KAMGF,KANH,CAfJ,EAwBGG,OAAO,GAAG,CAAV,gBACC,oBAAC,0BAAD;AAA4B,IAAA,SAAS,EAAE;AAAvC,KACGA,OADH,CADD,GAIG,IA5BN,CADF,EA+BGA,OAAO,GAAG,CAAV,gBACC,oBAAC,OAAD;AACE,IAAA,KAAK,OAAKC,WADZ;AAEE,IAAA,sBAAsB,EAAC;AAFzB,kBAIE,oBAAC,wBAAD;AACE,IAAA,OAAO,EAAC,cADV;AAEE,IAAA,SAAS,EAAC,yBAFZ;AAGE,IAAA,OAAO,EAAEC;AAHX,kBAKE,oBAAC,cAAD,OALF,CAJF,CADD,GAaG,IA5CN,CADF;AAgDD,CA9DoC,CAAhC;AAiEPP,aAAa,CAACW,WAAd,GAA4B,eAA5B","sourcesContent":["import React, { forwardRef, ReactElement } from \"react\";\nimport classNames from \"classnames\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport CloseSmallIcon from \"../Icons/collection/CloseSmall\";\nimport {\n StyledCounterButton,\n StyledCounterButtonCounter,\n StyledCounterButtonLabel,\n StyledCounterButtonReset,\n} from \"./Styles\";\n\ninterface ICounterButtonProps {\n /** Set active state */\n active?: boolean;\n /** Label for value */\n label?: string;\n /** Icon */\n icon?: ReactElement;\n /** Number of applied filters */\n counter?: number;\n /** OnClearAll callback */\n onClearAll: () => void;\n /** Tooltip content */\n tooltipText?: string;\n /** Applies passed classes */\n className?: string;\n}\n\nexport const CounterButton = forwardRef<HTMLButtonElement, ICounterButtonProps>(\n (\n {\n label,\n icon,\n active,\n counter = 0,\n tooltipText,\n onClearAll,\n className,\n ...args\n },\n ref\n ) => {\n return (\n <div className={classNames(\"tw-flex ac-font box-sizing\", className)}>\n <StyledCounterButton\n className={classNames(\"c-counter-button\", {\n \"c-counter-button__selected\": counter,\n })}\n {...args}\n ref={ref}\n variant={\"text gray\"}\n $active={counter > 0 || active}\n $selected={counter > 0}\n >\n {icon &&\n React.cloneElement(icon, {\n className: classNames(\"c-counter-button__icon\"),\n })}\n {label && (\n <StyledCounterButtonLabel\n color=\"secondary\"\n weight=\"medium\"\n className={\"c-counter-button__label\"}\n $active={counter > 0 || active}\n >\n {label}\n </StyledCounterButtonLabel>\n )}\n {counter > 0 ? (\n <StyledCounterButtonCounter className={\"c-counter-button__counter\"}>\n {counter}\n </StyledCounterButtonCounter>\n ) : null}\n </StyledCounterButton>\n {counter > 0 ? (\n <Tooltip\n title={`${tooltipText}`}\n popperTooltipClassName=\"z-index-1300\"\n >\n <StyledCounterButtonReset\n variant=\"text colored\"\n className=\"c-counter-button__reset\"\n onClick={onClearAll}\n >\n <CloseSmallIcon />\n </StyledCounterButtonReset>\n </Tooltip>\n ) : null}\n </div>\n );\n }\n);\n\nCounterButton.displayName = \"CounterButton\";\n"],"file":"CounterButton.js"}
|
|
@@ -23,7 +23,7 @@ StyledCounterButtonReset.displayName = "StyledCounterButtonReset";
|
|
|
23
23
|
export var StyledCounterButtonLabel = styled(Body2).withConfig({
|
|
24
24
|
displayName: "Styles__StyledCounterButtonLabel",
|
|
25
25
|
componentId: "sc-1ecrcba-3"
|
|
26
|
-
})(["", " ", ":hover
|
|
26
|
+
})(["", " ", ":hover &&{", "}", ""], {
|
|
27
27
|
"pointerEvents": "none"
|
|
28
28
|
}, StyledCounterButton, function (props) {
|
|
29
29
|
return !props.$active && css(["color:var(--color-theme-900);"]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/CounterButton/Styles.ts"],"names":["styled","css","Body2","Button","StyledCounterButton","props","$active","$selected","displayName","StyledCounterButtonCounter","div","StyledCounterButtonReset","StyledCounterButtonLabel"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,KAAT,QAAsB,8BAAtB;AACA,SAASC,MAAT,QAAuB,kBAAvB;AAOA,OAAO,IAAMC,mBAAmB,GAAGJ,MAAM,CAACG,MAAD,CAAT;AAAA;AAAA;AAAA,kBAC5B,UAACE,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,IACAL,GADA,gGADA;AAAA,CAD4B,EAe5B,UAACI,KAAD;AAAA,SACAA,KAAK,CAACE,SAAN,IACAN,GADA,uGADA;AAAA,CAf4B,CAAzB;AAwBPG,mBAAmB,CAACI,WAApB,GAAkC,qBAAlC;AAEA,OAAO,IAAMC,0BAA0B,GAAGT,MAAM,CAACU,GAAV;AAAA;AAAA;AAAA,6MAAhC;AAaPD,0BAA0B,CAACD,WAA3B,GAAyC,4BAAzC;AAEA,OAAO,IAAMG,wBAAwB,GAAGX,MAAM,CAACG,MAAD,CAAT;AAAA;AAAA;AAAA,+MAA9B;AAYPQ,wBAAwB,CAACH,WAAzB,GAAuC,0BAAvC;AAEA,OAAO,IAAMI,wBAAwB,GAAGZ,MAAM,CAACE,KAAD,CAAT;AAAA;AAAA;AAAA,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/CounterButton/Styles.ts"],"names":["styled","css","Body2","Button","StyledCounterButton","props","$active","$selected","displayName","StyledCounterButtonCounter","div","StyledCounterButtonReset","StyledCounterButtonLabel"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,KAAT,QAAsB,8BAAtB;AACA,SAASC,MAAT,QAAuB,kBAAvB;AAOA,OAAO,IAAMC,mBAAmB,GAAGJ,MAAM,CAACG,MAAD,CAAT;AAAA;AAAA;AAAA,kBAC5B,UAACE,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,IACAL,GADA,gGADA;AAAA,CAD4B,EAe5B,UAACI,KAAD;AAAA,SACAA,KAAK,CAACE,SAAN,IACAN,GADA,uGADA;AAAA,CAf4B,CAAzB;AAwBPG,mBAAmB,CAACI,WAApB,GAAkC,qBAAlC;AAEA,OAAO,IAAMC,0BAA0B,GAAGT,MAAM,CAACU,GAAV;AAAA;AAAA;AAAA,6MAAhC;AAaPD,0BAA0B,CAACD,WAA3B,GAAyC,4BAAzC;AAEA,OAAO,IAAMG,wBAAwB,GAAGX,MAAM,CAACG,MAAD,CAAT;AAAA;AAAA;AAAA,+MAA9B;AAYPQ,wBAAwB,CAACH,WAAzB,GAAuC,0BAAvC;AAEA,OAAO,IAAMI,wBAAwB,GAAGZ,MAAM,CAACE,KAAD,CAAT;AAAA;AAAA;AAAA,qCAC/B;AAAA;AAAA,CAD+B,EAGjCE,mBAHiC,EAI/B,UAACC,KAAD;AAAA,SACA,CAACA,KAAK,CAACC,OAAP,IACAL,GADA,mCADA;AAAA,CAJ+B,EAWjC,UAACI,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,IACAL,GADA,iCADA;AAAA,CAXiC,CAA9B;AAkBPW,wBAAwB,CAACJ,WAAzB,GAAuC,0BAAvC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { Body2 } from \"../Typography/Variants/Body2\";\nimport { Button } from \"../Button/Button\";\n\ninterface StyledCounterButtonProps {\n $active?: boolean;\n $selected?: boolean;\n}\n\nexport const StyledCounterButton = styled(Button)<StyledCounterButtonProps>`\n ${(props) =>\n props.$active &&\n css`\n padding: 0 8px;\n\n svg {\n fill: var(--color-primary);\n }\n\n &:hover {\n background: var(--color-primary-300);\n }\n `}\n\n ${(props) =>\n props.$selected &&\n css`\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n background-color: var(--color-primary-200);\n `}\n`;\n\nStyledCounterButton.displayName = \"StyledCounterButton\";\n\nexport const StyledCounterButtonCounter = styled.div<{ $selected?: boolean }>`\n border-radius: 50%;\n background-color: var(--color-primary);\n color: var(--page-paper-main);\n line-height: 15px;\n width: 15px;\n font-weight: bold;\n font-size: 10px;\n text-align: center;\n margin-left: 4px;\n margin-right: -6px;\n`;\n\nStyledCounterButtonCounter.displayName = \"StyledCounterButtonCounter\";\n\nexport const StyledCounterButtonReset = styled(Button)`\n background-color: var(--color-primary-200);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n &:hover {\n background-color: var(--color-primary-300);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n`;\n\nStyledCounterButtonReset.displayName = \"StyledCounterButtonReset\";\n\nexport const StyledCounterButtonLabel = styled(Body2)<{ $active?: boolean }>`\n ${tw`tw-pointer-events-none`}\n\n ${StyledCounterButton}:hover && {\n ${(props) =>\n !props.$active &&\n css`\n color: var(--color-theme-900);\n `}\n }\n\n ${(props) =>\n props.$active &&\n css`\n color: var(--color-primary);\n `}\n`;\n\nStyledCounterButtonLabel.displayName = \"StyledCounterButtonLabel\";\n"],"file":"Styles.js"}
|
package/dist/index.js
CHANGED
|
@@ -949,7 +949,7 @@
|
|
|
949
949
|
var StyledCounterButtonLabel = styled__default["default"](Body2).withConfig({
|
|
950
950
|
displayName: "Styles__StyledCounterButtonLabel",
|
|
951
951
|
componentId: "sc-1ecrcba-3"
|
|
952
|
-
})(["", " ", ":hover
|
|
952
|
+
})(["", " ", ":hover &&{", "}", ""], {
|
|
953
953
|
"pointerEvents": "none"
|
|
954
954
|
}, StyledCounterButton, function (props) {
|
|
955
955
|
return !props.$active && styled.css(["color:var(--color-theme-900);"]);
|
|
@@ -987,7 +987,7 @@
|
|
|
987
987
|
color: "secondary",
|
|
988
988
|
weight: "medium",
|
|
989
989
|
className: "c-counter-button__label",
|
|
990
|
-
$active: active
|
|
990
|
+
$active: counter > 0 || active
|
|
991
991
|
}, label), counter > 0 ? /*#__PURE__*/React__default["default"].createElement(StyledCounterButtonCounter, {
|
|
992
992
|
className: "c-counter-button__counter"
|
|
993
993
|
}, counter) : null), counter > 0 ? /*#__PURE__*/React__default["default"].createElement(Tooltip, {
|