@citygross/components 0.8.40 → 0.8.41

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.
@@ -22,5 +22,6 @@ export declare type TCgButton = {
22
22
  onClick?: () => void;
23
23
  fullWidth?: boolean;
24
24
  buttonRef?: React.Ref<HTMLButtonElement>;
25
+ round?: boolean;
25
26
  };
26
- export declare const CgButton: ({ size, variant, icon, flexReverse, disabled, onClick, children, loading, fullWidth, buttonRef }: TCgButton) => JSX.Element;
27
+ export declare const CgButton: ({ size, variant, icon, flexReverse, disabled, onClick, children, loading, fullWidth, buttonRef, round }: TCgButton) => JSX.Element;
@@ -8,6 +8,7 @@ export declare type TCgButtonStyleProps = {
8
8
  loading?: boolean;
9
9
  isIconOnly?: boolean;
10
10
  fullWidth?: boolean;
11
+ round?: boolean;
11
12
  };
12
13
  export declare const CgButtonContainer: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, TCgButtonStyleProps, never>;
13
14
  export declare const CgButtonContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Pick<TCgButtonStyleProps, "flexReverse" | "size" | "loading">, never>;
@@ -25,8 +25,8 @@ exports.EButtonVariant = void 0;
25
25
  EButtonVariant[EButtonVariant["ghost"] = 4] = "ghost";
26
26
  })(exports.EButtonVariant || (exports.EButtonVariant = {}));
