@superdispatch/ui-lab 0.44.0 → 0.45.0

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 (6) hide show
  1. package/dist-node/index.js +15 -9
  2. package/dist-node/index.js.map +1 -1
  3. package/dist-src/flag-list/FlagListItem.js +15 -9
  4. package/dist-web/index.js +15 -9
  5. package/dist-web/index.js.map +1 -1
  6. package/package.json +3 -3
package/dist-src/flag-list/FlagListItem.js CHANGED
@@ -18,11 +18,15 @@ var IconContainer = /*#__PURE__*/styled.div.withConfig({
18
18
  var Content = /*#__PURE__*/styled.div.withConfig({
19
19
  displayName: "FlagListItem__Content",
20
20
  componentId: "SD__sc-o5bqru-1"
21
- })(["display:flex;align-items:center;gap:8px;"]);
21
+ })(["display:flex;align-items:center;width:100%;gap:8px;"]);
22
+ var HelpIcon = /*#__PURE__*/styled.div.withConfig({
23
+ displayName: "FlagListItem__HelpIcon",
24
+ componentId: "SD__sc-o5bqru-2"
25
+ })(["margin-left:auto;& > svg{font-size:16px;color:", ";}"], ColorDynamic.Dark500);
22
26
  var EndActions = /*#__PURE__*/styled.div.withConfig({
23
27
  displayName: "FlagListItem__EndActions",
24
- componentId: "SD__sc-o5bqru-2"
25
- })(["display:flex;align-items:center;margin-left:auto;gap:8px;& > svg{font-size:16px;color:", ";}", "{margin-left:0;width:100%;}"], ColorDynamic.Dark500, _ref2 => {
28
+ componentId: "SD__sc-o5bqru-3"
29
+ })(["display:flex;align-items:center;margin-left:auto;gap:8px;", "{margin-left:0;width:100%;}"], _ref2 => {
26
30
  var {
27
31
  theme
28
32
  } = _ref2;
@@ -32,13 +36,13 @@ var BannerListItemDanger = /*#__PURE__*/css(["& ", "{background:", ";color:", ";
32
36
  var BannerListItemStandalone = /*#__PURE__*/css(["background:", ";"], ColorDynamic.Silver200);
33
37
  var BannerListContainer = /*#__PURE__*/styled.div.withConfig({
34
38
  displayName: "FlagListItem__BannerListContainer",
35
- componentId: "SD__sc-o5bqru-3"
36
- })(["display:inline-flex;align-items:center;padding:8px 16px 8px 12px;border:1px solid ", ";background:", ";cursor:default;transition:", ";& + &{border-top:none;}&:last-child{border-radius:0 0 4px 4px;}&:hover{background:", ";& ", "{background:", ";}& ", " > svg{color:", ";}}[data-variant='standalone'] &:not(:hover){", "}", " ", "{flex-direction:column;align-items:flex-start;}"], ColorDynamic.Silver400, ColorDynamic.White, _ref3 => {
39
+ componentId: "SD__sc-o5bqru-4"
40
+ })(["display:flex;align-items:center;gap:8px;padding:8px 16px 8px 12px;border:1px solid ", ";background:", ";cursor:default;transition:", ";& + &{border-top:none;}&:last-child{border-radius:0 0 4px 4px;}&:hover{background:", ";& ", "{background:", ";}& ", " > svg{color:", ";}}[data-variant='standalone'] &:not(:hover){", "}", " ", "{flex-direction:column;align-items:flex-start;}"], ColorDynamic.Silver400, ColorDynamic.White, _ref3 => {
37
41
  var {
38
42
  theme
39
43
  } = _ref3;
40
44
  return theme.transitions.create(['color', 'background-color']);
41
- }, ColorDynamic.Blue50, IconContainer, ColorDynamic.White, EndActions, _ref4 => {
45
+ }, ColorDynamic.Blue50, IconContainer, ColorDynamic.White, HelpIcon, _ref4 => {
42
46
  var {
43
47
  $variant
44
48
  } = _ref4;
@@ -68,9 +72,11 @@ export var FlagListItem = /*#__PURE__*/forwardRef((_ref7, ref) => {
68
72
  children: [/*#__PURE__*/_jsxs(Content, {
69
73
  children: [/*#__PURE__*/_jsx(IconContainer, {
70
74
  children: variant === 'danger' ? /*#__PURE__*/_jsx(Error, {}) : variant === 'warning' ? /*#__PURE__*/_jsx(Warning, {}) : /*#__PURE__*/_jsx(Flag, {})
71
- }), children]
72
- }), /*#__PURE__*/_jsxs(EndActions, {
73
- children: [endAction, showHelpIcon && /*#__PURE__*/_jsx(Help, {})]
75
+ }), children, /*#__PURE__*/_jsx(HelpIcon, {
76
+ children: showHelpIcon && /*#__PURE__*/_jsx(Help, {})
77
+ })]
78
+ }), endAction && /*#__PURE__*/_jsx(EndActions, {
79
+ children: endAction
74
80
  })]
75
81
  }));
76
82
  });
