@activecollab/components 1.0.156 → 1.0.157
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.d.ts +1 -1
- package/dist/esm/components/CounterButton/CounterButton.d.ts.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.d.ts.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
|
@@ -43,13 +43,13 @@ var CounterButton = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
43
43
|
args = _objectWithoutProperties(_ref, _excluded);
|
|
44
44
|
|
|
45
45
|
return /*#__PURE__*/_react.default.createElement(_Styles.StyledCounterButtonWrapper, {
|
|
46
|
+
ref: ref,
|
|
46
47
|
className: className
|
|
47
48
|
}, /*#__PURE__*/_react.default.createElement(_Styles.StyledCounterButton, _extends({
|
|
48
49
|
className: (0, _classnames.default)("c-counter-button", {
|
|
49
50
|
"c-counter-button__selected": counter
|
|
50
51
|
})
|
|
51
52
|
}, args, {
|
|
52
|
-
ref: ref,
|
|
53
53
|
variant: "text gray",
|
|
54
54
|
$active: counter > 0 || active,
|
|
55
55
|
$selected: counter > 0
|
|
@@ -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;;;;;;;;;;;;;;;;AAyBO,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,6BAAC,kCAAD;AAA4B,IAAA,SAAS,
|
|
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;;;;;;;;;;;;;;;;AAyBO,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,6BAAC,kCAAD;AAA4B,IAAA,GAAG,EAAER,GAAjC;AAAsC,IAAA,SAAS,EAAEO;AAAjD,kBACE,6BAAC,2BAAD;AACE,IAAA,SAAS,EAAE,yBAAW,kBAAX,EAA+B;AACxC,oCAA8BH;AADU,KAA/B;AADb,KAIMI,IAJN;AAKE,IAAA,OAAO,EAAE,WALX;AAME,IAAA,OAAO,EAAEJ,OAAO,GAAG,CAAV,IAAeD,MAN1B;AAOE,IAAA,SAAS,EAAEC,OAAO,GAAG;AAPvB,MASGF,IAAI,iBACHO,eAAMC,YAAN,CAAmBR,IAAnB,EAAyB;AACvBK,IAAAA,SAAS,EAAE,yBAAW,wBAAX;AADY,GAAzB,CAVJ,EAaGN,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,CAdJ,EAuBGG,OAAO,GAAG,CAAV,gBACC,6BAAC,kCAAD;AAA4B,IAAA,SAAS,EAAE;AAAvC,KACGA,OADH,CADD,GAIG,IA3BN,CADF,EA8BGA,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,IA3CN,CADF;AA+CD,CA7D0B,CAAtB;;AAgEPP,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 StyledCounterButtonWrapper,\n} from \"./Styles\";\n\nexport interface 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: (event?) => void;\n /** Tooltip content */\n tooltipText?: string;\n /** Applies passed classes */\n className?: string;\n}\n\nexport const CounterButton = forwardRef<HTMLDivElement, 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 <StyledCounterButtonWrapper ref={ref} className={className}>\n <StyledCounterButton\n className={classNames(\"c-counter-button\", {\n \"c-counter-button__selected\": counter,\n })}\n {...args}\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 </StyledCounterButtonWrapper>\n );\n }\n);\n\nCounterButton.displayName = \"CounterButton\";\n"],"file":"CounterButton.js"}
|
|
@@ -24,7 +24,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
24
24
|
var StyledCounterButtonWrapper = _styledComponents.default.div.withConfig({
|
|
25
25
|
displayName: "Styles__StyledCounterButtonWrapper",
|
|
26
26
|
componentId: "sc-1ecrcba-0"
|
|
27
|
-
})(["", " ", " ", ""], {
|
|
27
|
+
})(["", " ", " ", " width:fit-content;"], {
|
|
28
28
|
"display": "flex"
|
|
29
29
|
}, _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle);
|
|
30
30
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/CounterButton/Styles.ts"],"names":["StyledCounterButtonWrapper","styled","div","FontStyle","BoxSizingStyle","displayName","StyledCounterButton","Button","props","$active","css","$selected","StyledCounterButtonCounter","StyledCounterButtonReset","StyledCounterButtonLabel","Body2"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;;;;;AAOO,IAAMA,0BAA0B,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/CounterButton/Styles.ts"],"names":["StyledCounterButtonWrapper","styled","div","FontStyle","BoxSizingStyle","displayName","StyledCounterButton","Button","props","$active","css","$selected","StyledCounterButtonCounter","StyledCounterButtonReset","StyledCounterButtonLabel","Body2"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;;;;;AAOO,IAAMA,0BAA0B,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,0CACjC;AAAA;AAAA,CADiC,EAEnCC,oBAFmC,EAGnCC,8BAHmC,CAAhC;;;AAOPJ,0BAA0B,CAACK,WAA3B,GAAyC,4BAAzC;AAEO,IAAMC,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,CAACD,WAApB,GAAkC,qBAAlC;;AAEO,IAAMO,0BAA0B,GAAGX,0BAAOC,GAAV;AAAA;AAAA;AAAA,6MAAhC;;;AAaPU,0BAA0B,CAACP,WAA3B,GAAyC,4BAAzC;AAEO,IAAMQ,wBAAwB,GAAG,+BAAON,cAAP,CAAH;AAAA;AAAA;AAAA,+MAA9B;;AAYPM,wBAAwB,CAACR,WAAzB,GAAuC,0BAAvC;AAEO,IAAMS,wBAAwB,GAAG,+BAAOC,WAAP,CAAH;AAAA;AAAA;AAAA,qCAC/B;AAAA;AAAA,CAD+B,EAGjCT,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;;AAkBPI,wBAAwB,CAACT,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\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\ninterface StyledCounterButtonProps {\n $active?: boolean;\n $selected?: boolean;\n}\n\nexport const StyledCounterButtonWrapper = styled.div`\n ${tw`tw-flex`}\n ${FontStyle}\n ${BoxSizingStyle}\n width: fit-content;\n`;\n\nStyledCounterButtonWrapper.displayName = \"StyledCounterButtonWrapper\";\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"}
|
|
@@ -8,5 +8,5 @@ export interface ICounterButtonProps {
|
|
|
8
8
|
tooltipText?: string;
|
|
9
9
|
className?: string;
|
|
10
10
|
}
|
|
11
|
-
export declare const CounterButton: React.ForwardRefExoticComponent<ICounterButtonProps & React.RefAttributes<
|
|
11
|
+
export declare const CounterButton: React.ForwardRefExoticComponent<ICounterButtonProps & React.RefAttributes<HTMLDivElement>>;
|
|
12
12
|
//# sourceMappingURL=CounterButton.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CounterButton.d.ts","sourceRoot":"","sources":["../../../../src/components/CounterButton/CounterButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAc,YAAY,EAAE,MAAM,OAAO,CAAC;AAYxD,MAAM,WAAW,mBAAmB;IAElC,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,IAAI,CAAC,EAAE,YAAY,CAAC;IAEpB,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,UAAU,EAAE,CAAC,KAAK,CAAC,KAAA,KAAK,IAAI,CAAC;IAE7B,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,aAAa
|
|
1
|
+
{"version":3,"file":"CounterButton.d.ts","sourceRoot":"","sources":["../../../../src/components/CounterButton/CounterButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAc,YAAY,EAAE,MAAM,OAAO,CAAC;AAYxD,MAAM,WAAW,mBAAmB;IAElC,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,IAAI,CAAC,EAAE,YAAY,CAAC;IAEpB,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,UAAU,EAAE,CAAC,KAAK,CAAC,KAAA,KAAK,IAAI,CAAC;IAE7B,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,aAAa,4FA8DzB,CAAC"}
|
|
@@ -18,13 +18,13 @@ export var CounterButton = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
18
18
|
args = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
19
19
|
|
|
20
20
|
return /*#__PURE__*/React.createElement(StyledCounterButtonWrapper, {
|
|
21
|
+
ref: ref,
|
|
21
22
|
className: className
|
|
22
23
|
}, /*#__PURE__*/React.createElement(StyledCounterButton, _extends({
|
|
23
24
|
className: classNames("c-counter-button", {
|
|
24
25
|
"c-counter-button__selected": counter
|
|
25
26
|
})
|
|
26
27
|
}, args, {
|
|
27
|
-
ref: ref,
|
|
28
28
|
variant: "text gray",
|
|
29
29
|
$active: counter > 0 || active,
|
|
30
30
|
$selected: counter > 0
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/CounterButton/CounterButton.tsx"],"names":["React","forwardRef","classNames","Tooltip","CloseSmallIcon","StyledCounterButton","StyledCounterButtonCounter","StyledCounterButtonLabel","StyledCounterButtonReset","StyledCounterButtonWrapper","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,EAKEC,0BALF,QAMO,UANP;AAyBA,OAAO,IAAMC,aAAa,gBAAGT,UAAU,CACrC,gBAWEU,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,oBAAC,0BAAD;AAA4B,IAAA,SAAS,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/CounterButton/CounterButton.tsx"],"names":["React","forwardRef","classNames","Tooltip","CloseSmallIcon","StyledCounterButton","StyledCounterButtonCounter","StyledCounterButtonLabel","StyledCounterButtonReset","StyledCounterButtonWrapper","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,EAKEC,0BALF,QAMO,UANP;AAyBA,OAAO,IAAMC,aAAa,gBAAGT,UAAU,CACrC,gBAWEU,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,oBAAC,0BAAD;AAA4B,IAAA,GAAG,EAAER,GAAjC;AAAsC,IAAA,SAAS,EAAEO;AAAjD,kBACE,oBAAC,mBAAD;AACE,IAAA,SAAS,EAAEhB,UAAU,CAAC,kBAAD,EAAqB;AACxC,oCAA8Ba;AADU,KAArB;AADvB,KAIMI,IAJN;AAKE,IAAA,OAAO,EAAE,WALX;AAME,IAAA,OAAO,EAAEJ,OAAO,GAAG,CAAV,IAAeD,MAN1B;AAOE,IAAA,SAAS,EAAEC,OAAO,GAAG;AAPvB,MASGF,IAAI,iBACHb,KAAK,CAACoB,YAAN,CAAmBP,IAAnB,EAAyB;AACvBK,IAAAA,SAAS,EAAEhB,UAAU,CAAC,wBAAD;AADE,GAAzB,CAVJ,EAaGU,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,CAdJ,EAuBGG,OAAO,GAAG,CAAV,gBACC,oBAAC,0BAAD;AAA4B,IAAA,SAAS,EAAE;AAAvC,KACGA,OADH,CADD,GAIG,IA3BN,CADF,EA8BGA,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,IA3CN,CADF;AA+CD,CA7DoC,CAAhC;AAgEPP,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 StyledCounterButtonWrapper,\n} from \"./Styles\";\n\nexport interface 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: (event?) => void;\n /** Tooltip content */\n tooltipText?: string;\n /** Applies passed classes */\n className?: string;\n}\n\nexport const CounterButton = forwardRef<HTMLDivElement, 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 <StyledCounterButtonWrapper ref={ref} className={className}>\n <StyledCounterButton\n className={classNames(\"c-counter-button\", {\n \"c-counter-button__selected\": counter,\n })}\n {...args}\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 </StyledCounterButtonWrapper>\n );\n }\n);\n\nCounterButton.displayName = \"CounterButton\";\n"],"file":"CounterButton.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/CounterButton/Styles.ts"],"names":[],"mappings":";AAOA,UAAU,wBAAwB;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,0BAA0B,
|
|
1
|
+
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/CounterButton/Styles.ts"],"names":[],"mappings":";AAOA,UAAU,wBAAwB;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,0BAA0B,oEAKtC,CAAC;AAIF,eAAO,MAAM,mBAAmB,0NAsB/B,CAAC;AAIF,eAAO,MAAM,0BAA0B;;SAWtC,CAAC;AAIF,eAAO,MAAM,wBAAwB,oMAUpC,CAAC;AAIF,eAAO,MAAM,wBAAwB;;SAgBpC,CAAC"}
|
|
@@ -6,7 +6,7 @@ import { FontStyle } from "../FontStyle";
|
|
|
6
6
|
export var StyledCounterButtonWrapper = styled.div.withConfig({
|
|
7
7
|
displayName: "Styles__StyledCounterButtonWrapper",
|
|
8
8
|
componentId: "sc-1ecrcba-0"
|
|
9
|
-
})(["", " ", " ", ""], {
|
|
9
|
+
})(["", " ", " ", " width:fit-content;"], {
|
|
10
10
|
"display": "flex"
|
|
11
11
|
}, FontStyle, BoxSizingStyle);
|
|
12
12
|
StyledCounterButtonWrapper.displayName = "StyledCounterButtonWrapper";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/CounterButton/Styles.ts"],"names":["styled","css","Body2","Button","BoxSizingStyle","FontStyle","StyledCounterButtonWrapper","div","displayName","StyledCounterButton","props","$active","$selected","StyledCounterButtonCounter","StyledCounterButtonReset","StyledCounterButtonLabel"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,KAAT,QAAsB,8BAAtB;AACA,SAASC,MAAT,QAAuB,kBAAvB;AACA,SAASC,cAAT,QAA+B,mBAA/B;AACA,SAASC,SAAT,QAA0B,cAA1B;AAOA,OAAO,IAAMC,0BAA0B,GAAGN,MAAM,CAACO,GAAV;AAAA;AAAA;AAAA,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/CounterButton/Styles.ts"],"names":["styled","css","Body2","Button","BoxSizingStyle","FontStyle","StyledCounterButtonWrapper","div","displayName","StyledCounterButton","props","$active","$selected","StyledCounterButtonCounter","StyledCounterButtonReset","StyledCounterButtonLabel"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAEA,SAASC,KAAT,QAAsB,8BAAtB;AACA,SAASC,MAAT,QAAuB,kBAAvB;AACA,SAASC,cAAT,QAA+B,mBAA/B;AACA,SAASC,SAAT,QAA0B,cAA1B;AAOA,OAAO,IAAMC,0BAA0B,GAAGN,MAAM,CAACO,GAAV;AAAA;AAAA;AAAA,0CACjC;AAAA;AAAA,CADiC,EAEnCF,SAFmC,EAGnCD,cAHmC,CAAhC;AAOPE,0BAA0B,CAACE,WAA3B,GAAyC,4BAAzC;AAEA,OAAO,IAAMC,mBAAmB,GAAGT,MAAM,CAACG,MAAD,CAAT;AAAA;AAAA;AAAA,kBAC5B,UAACO,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,IACAV,GADA,gGADA;AAAA,CAD4B,EAe5B,UAACS,KAAD;AAAA,SACAA,KAAK,CAACE,SAAN,IACAX,GADA,uGADA;AAAA,CAf4B,CAAzB;AAwBPQ,mBAAmB,CAACD,WAApB,GAAkC,qBAAlC;AAEA,OAAO,IAAMK,0BAA0B,GAAGb,MAAM,CAACO,GAAV;AAAA;AAAA;AAAA,6MAAhC;AAaPM,0BAA0B,CAACL,WAA3B,GAAyC,4BAAzC;AAEA,OAAO,IAAMM,wBAAwB,GAAGd,MAAM,CAACG,MAAD,CAAT;AAAA;AAAA;AAAA,+MAA9B;AAYPW,wBAAwB,CAACN,WAAzB,GAAuC,0BAAvC;AAEA,OAAO,IAAMO,wBAAwB,GAAGf,MAAM,CAACE,KAAD,CAAT;AAAA;AAAA;AAAA,qCAC/B;AAAA;AAAA,CAD+B,EAGjCO,mBAHiC,EAI/B,UAACC,KAAD;AAAA,SACA,CAACA,KAAK,CAACC,OAAP,IACAV,GADA,mCADA;AAAA,CAJ+B,EAWjC,UAACS,KAAD;AAAA,SACAA,KAAK,CAACC,OAAN,IACAV,GADA,iCADA;AAAA,CAXiC,CAA9B;AAkBPc,wBAAwB,CAACP,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\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\n\ninterface StyledCounterButtonProps {\n $active?: boolean;\n $selected?: boolean;\n}\n\nexport const StyledCounterButtonWrapper = styled.div`\n ${tw`tw-flex`}\n ${FontStyle}\n ${BoxSizingStyle}\n width: fit-content;\n`;\n\nStyledCounterButtonWrapper.displayName = \"StyledCounterButtonWrapper\";\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
|
@@ -4017,7 +4017,7 @@
|
|
|
4017
4017
|
var StyledCounterButtonWrapper = styled__default["default"].div.withConfig({
|
|
4018
4018
|
displayName: "Styles__StyledCounterButtonWrapper",
|
|
4019
4019
|
componentId: "sc-1ecrcba-0"
|
|
4020
|
-
})(["", " ", " ", ""], {
|
|
4020
|
+
})(["", " ", " ", " width:fit-content;"], {
|
|
4021
4021
|
"display": "flex"
|
|
4022
4022
|
}, FontStyle, BoxSizingStyle);
|
|
4023
4023
|
StyledCounterButtonWrapper.displayName = "StyledCounterButtonWrapper";
|
|
@@ -4065,13 +4065,13 @@
|
|
|
4065
4065
|
args = _objectWithoutProperties(_ref, _excluded$T);
|
|
4066
4066
|
|
|
4067
4067
|
return /*#__PURE__*/React__default["default"].createElement(StyledCounterButtonWrapper, {
|
|
4068
|
+
ref: ref,
|
|
4068
4069
|
className: className
|
|
4069
4070
|
}, /*#__PURE__*/React__default["default"].createElement(StyledCounterButton, _extends({
|
|
4070
4071
|
className: classnames__default["default"]("c-counter-button", {
|
|
4071
4072
|
"c-counter-button__selected": counter
|
|
4072
4073
|
})
|
|
4073
4074
|
}, args, {
|
|
4074
|
-
ref: ref,
|
|
4075
4075
|
variant: "text gray",
|
|
4076
4076
|
$active: counter > 0 || active,
|
|
4077
4077
|
$selected: counter > 0
|