27
27
  var CgButton = function (_a) {
28
- var size = _a.size, variant = _a.variant, icon = _a.icon, flexReverse = _a.flexReverse, disabled = _a.disabled, onClick = _a.onClick, children = _a.children, loading = _a.loading, fullWidth = _a.fullWidth, buttonRef = _a.buttonRef;
29
- return (React__default["default"].createElement(CgButton_styles.CgButtonContainer, { ref: buttonRef, size: size, variant: variant, isIconOnly: !children, flexReverse: flexReverse, disabled: disabled || loading, fullWidth: fullWidth, loading: loading, onKeyDown: function (event) {
28
+ var size = _a.size, variant = _a.variant, icon = _a.icon, flexReverse = _a.flexReverse, disabled = _a.disabled, onClick = _a.onClick, children = _a.children, loading = _a.loading, fullWidth = _a.fullWidth, buttonRef = _a.buttonRef, round = _a.round;
29
+ return (React__default["default"].createElement(CgButton_styles.CgButtonContainer, { ref: buttonRef, round: round, size: size, variant: variant, isIconOnly: !children, flexReverse: flexReverse, disabled: disabled || loading, fullWidth: fullWidth, loading: loading, onKeyDown: function (event) {
30
30
  if (event.key === 'Enter') {
31
31
  onClick && onClick();
32
32
  }
@@ -46,12 +46,12 @@ var buttonShadow = function (size, variant) {
46
46
  return 'inset 0px -2px 0px rgba(0, 0, 0, 0.15)';
47
47
  }
48
48
  };
49
- var CgButtonContainer = styled__default["default"].button(templateObject_7 || (templateObject_7 = _tslib.__makeTemplateObject(["\n border-radius: ", "px;\n padding: ", ";\n cursor: pointer;\n outline: none;\n border: none;\n position: relative;\n ", "\n ", "\n &:disabled {\n cursor: default;\n }\n &:after {\n content: '';\n display: block;\n width: 100%;\n height: 100%;\n position: absolute;\n box-shadow: ", ";\n border-radius: ", "px;\n top: 0;\n left: 0;\n }\n\n ", "\n ", "\n"], ["\n border-radius: ", "px;\n padding: ", ";\n cursor: pointer;\n outline: none;\n border: none;\n position: relative;\n ", "\n ", "\n &:disabled {\n cursor: default;\n }\n &:after {\n content: '';\n display: block;\n width: 100%;\n height: 100%;\n position: absolute;\n box-shadow: ", ";\n border-radius: ", "px;\n top: 0;\n left: 0;\n }\n\n ", "\n ", "\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) {
49
+ var CgButtonContainer = styled__default["default"].button(templateObject_7 || (templateObject_7 = _tslib.__makeTemplateObject(["\n border-radius: ", "px;\n padding: ", ";\n cursor: pointer;\n outline: none;\n border: none;\n position: relative;\n ", "\n ", "\n &:disabled {\n cursor: default;\n }\n &:after {\n content: '';\n display: block;\n width: 100%;\n height: 100%;\n position: absolute;\n box-shadow: ", ";\n border-radius: ", "px;\n top: 0;\n left: 0;\n }\n\n ", "\n ", "\n"], ["\n border-radius: ", "px;\n padding: ", ";\n cursor: pointer;\n outline: none;\n border: none;\n position: relative;\n ", "\n ", "\n &:disabled {\n cursor: default;\n }\n &:after {\n content: '';\n display: block;\n width: 100%;\n height: 100%;\n position: absolute;\n box-shadow: ", ";\n border-radius: ", "px;\n top: 0;\n left: 0;\n }\n\n ", "\n ", "\n"])), function (props) { var _a; return props.round ? '100' : (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) {
50
50
  var _a;
51
51
  return props.isIconOnly
52
52
  ? "".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs, "px")
53
53
  : buttonPadding(props.size, props.theme.spacings);
54
- }, function (props) { return (props === null || props === void 0 ? void 0 : props.fullWidth) && "width: 100%;"; }, global_styles.focusVisible, function (props) { return buttonShadow(props.size, props.variant); }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) {
54
+ }, function (props) { return (props === null || props === void 0 ? void 0 : props.fullWidth) && "width: 100%;"; }, global_styles.focusVisible, function (props) { return buttonShadow(props.size, props.variant); }, function (props) { var _a; return props.round ? '100' : (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) {
55
55
  switch (props.variant) {
56
56
  case CgButton.EButtonVariant.primary:
57
57
  return CgPrimary;
@@ -17,8 +17,8 @@ var EButtonVariant;
17
17
  EButtonVariant[EButtonVariant["ghost"] = 4] = "ghost";
18
18
  })(EButtonVariant || (EButtonVariant = {}));
19
19
  var CgButton = function (_a) {
20
- var size = _a.size, variant = _a.variant, icon = _a.icon, flexReverse = _a.flexReverse, disabled = _a.disabled, onClick = _a.onClick, children = _a.children, loading = _a.loading, fullWidth = _a.fullWidth, buttonRef = _a.buttonRef;
21
- return (React.createElement(CgButtonContainer, { ref: buttonRef, size: size, variant: variant, isIconOnly: !children, flexReverse: flexReverse, disabled: disabled || loading, fullWidth: fullWidth, loading: loading, onKeyDown: function (event) {
20
+ var size = _a.size, variant = _a.variant, icon = _a.icon, flexReverse = _a.flexReverse, disabled = _a.disabled, onClick = _a.onClick, children = _a.children, loading = _a.loading, fullWidth = _a.fullWidth, buttonRef = _a.buttonRef, round = _a.round;
21
+ return (React.createElement(CgButtonContainer, { ref: buttonRef, round: round, size: size, variant: variant, isIconOnly: !children, flexReverse: flexReverse, disabled: disabled || loading, fullWidth: fullWidth, loading: loading, onKeyDown: function (event) {
22
22
  if (event.key === 'Enter') {
23
23
  onClick && onClick();
24
24
  }
@@ -38,12 +38,12 @@ var buttonShadow = function (size, variant) {
38
38
  return 'inset 0px -2px 0px rgba(0, 0, 0, 0.15)';
39
39
  }
40
40
  };
41
- var CgButtonContainer = styled.button(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n border-radius: ", "px;\n padding: ", ";\n cursor: pointer;\n outline: none;\n border: none;\n position: relative;\n ", "\n ", "\n &:disabled {\n cursor: default;\n }\n &:after {\n content: '';\n display: block;\n width: 100%;\n height: 100%;\n position: absolute;\n box-shadow: ", ";\n border-radius: ", "px;\n top: 0;\n left: 0;\n }\n\n ", "\n ", "\n"], ["\n border-radius: ", "px;\n padding: ", ";\n cursor: pointer;\n outline: none;\n border: none;\n position: relative;\n ", "\n ", "\n &:disabled {\n cursor: default;\n }\n &:after {\n content: '';\n display: block;\n width: 100%;\n height: 100%;\n position: absolute;\n box-shadow: ", ";\n border-radius: ", "px;\n top: 0;\n left: 0;\n }\n\n ", "\n ", "\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) {
41
+ var CgButtonContainer = styled.button(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n border-radius: ", "px;\n padding: ", ";\n cursor: pointer;\n outline: none;\n border: none;\n position: relative;\n ", "\n ", "\n &:disabled {\n cursor: default;\n }\n &:after {\n content: '';\n display: block;\n width: 100%;\n height: 100%;\n position: absolute;\n box-shadow: ", ";\n border-radius: ", "px;\n top: 0;\n left: 0;\n }\n\n ", "\n ", "\n"], ["\n border-radius: ", "px;\n padding: ", ";\n cursor: pointer;\n outline: none;\n border: none;\n position: relative;\n ", "\n ", "\n &:disabled {\n cursor: default;\n }\n &:after {\n content: '';\n display: block;\n width: 100%;\n height: 100%;\n position: absolute;\n box-shadow: ", ";\n border-radius: ", "px;\n top: 0;\n left: 0;\n }\n\n ", "\n ", "\n"])), function (props) { var _a; return props.round ? '100' : (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) {
42
42
  var _a;
43
43
  return props.isIconOnly
44
44
  ? "".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs, "px")
45
45
  : buttonPadding(props.size, props.theme.spacings);
46
- }, function (props) { return (props === null || props === void 0 ? void 0 : props.fullWidth) && "width: 100%;"; }, focusVisible, function (props) { return buttonShadow(props.size, props.variant); }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) {
46
+ }, function (props) { return (props === null || props === void 0 ? void 0 : props.fullWidth) && "width: 100%;"; }, focusVisible, function (props) { return buttonShadow(props.size, props.variant); }, function (props) { var _a; return props.round ? '100' : (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) {
47
47
  switch (props.variant) {
48
48
  case EButtonVariant.primary:
49
49
  return CgPrimary;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.8.40",
3
+ "version": "0.8.41",
4
4
  "license": "ISC",
5
5
  "sideEffects": false,
6
6
  "main": "./build/cjs/components/src/index.js",
@@ -76,5 +76,5 @@
76
76
  "react-slick": "^0.30.1",
77
77
  "slick-carousel": "^1.8.1"
78
78
  },
79
- "gitHead": "9757b24d1d87641febb8890a7d77b3a2952699cb"
79
+ "gitHead": "ba1dc21fcdad63cdc0da65cec1a9a7c490d9b880"
80
80
  }