glints-aries 4.0.255 → 4.0.256

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.
Files changed (7) hide show
  1. package/es/@next/Banner/Banner.js +5 -3
  2. package/es/@next/Banner/FixedBannerStyle.js +3 -3
  3. package/es/@next/Button/ButtonStyle.js +1 -1
  4. package/lib/@next/Banner/Banner.js +5 -3
  5. package/lib/@next/Banner/FixedBannerStyle.js +3 -3
  6. package/lib/@next/Button/ButtonStyle.js +1 -1
  7. package/package.json +1 -1
package/es/@next/Banner/Banner.js CHANGED
@@ -63,12 +63,14 @@ export var Banner = /*#__PURE__*/React.forwardRef(function Banner(_ref, ref) {
63
63
  }, /*#__PURE__*/React.createElement(Icon, {
64
64
  name: iconNameValue
65
65
  })), /*#__PURE__*/React.createElement(StyledFixedBannerContentContainer, {
66
- "data-noicon": showIcon ? '' : 'true'
66
+ "data-show-icon": showIcon,
67
+ "data-has-action": !!(action || secondaryAction),
68
+ "data-dismissable": dismissable
67
69
  }, /*#__PURE__*/React.createElement(Typography, {
68
70
  as: "div",
69
- variant: "body1"
71
+ variant: "body2"
70
72
  }, children)), /*#__PURE__*/React.createElement(StyledFixedBannerButtonContainer, {
71
- "data-noicon": showIcon ? '' : 'true'
73
+ "data-show-icon": showIcon
72
74
  }, actionComponent), dismissable && /*#__PURE__*/React.createElement(StyledFixedCloseIconWrapper, {
73
75
  role: "button",
74
76
  onClick: function onClick() {
package/es/@next/Banner/FixedBannerStyle.js CHANGED
@@ -4,7 +4,7 @@ import { Blue, Green, Neutral, Orange, Red } from '../utilities/colors';
4
4
  export var StyledFixedBanner = styled.div.withConfig({
5
5
  displayName: "FixedBannerStyle__StyledFixedBanner",
6
6
  componentId: "sc-1clh4a2-0"
7
- })(["position:fixed;left:0;right:0;height:56px;display:flex;justify-content:center;align-items:center;padding-inline:48px;background:", ";color:", ";svg{position:static;fill:", ";height:20px;width:20px;margin-top:4px;}&[data-status='success']{background:", ";}&[data-status='info']{background:", ";}&[data-status='warning']{background:", ";}&[data-status='critical']{background:", ";}@media (max-width:", "){padding:16px;height:100px;svg{margin-top:0px;}&[data-nobutton='true']{height:52px;}}"], Neutral.B99, Neutral.B18, Neutral.B40, Green.B89, Blue.S08, Orange.S21, Red.B100, Breakpoints.large);
7
+ })(["position:fixed;left:0;right:0;min-height:56px;display:flex;justify-content:center;align-items:center;padding-inline:48px;background:", ";color:", ";svg{position:static;fill:", ";height:24px;width:24px;margin-top:2px;}&[data-status='success']{background:", ";}&[data-status='info']{background:", ";}&[data-status='warning']{background:", ";}&[data-status='critical']{background:", ";}@media (max-width:", "){padding:16px;min-height:100px;justify-content:flex-start;align-items:flex-start;svg{margin-top:-2px;}&[data-nobutton='true']{min-height:52px;}}"], Neutral.B99, Neutral.B18, Neutral.B40, Green.B89, Blue.S08, Orange.S21, Red.B100, Breakpoints.large);
8
8
  export var StyledFixedIconWrapper = styled.div.withConfig({
9
9
  displayName: "FixedBannerStyle__StyledFixedIconWrapper",
10
10
  componentId: "sc-1clh4a2-1"
@@ -12,11 +12,11 @@ export var StyledFixedIconWrapper = styled.div.withConfig({
12
12
  export var StyledFixedBannerContentContainer = styled.div.withConfig({
13
13
  displayName: "FixedBannerStyle__StyledFixedBannerContentContainer",
14
14
  componentId: "sc-1clh4a2-2"
15
- })(["padding-right:16px;@media (max-width:", "){position:absolute;top:16px;left:52px;&[data-noicon='true']{left:16px;}}"], Breakpoints.large);
15
+ })(["padding-right:16px;@media (max-width:", "){padding-left:36px;padding-right:0px;&[data-dismissable='true']{padding-right:36px;}&[data-has-action='true']{padding-bottom:52px;}&:not([data-show-icon='true']){padding-left:0px;}}"], Breakpoints.large);
16
16
  export var StyledFixedBannerButtonContainer = styled.div.withConfig({
17
17
  displayName: "FixedBannerStyle__StyledFixedBannerButtonContainer",
18
18
  componentId: "sc-1clh4a2-3"
19
- })(["@media (max-width:", "){position:absolute;top:48px;left:52px;&[data-noicon='true']{left:16px;}}"], Breakpoints.large);
19
+ })(["@media (max-width:", "){position:absolute;bottom:16px;left:52px;&:not([data-show-icon='true']){left:16px;}}"], Breakpoints.large);
20
20
  export var StyledFixedCloseIconWrapper = styled.div.withConfig({
21
21
  displayName: "FixedBannerStyle__StyledFixedCloseIconWrapper",
22
22
  componentId: "sc-1clh4a2-4"
package/es/@next/Button/ButtonStyle.js CHANGED
@@ -15,7 +15,7 @@ var buttonSizeStyleMap = {
15
15
  export var StyledButton = styled.button.withConfig({
16
16
  displayName: "ButtonStyle__StyledButton",
17
17
  componentId: "sc-8t0676-0"
18
- })(["display:flex;gap:8px;border-width:1px;border-style:solid;border-radius:", ";flex-direction:row;align-items:center;justify-content:center;flex:none;order:0;flex-grow:0;color:", ";background:", ";border-color:", ";box-shadow:", ";&:hover{cursor:pointer;background:", ";}&:focus{outline:none;border-color:", ";box-shadow:", ";}&:active{background:", ";border:1px solid ", ";box-shadow:", ";}&:active > svg{fill:", ";}&:disabled{color:", ";background:", ";pointer-events:none;}&:disabled svg{fill:", ";}", " svg{width:16px;height:16px;fill:", ";}.spinner-container{position:absolute;}&[data-active='true']{color:", ";background:", ";}&[data-full-width='true']{width:100%;}&[data-icon='true']{gap:4px;}&[data-active='true'] svg{fill:", ";}&[data-loading='true']{background:", ";color:transparent;}&[data-loading='true'] svg{fill:transparent;}&[data-loading='true'] .spinner-container svg{fill:", ";position:static;}"], borderRadius4, Neutral.B18, Neutral.B100, Neutral.B68, button, Neutral.B99, Neutral.B68, buttonFocused, Neutral.B95, Neutral.B68, insetButtonPressed, Neutral.B40, Neutral.B68, Neutral.B95, Neutral.B85, function (_ref) {
18
+ })(["display:flex;gap:8px;border-width:1px;border-style:solid;border-radius:", ";flex-direction:row;align-items:center;justify-content:center;flex:none;order:0;flex-grow:0;color:", ";background:", ";border-color:", ";box-shadow:", ";&:hover{cursor:pointer;background:", ";}&:focus{outline:none;border-color:", ";box-shadow:", ";}&:active{background:", ";border:1px solid ", ";box-shadow:", ";}&:active > svg{fill:", ";}&:disabled{color:", ";background:", ";pointer-events:none;}&:disabled svg{fill:", ";}", " svg{width:20px;height:20px;fill:", ";}.spinner-container{position:absolute;}&[data-active='true']{color:", ";background:", ";}&[data-full-width='true']{width:100%;}&[data-icon='true']{gap:4px;}&[data-active='true'] svg{fill:", ";}&[data-loading='true']{background:", ";color:transparent;}&[data-loading='true'] svg{fill:transparent;}&[data-loading='true'] .spinner-container svg{fill:", ";position:static;}"], borderRadius4, Neutral.B18, Neutral.B100, Neutral.B68, button, Neutral.B99, Neutral.B68, buttonFocused, Neutral.B95, Neutral.B68, insetButtonPressed, Neutral.B40, Neutral.B68, Neutral.B95, Neutral.B85, function (_ref) {
19
19
  var _ref$size = _ref.size,
20
20
  size = _ref$size === void 0 ? 'default' : _ref$size;
21
21
  var sizeStyle = buttonSizeStyleMap[size];
package/lib/@next/Banner/Banner.js CHANGED
@@ -68,12 +68,14 @@ var Banner = /*#__PURE__*/_react["default"].forwardRef(function Banner(_ref, ref
68
68
  }, /*#__PURE__*/_react["default"].createElement(_Icon.Icon, {
69
69
  name: iconNameValue
70
70
  })), /*#__PURE__*/_react["default"].createElement(_FixedBannerStyle.StyledFixedBannerContentContainer, {
71
- "data-noicon": showIcon ? '' : 'true'
71
+ "data-show-icon": showIcon,
72
+ "data-has-action": !!(action || secondaryAction),
73
+ "data-dismissable": dismissable
72
74
  }, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
73
75
  as: "div",
74
- variant: "body1"
76
+ variant: "body2"
75
77
  }, children)), /*#__PURE__*/_react["default"].createElement(_FixedBannerStyle.StyledFixedBannerButtonContainer, {
76
- "data-noicon": showIcon ? '' : 'true'
78
+ "data-show-icon": showIcon
77
79
  }, actionComponent), dismissable && /*#__PURE__*/_react["default"].createElement(_FixedBannerStyle.StyledFixedCloseIconWrapper, {
78
80
  role: "button",
79
81
  onClick: function onClick() {
package/lib/@next/Banner/FixedBannerStyle.js CHANGED
@@ -11,7 +11,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
11
11
  var StyledFixedBanner = _styledComponents["default"].div.withConfig({
12
12
  displayName: "FixedBannerStyle__StyledFixedBanner",
13
13
  componentId: "sc-1clh4a2-0"
14
- })(["position:fixed;left:0;right:0;height:56px;display:flex;justify-content:center;align-items:center;padding-inline:48px;background:", ";color:", ";svg{position:static;fill:", ";height:20px;width:20px;margin-top:4px;}&[data-status='success']{background:", ";}&[data-status='info']{background:", ";}&[data-status='warning']{background:", ";}&[data-status='critical']{background:", ";}@media (max-width:", "){padding:16px;height:100px;svg{margin-top:0px;}&[data-nobutton='true']{height:52px;}}"], _colors.Neutral.B99, _colors.Neutral.B18, _colors.Neutral.B40, _colors.Green.B89, _colors.Blue.S08, _colors.Orange.S21, _colors.Red.B100, Breakpoints.large);
14
+ })(["position:fixed;left:0;right:0;min-height:56px;display:flex;justify-content:center;align-items:center;padding-inline:48px;background:", ";color:", ";svg{position:static;fill:", ";height:24px;width:24px;margin-top:2px;}&[data-status='success']{background:", ";}&[data-status='info']{background:", ";}&[data-status='warning']{background:", ";}&[data-status='critical']{background:", ";}@media (max-width:", "){padding:16px;min-height:100px;justify-content:flex-start;align-items:flex-start;svg{margin-top:-2px;}&[data-nobutton='true']{min-height:52px;}}"], _colors.Neutral.B99, _colors.Neutral.B18, _colors.Neutral.B40, _colors.Green.B89, _colors.Blue.S08, _colors.Orange.S21, _colors.Red.B100, Breakpoints.large);
15
15
  exports.StyledFixedBanner = StyledFixedBanner;
16
16
  var StyledFixedIconWrapper = _styledComponents["default"].div.withConfig({
17
17
  displayName: "FixedBannerStyle__StyledFixedIconWrapper",
@@ -21,12 +21,12 @@ exports.StyledFixedIconWrapper = StyledFixedIconWrapper;
21
21
  var StyledFixedBannerContentContainer = _styledComponents["default"].div.withConfig({
22
22
  displayName: "FixedBannerStyle__StyledFixedBannerContentContainer",
23
23
  componentId: "sc-1clh4a2-2"
24
- })(["padding-right:16px;@media (max-width:", "){position:absolute;top:16px;left:52px;&[data-noicon='true']{left:16px;}}"], Breakpoints.large);
24
+ })(["padding-right:16px;@media (max-width:", "){padding-left:36px;padding-right:0px;&[data-dismissable='true']{padding-right:36px;}&[data-has-action='true']{padding-bottom:52px;}&:not([data-show-icon='true']){padding-left:0px;}}"], Breakpoints.large);
25
25
  exports.StyledFixedBannerContentContainer = StyledFixedBannerContentContainer;
26
26
  var StyledFixedBannerButtonContainer = _styledComponents["default"].div.withConfig({
27
27
  displayName: "FixedBannerStyle__StyledFixedBannerButtonContainer",
28
28
  componentId: "sc-1clh4a2-3"
29
- })(["@media (max-width:", "){position:absolute;top:48px;left:52px;&[data-noicon='true']{left:16px;}}"], Breakpoints.large);
29
+ })(["@media (max-width:", "){position:absolute;bottom:16px;left:52px;&:not([data-show-icon='true']){left:16px;}}"], Breakpoints.large);
30
30
  exports.StyledFixedBannerButtonContainer = StyledFixedBannerButtonContainer;
31
31
  var StyledFixedCloseIconWrapper = _styledComponents["default"].div.withConfig({
32
32
  displayName: "FixedBannerStyle__StyledFixedCloseIconWrapper",
package/lib/@next/Button/ButtonStyle.js CHANGED
@@ -22,7 +22,7 @@ var buttonSizeStyleMap = {
22
22
  var StyledButton = _styledComponents["default"].button.withConfig({
23
23
  displayName: "ButtonStyle__StyledButton",
24
24
  componentId: "sc-8t0676-0"
25
- })(["display:flex;gap:8px;border-width:1px;border-style:solid;border-radius:", ";flex-direction:row;align-items:center;justify-content:center;flex:none;order:0;flex-grow:0;color:", ";background:", ";border-color:", ";box-shadow:", ";&:hover{cursor:pointer;background:", ";}&:focus{outline:none;border-color:", ";box-shadow:", ";}&:active{background:", ";border:1px solid ", ";box-shadow:", ";}&:active > svg{fill:", ";}&:disabled{color:", ";background:", ";pointer-events:none;}&:disabled svg{fill:", ";}", " svg{width:16px;height:16px;fill:", ";}.spinner-container{position:absolute;}&[data-active='true']{color:", ";background:", ";}&[data-full-width='true']{width:100%;}&[data-icon='true']{gap:4px;}&[data-active='true'] svg{fill:", ";}&[data-loading='true']{background:", ";color:transparent;}&[data-loading='true'] svg{fill:transparent;}&[data-loading='true'] .spinner-container svg{fill:", ";position:static;}"], _borderRadius.borderRadius4, _colors.Neutral.B18, _colors.Neutral.B100, _colors.Neutral.B68, _dropShadow.button, _colors.Neutral.B99, _colors.Neutral.B68, _dropShadow.buttonFocused, _colors.Neutral.B95, _colors.Neutral.B68, _dropShadow.insetButtonPressed, _colors.Neutral.B40, _colors.Neutral.B68, _colors.Neutral.B95, _colors.Neutral.B85, function (_ref) {
25
+ })(["display:flex;gap:8px;border-width:1px;border-style:solid;border-radius:", ";flex-direction:row;align-items:center;justify-content:center;flex:none;order:0;flex-grow:0;color:", ";background:", ";border-color:", ";box-shadow:", ";&:hover{cursor:pointer;background:", ";}&:focus{outline:none;border-color:", ";box-shadow:", ";}&:active{background:", ";border:1px solid ", ";box-shadow:", ";}&:active > svg{fill:", ";}&:disabled{color:", ";background:", ";pointer-events:none;}&:disabled svg{fill:", ";}", " svg{width:20px;height:20px;fill:", ";}.spinner-container{position:absolute;}&[data-active='true']{color:", ";background:", ";}&[data-full-width='true']{width:100%;}&[data-icon='true']{gap:4px;}&[data-active='true'] svg{fill:", ";}&[data-loading='true']{background:", ";color:transparent;}&[data-loading='true'] svg{fill:transparent;}&[data-loading='true'] .spinner-container svg{fill:", ";position:static;}"], _borderRadius.borderRadius4, _colors.Neutral.B18, _colors.Neutral.B100, _colors.Neutral.B68, _dropShadow.button, _colors.Neutral.B99, _colors.Neutral.B68, _dropShadow.buttonFocused, _colors.Neutral.B95, _colors.Neutral.B68, _dropShadow.insetButtonPressed, _colors.Neutral.B40, _colors.Neutral.B68, _colors.Neutral.B95, _colors.Neutral.B85, function (_ref) {
26
26
  var _ref$size = _ref.size,
27
27
  size = _ref$size === void 0 ? 'default' : _ref$size;
28
28
  var sizeStyle = buttonSizeStyleMap[size];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "glints-aries",
3
- "version": "4.0.255",
3
+ "version": "4.0.256",
4
4
  "description": "Glints ui-kit for frontend",
5
5
  "main": "./lib/index.js",
6
6
  "module": "./es/index.js",