@xfers/design-system 3.1.29 → 3.1.30

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.
@@ -2,24 +2,16 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.iconButtonDisabledStyle = exports.iconButtonTertiaryStyle = exports.iconButtonSecondaryStyle = exports.iconButtonPrimaryStyle = exports.iconButtonSVGStyle = exports.iconButtonSmallStyle = exports.iconButtonStyle = void 0;
4
4
  var theme_1 = require("src/theme/theme");
5
- // Base icon button styles
6
5
  var baseIconButtonStyle = "\n padding: 0;\n border-radius: 99px;\n display: flex;\n align-items: center;\n justify-content: center;\n";
7
- // Size variants
8
6
  exports.iconButtonStyle = "\n " + baseIconButtonStyle + "\n width: 48px;\n height: 48px;\n top: 20px;\n left: 20px;\n";
9
7
  exports.iconButtonSmallStyle = "\n " + baseIconButtonStyle + "\n width: 36px;\n height: 36px;\n top: 20px;\n left: 20px;\n";
10
8
  var iconButtonSVGStyle = function (size) { return "\n & > svg {\n height: " + (size === 'small' ? '20px' : '24px') + ";\n width: " + (size === 'small' ? '20px' : '24px') + ";\n }\n"; };
11
9
  exports.iconButtonSVGStyle = iconButtonSVGStyle;
12
- // Common state styles creator
13
10
  var createStateStyles = function (defaultBackground, defaultColor, hoverBackground, activeBackground) { return "\n background-color: " + defaultBackground + ";\n color: " + defaultColor + ";\n border: none;\n\n &:focus {\n background-color: " + defaultBackground + ";\n }\n\n &:hover {\n background-color: " + (hoverBackground || defaultBackground) + ";\n }\n\n &:active {\n background-color: " + (activeBackground || defaultBackground) + ";\n }\n"; };
14
- // Common disabled style creator
15
11
  var createDisabledStyle = function (backgroundColor, textColor) { return "\n cursor: not-allowed;\n background-color: " + backgroundColor + ";\n color: " + textColor + ";\n border: none;\n\n &:hover, &:focus, &:active {\n cursor: not-allowed;\n background-color: " + backgroundColor + ";\n color: " + textColor + ";\n }\n"; };
16
- // Primary button styles
17
12
  exports.iconButtonPrimaryStyle = createStateStyles(theme_1.straitsXTheme.brand.action.default, theme_1.straitsXTheme.brand.primary.contrast, theme_1.straitsXTheme.brand.action.hover, theme_1.straitsXTheme.brand.action.pressed);