package/dist-web/index.js CHANGED
@@ -1138,11 +1138,15 @@ var IconContainer = /*#__PURE__*/styled.div.withConfig({
1138
1138
  var Content = /*#__PURE__*/styled.div.withConfig({
1139
1139
  displayName: "FlagListItem__Content",
1140
1140
  componentId: "SD__sc-o5bqru-1"
1141
- })(["display:flex;align-items:center;gap:8px;"]);
1141
+ })(["display:flex;align-items:center;width:100%;gap:8px;"]);
1142
+ var HelpIcon = /*#__PURE__*/styled.div.withConfig({
1143
+ displayName: "FlagListItem__HelpIcon",
1144
+ componentId: "SD__sc-o5bqru-2"
1145
+ })(["margin-left:auto;& > svg{font-size:16px;color:", ";}"], ColorDynamic.Dark500);
1142
1146
  var EndActions = /*#__PURE__*/styled.div.withConfig({
1143
1147
  displayName: "FlagListItem__EndActions",
1144
- componentId: "SD__sc-o5bqru-2"
1145
- })(["display:flex;align-items:center;margin-left:auto;gap:8px;& > svg{font-size:16px;color:", ";}", "{margin-left:0;width:100%;}"], ColorDynamic.Dark500, _ref2 => {
1148
+ componentId: "SD__sc-o5bqru-3"
1149
+ })(["display:flex;align-items:center;margin-left:auto;gap:8px;", "{margin-left:0;width:100%;}"], _ref2 => {
1146
1150
  var {
1147
1151
  theme
1148
1152
  } = _ref2;
@@ -1152,13 +1156,13 @@ var BannerListItemDanger = /*#__PURE__*/css(["& ", "{background:", ";color:", ";
1152
1156
  var BannerListItemStandalone = /*#__PURE__*/css(["background:", ";"], ColorDynamic.Silver200);
1153
1157
  var BannerListContainer = /*#__PURE__*/styled.div.withConfig({
1154
1158
  displayName: "FlagListItem__BannerListContainer",
1155
- componentId: "SD__sc-o5bqru-3"
1156
- })(["display:inline-flex;align-items:center;padding:8px 16px 8px 12px;border:1px solid ", ";background:", ";cursor:default;transition:", ";& + &{border-top:none;}&:last-child{border-radius:0 0 4px 4px;}&:hover{background:", ";& ", "{background:", ";}& ", " > svg{color:", ";}}[data-variant='standalone'] &:not(:hover){", "}", " ", "{flex-direction:column;align-items:flex-start;}"], ColorDynamic.Silver400, ColorDynamic.White, _ref3 => {
1159
+ componentId: "SD__sc-o5bqru-4"
1160
+ })(["display:flex;align-items:center;gap:8px;padding:8px 16px 8px 12px;border:1px solid ", ";background:", ";cursor:default;transition:", ";& + &{border-top:none;}&:last-child{border-radius:0 0 4px 4px;}&:hover{background:", ";& ", "{background:", ";}& ", " > svg{color:", ";}}[data-variant='standalone'] &:not(:hover){", "}", " ", "{flex-direction:column;align-items:flex-start;}"], ColorDynamic.Silver400, ColorDynamic.White, _ref3 => {
1157
1161
  var {
1158
1162
  theme
1159
1163
  } = _ref3;
1160
1164
  return theme.transitions.create(['color', 'background-color']);
1161
- }, ColorDynamic.Blue50, IconContainer, ColorDynamic.White, EndActions, _ref4 => {
1165
+ }, ColorDynamic.Blue50, IconContainer, ColorDynamic.White, HelpIcon, _ref4 => {
1162
1166
  var {
1163
1167
  $variant
1164
1168
  } = _ref4;
@@ -1188,9 +1192,11 @@ var FlagListItem = /*#__PURE__*/forwardRef((_ref7, ref) => {
1188
1192
  children: [/*#__PURE__*/jsxs(Content, {
1189
1193
  children: [/*#__PURE__*/jsx(IconContainer, {
1190
1194
  children: variant === 'danger' ? /*#__PURE__*/jsx(Error$1, {}) : variant === 'warning' ? /*#__PURE__*/jsx(Warning, {}) : /*#__PURE__*/jsx(Flag, {})
1191
- }), children]
1192
- }), /*#__PURE__*/jsxs(EndActions, {
1193
- children: [endAction, showHelpIcon && /*#__PURE__*/jsx(Help, {})]
1195
+ }), children, /*#__PURE__*/jsx(HelpIcon, {
1196
+ children: showHelpIcon && /*#__PURE__*/jsx(Help, {})
1197
+ })]
1198
+ }), endAction && /*#__PURE__*/jsx(EndActions, {
1199
+ children: endAction
1194
1200
  })]
1195
1201
  }));
1196
1202
  });