18
- // Secondary button styles
19
- exports.iconButtonSecondaryStyle = "\n background-color: " + theme_1.straitsXTheme.color.surface.neutral + ";\n color: " + theme_1.straitsXTheme.brand.secondary.onSurface + ";\n border: 1px solid " + theme_1.straitsXTheme.brand.line.base + ";\n\n &:focus {\n background-color: " + theme_1.straitsXTheme.color.interactive.focusSurface + ";\n }\n\n &:hover {\n background-color: " + theme_1.straitsXTheme.color.interactive.hoverSurface + ";\n }\n\n &:active {\n background-color: " + theme_1.straitsXTheme.color.interactive.pressedSurface + ";\n }\n";
20
- // Tertiary button styles
21
- exports.iconButtonTertiaryStyle = "\n background-color: transparent;\n color: " + theme_1.straitsXTheme.brand.secondary.onSurface + ";\n border: none;\n box-shadow: none;\n\n &:focus {\n background-color: transparent;\n }\n\n &:hover {\n background-color: " + theme_1.straitsXTheme.color.interactive.hoverSurface + ";\n }\n\n &:active {\n background-color: " + theme_1.straitsXTheme.color.interactive.pressedSurface + ";\n }\n";
22
- // Disabled styles mapping
13
+ exports.iconButtonSecondaryStyle = createStateStyles(theme_1.straitsXTheme.color.surface.neutral, theme_1.straitsXTheme.brand.secondary.onSurface, theme_1.straitsXTheme.color.interactive.hoverSurface, theme_1.straitsXTheme.color.interactive.pressedSurface) + "\n border: 1px solid " + theme_1.straitsXTheme.brand.line.base + ";\n";
14
+ exports.iconButtonTertiaryStyle = createStateStyles('transparent', theme_1.straitsXTheme.brand.secondary.onSurface, theme_1.straitsXTheme.color.interactive.hoverSurface, theme_1.straitsXTheme.color.interactive.pressedSurface) + "\n box-shadow: none;\n";
23
15
  var disabledStyles = {
24
16
  primary: createDisabledStyle(theme_1.straitsXTheme.color.surface.disabledSurface, theme_1.straitsXTheme.color.surface.disabledOnSurface),
25
17
  secondary: createDisabledStyle(theme_1.straitsXTheme.color.surface.disabledSurface, theme_1.straitsXTheme.color.surface.disabledOnSurface),
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/Button/styles.ts"],"names":[],"mappings":";;;AAAA,yCAA+C;AAE/C,0BAA0B;AAC1B,IAAM,mBAAmB,GAAG,2HAM3B,CAAA;AAED,gBAAgB;AACH,QAAA,eAAe,GAAG,WACzB,mBAAmB,6EAKxB,CAAA;AAEY,QAAA,oBAAoB,GAAG,WAC9B,mBAAmB,6EAKxB,CAAA;AAEM,IAAM,kBAAkB,GAAG,UAAC,IAAmC,IAAK,OAAA,uCAEzD,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,4BACnC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,gBAElD,EAL0E,CAK1E,CAAA;AALY,QAAA,kBAAkB,sBAK9B;AAED,8BAA8B;AAC9B,IAAM,iBAAiB,GAAG,UACxB,iBAAyB,EACzB,YAAoB,EACpB,eAAwB,EACxB,gBAAyB,IACtB,OAAA,2BACiB,iBAAiB,oBAC5B,YAAY,iEAIC,iBAAiB,sDAIjB,eAAe,IAAI,iBAAiB,wDAIpC,gBAAgB,IAAI,iBAAiB,cAE5D,EAhBI,CAgBJ,CAAA;AAED,gCAAgC;AAChC,IAAM,mBAAmB,GAAG,UAAC,eAAuB,EAAE,SAAiB,IAAK,OAAA,mDAEtD,eAAe,oBAC1B,SAAS,8GAKI,eAAe,sBAC1B,SAAS,aAErB,EAX2E,CAW3E,CAAA;AAED,wBAAwB;AACX,QAAA,sBAAsB,GAAG,iBAAiB,CACrD,qBAAa,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,EAClC,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,EACpC,qBAAa,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAChC,qBAAa,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CACnC,CAAA;AAED,0BAA0B;AACb,QAAA,wBAAwB,GAAG,6BAChB,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,sBAC9C,qBAAa,CAAC,KAAK,CAAC,SAAS,CAAC,SAAS,iCAC5B,qBAAa,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,oDAG3B,qBAAa,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,2DAI5C,qBAAa,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,4DAI5C,qBAAa,CAAC,KAAK,CAAC,WAAW,CAAC,cAAc,eAEvE,CAAA;AAED,yBAAyB;AACZ,QAAA,uBAAuB,GAAG,sDAE1B,qBAAa,CAAC,KAAK,CAAC,SAAS,CAAC,SAAS,4JAS1B,qBAAa,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,4DAI5C,qBAAa,CAAC,KAAK,CAAC,WAAW,CAAC,cAAc,eAEvE,CAAA;AAED,0BAA0B;AAC1B,IAAM,cAAc,GAAG;IACrB,OAAO,EAAE,mBAAmB,CAC1B,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe,EAC3C,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAC9C;IACD,SAAS,EAAE,mBAAmB,CAC5B,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe,EAC3C,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAC9C;IACD,QAAQ,EAAE,mBAAmB,CAC3B,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe,EAC3C,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAC9C;CACO,CAAA;AAEH,IAAM,uBAAuB,GAAG,UACrC,IAA0C,IACvC,OAAA,cAAc,CAAC,IAAI,CAAC,IAAI,cAAc,CAAC,OAAO,EAA9C,CAA8C,CAAA;AAFtC,QAAA,uBAAuB,2BAEe"}
1
+ {"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/Button/styles.ts"],"names":[],"mappings":";;;AAAA,yCAA+C;AAE/C,IAAM,mBAAmB,GAAG,2HAM3B,CAAA;AAEY,QAAA,eAAe,GAAG,WACzB,mBAAmB,6EAKxB,CAAA;AAEY,QAAA,oBAAoB,GAAG,WAC9B,mBAAmB,6EAKxB,CAAA;AAEM,IAAM,kBAAkB,GAAG,UAAC,IAAmC,IAAK,OAAA,uCAEzD,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,4BACnC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,gBAElD,EAL0E,CAK1E,CAAA;AALY,QAAA,kBAAkB,sBAK9B;AAED,IAAM,iBAAiB,GAAG,UACxB,iBAAyB,EACzB,YAAoB,EACpB,eAAwB,EACxB,gBAAyB,IACtB,OAAA,2BACiB,iBAAiB,oBAC5B,YAAY,iEAIC,iBAAiB,sDAIjB,eAAe,IAAI,iBAAiB,wDAIpC,gBAAgB,IAAI,iBAAiB,cAE5D,EAhBI,CAgBJ,CAAA;AAED,IAAM,mBAAmB,GAAG,UAAC,eAAuB,EAAE,SAAiB,IAAK,OAAA,mDAEtD,eAAe,oBAC1B,SAAS,8GAKI,eAAe,sBAC1B,SAAS,aAErB,EAX2E,CAW3E,CAAA;AAEY,QAAA,sBAAsB,GAAG,iBAAiB,CACrD,qBAAa,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,EAClC,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,EACpC,qBAAa,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAChC,qBAAa,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CACnC,CAAA;AAEY,QAAA,wBAAwB,GAAM,iBAAiB,CAC1D,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,OAAO,EACnC,qBAAa,CAAC,KAAK,CAAC,SAAS,CAAC,SAAS,EACvC,qBAAa,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,EAC5C,qBAAa,CAAC,KAAK,CAAC,WAAW,CAAC,cAAc,CAC/C,8BACqB,qBAAa,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,QAClD,CAAA;AAEY,QAAA,uBAAuB,GAAM,iBAAiB,CACzD,aAAa,EACb,qBAAa,CAAC,KAAK,CAAC,SAAS,CAAC,SAAS,EACvC,qBAAa,CAAC,KAAK,CAAC,WAAW,CAAC,YAAY,EAC5C,qBAAa,CAAC,KAAK,CAAC,WAAW,CAAC,cAAc,CAC/C,4BAEA,CAAA;AAED,IAAM,cAAc,GAAG;IACrB,OAAO,EAAE,mBAAmB,CAC1B,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe,EAC3C,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAC9C;IACD,SAAS,EAAE,mBAAmB,CAC5B,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe,EAC3C,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAC9C;IACD,QAAQ,EAAE,mBAAmB,CAC3B,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe,EAC3C,qBAAa,CAAC,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAC9C;CACO,CAAA;AAEH,IAAM,uBAAuB,GAAG,UACrC,IAA0C,IACvC,OAAA,cAAc,CAAC,IAAI,CAAC,IAAI,cAAc,CAAC,OAAO,EAA9C,CAA8C,CAAA;AAFtC,QAAA,uBAAuB,2BAEe"}
@@ -7,7 +7,7 @@ declare type CustomButtonProps = {
7
7
  iconColor?: 'primary';
8
8
  isDisabled?: boolean;
9
9
  isFullWidth?: boolean;
10
- children: React.ReactNode;
10
+ children?: React.ReactNode;
11
11
  className?: string;
12
12
  icon?: React.ReactNode;
13
13
  } & Omit<ButtonProps, 'type' | 'disabled'>;