@sproutsocial/racine 21.0.0 → 21.0.2

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/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # Change Log
2
2
 
3
+ ## 21.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - 75faf70: Fixes a bug where checkboxes were rendering incorrectly.
8
+
9
+ ## 21.0.1
10
+
11
+ ### Patch Changes
12
+
13
+ - d2988bb: Add border to avatar when src provided but errors
14
+
3
15
  ## 21.0.0
4
16
 
5
17
  ### Major Changes
@@ -52,8 +52,9 @@ var Container = (0, _styledComponents.default)(_Box.default).withConfig({
52
52
  type = _ref3.type,
53
53
  bg = _ref3.bg,
54
54
  $src = _ref3.$src,
55
- borderColor = _ref3.borderColor;
56
- return (0, _styledComponents.css)(["background:", ";border:", ";border-color:", ";color:", ";"], bg ? bg : theme.colors.container.background.decorative[type], $src ? "none" : "1px solid", borderColor ? borderColor : theme.colors.container.border.decorative[type], theme.colors.text.decorative[type]);
55
+ borderColor = _ref3.borderColor,
56
+ imageFailedLoading = _ref3.imageFailedLoading;
57
+ return (0, _styledComponents.css)(["background:", ";border:", ";border-color:", ";color:", ";"], bg ? bg : theme.colors.container.background.decorative[type], $src && !imageFailedLoading ? 'none' : "1px solid", borderColor ? borderColor : theme.colors.container.border.decorative[type], theme.colors.text.decorative[type]);
57
58
  });
58
59
  var getInitials = function getInitials(name) {
59
60
  var fallback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "?";
@@ -124,7 +125,8 @@ var Avatar = exports.Avatar = function Avatar(_ref4) {
124
125
  variant: variant,
125
126
  type: colorType,
126
127
  "data-qa-user-avatar": name,
127
- $src: src
128
+ $src: src,
129
+ imageFailedLoading: imageFailedLoading
128
130
  }, rest), !src || imageFailedLoading ? /*#__PURE__*/React.createElement(AvatarText, {
129
131
  lineHeight: size,
130
132
  fontWeight: "semibold",
@@ -129,6 +129,6 @@ var CheckboxContainer = exports.CheckboxContainer = _styledComponents.default.sp
129
129
  displayName: "styles__CheckboxContainer",
130
130
  componentId: "sc-1hcgibh-6"
131
131
  })(function (props) {
132
- return (0, _styledComponents.css)(["display:inline-flex;align-items:center;box-sizing:border-box;position:relative;transition:all ", " ", ";@supports (-webkit-appearance:none){&:before{content:url(\"data:image/svg+xml;utf8,", "\");opacity:", ";position:absolute;width:", ";height:", ";text-align:center;transform:translateY(1px);line-height:1;margin:auto;pointer-events:none;transition:", " ", ";}&:hover:before{opacity:", ";}", " input[type='checkbox']{box-sizing:border-box;appearance:none;margin:0;padding:0;width:", ";height:", ";border:1px solid ", ";border-radius:4px;background-color:", ";transition:all ", " ", ";cursor:", ";flex-shrink:0;&:not(:checked){", "}&:checked{border-color:", ";background-color:", ";}", " &:focus{", "}}}", ""], props.theme.duration.fast, props.theme.easing.ease_in, (0, _server.renderToStaticMarkup)(getIcon(props.indeterminate ? "indeterminate" : "check", props.checked ? props.theme.colors.form.background.base : props.theme.colors.form.border.base)), props.checked ? 1 : 0, props.theme.space[400], props.theme.space[400], props.theme.duration.fast, props.theme.easing.ease_inout, props.disabled && !props.checked ? 0 : 1, props.disabled && (0, _styledComponents.css)(["opacity:0.4;"]), props.theme.space[400], props.theme.space[400], props.theme.colors.form.border.base, props.theme.colors.form.background.base, props.theme.duration.fast, props.theme.easing.ease_in, props.disabled ? "not-allowed" : "pointer", !props.indeterminate && (0, _styledComponents.css)(["border-color:", " !important;background-color:", ";"], props.theme.colors.form.border.base, props.theme.colors.form.background.base), props.theme.colors.form.border.selected, props.theme.colors.form.background.selected, props.indeterminate && props.checked && (0, _styledComponents.css)(["border-color:", " !important;background-color:", " !important;"], props.theme.colors.form.border.selected, props.theme.colors.form.background.selected), _mixins.focusRing, _systemProps.COMMON);
132
+ return (0, _styledComponents.css)(["display:inline-flex;align-items:center;box-sizing:border-box;position:relative;transition:all ", " ", ";@supports (-webkit-appearance:none){&:before{content:url('data:image/svg+xml;utf8,", "');opacity:", ";position:absolute;width:", ";height:", ";text-align:center;transform:translateY(1px);line-height:1;margin:auto;pointer-events:none;transition:", " ", ";}&:hover:before{opacity:", ";}", " input[type='checkbox']{box-sizing:border-box;appearance:none;margin:0;padding:0;width:", ";height:", ";border:1px solid ", ";border-radius:4px;background-color:", ";transition:all ", " ", ";cursor:", ";flex-shrink:0;&:not(:checked){", "}&:checked{border-color:", ";background-color:", ";}", " &:focus{", "}}}", ""], props.theme.duration.fast, props.theme.easing.ease_in, (0, _server.renderToStaticMarkup)(getIcon(props.indeterminate ? "indeterminate" : "check", props.checked ? props.theme.colors.form.background.base : props.theme.colors.form.border.base)), props.checked ? 1 : 0, props.theme.space[400], props.theme.space[400], props.theme.duration.fast, props.theme.easing.ease_inout, props.disabled && !props.checked ? 0 : 1, props.disabled && (0, _styledComponents.css)(["opacity:0.4;"]), props.theme.space[400], props.theme.space[400], props.theme.colors.form.border.base, props.theme.colors.form.background.base, props.theme.duration.fast, props.theme.easing.ease_in, props.disabled ? "not-allowed" : "pointer", !props.indeterminate && (0, _styledComponents.css)(["border-color:", " !important;background-color:", ";"], props.theme.colors.form.border.base, props.theme.colors.form.background.base), props.theme.colors.form.border.selected, props.theme.colors.form.background.selected, props.indeterminate && props.checked && (0, _styledComponents.css)(["border-color:", " !important;background-color:", " !important;"], props.theme.colors.form.border.selected, props.theme.colors.form.background.selected), _mixins.focusRing, _systemProps.COMMON);
133
133
  });
134
134
  var _default = exports.default = Container;
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EACV,eAAe,EAEf,cAAc,EACf,MAAM,eAAe,CAAC;AAgCvB,eAAO,MAAM,cAAc,SACnB,MAAM,QACN,cAAc,KACnB,cAuBF,CAAC;AAEF,eAAO,MAAM,MAAM,uEAUhB,eAAe,gBAoDjB,CAAC;;AACF,wBAA4B"}
1
+ {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EACV,eAAe,EAEf,cAAc,EACf,MAAM,eAAe,CAAC;AAgCvB,eAAO,MAAM,cAAc,SACnB,MAAM,QACN,cAAc,KACnB,cAuBF,CAAC;AAEF,eAAO,MAAM,MAAM,uEAUhB,eAAe,gBAqDjB,CAAC;;AACF,wBAA4B"}
@@ -21,5 +21,6 @@ export interface TypeAvatarContainerProps extends TypeBoxContainerProps {
21
21
  variant: TypeAvatarVariant;
22
22
  bg?: string;
23
23
  $src?: TypeAvatarProps["src"];
24
+ imageFailedLoading?: boolean;
24
25
  }
25
26
  //# sourceMappingURL=AvatarTypes.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"AvatarTypes.d.ts","sourceRoot":"","sources":["../../../src/Avatar/AvatarTypes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,IAAI,qBAAqB,EAAE,MAAM,UAAU,CAAC;AACvE,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEjD,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,kBAAkB,CAAC;AAC7D,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,OAAO,CAAC;AAGjD,MAAM,WAAW,eAAgB,SAAQ,qBAAqB;IAC5D,4FAA4F;IAC5F,UAAU,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAE/B,sDAAsD;IACtD,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,qHAAqH;IACrH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,+FAA+F;IAC/F,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,wBAAyB,SAAQ,qBAAqB;IACrE,IAAI,EAAE,cAAc,CAAC;IACrB,OAAO,EAAE,iBAAiB,CAAC;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;CAC/B"}
1
+ {"version":3,"file":"AvatarTypes.d.ts","sourceRoot":"","sources":["../../../src/Avatar/AvatarTypes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,IAAI,qBAAqB,EAAE,MAAM,UAAU,CAAC;AACvE,OAAO,EAAE,kBAAkB,EAAE,MAAM,aAAa,CAAC;AAEjD,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,kBAAkB,CAAC;AAC7D,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,OAAO,CAAC;AAGjD,MAAM,WAAW,eAAgB,SAAQ,qBAAqB;IAC5D,4FAA4F;IAC5F,UAAU,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAE/B,sDAAsD;IACtD,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,qHAAqH;IACrH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,+FAA+F;IAC/F,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,wBAAyB,SAAQ,qBAAqB;IACrE,IAAI,EAAE,cAAc,CAAC;IACrB,OAAO,EAAE,iBAAiB,CAAC;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;IAC9B,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B"}
@@ -42,8 +42,9 @@ var Container = styled(Box).withConfig({
42
42
  type = _ref3.type,
43
43
  bg = _ref3.bg,
44
44
  $src = _ref3.$src,
45
- borderColor = _ref3.borderColor;
46
- return css(["background:", ";border:", ";border-color:", ";color:", ";"], bg ? bg : theme.colors.container.background.decorative[type], $src ? "none" : "1px solid", borderColor ? borderColor : theme.colors.container.border.decorative[type], theme.colors.text.decorative[type]);
45
+ borderColor = _ref3.borderColor,
46
+ imageFailedLoading = _ref3.imageFailedLoading;
47
+ return css(["background:", ";border:", ";border-color:", ";color:", ";"], bg ? bg : theme.colors.container.background.decorative[type], $src && !imageFailedLoading ? 'none' : "1px solid", borderColor ? borderColor : theme.colors.container.border.decorative[type], theme.colors.text.decorative[type]);
47
48
  });
48
49
  var getInitials = function getInitials(name) {
49
50
  var fallback = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "?";
@@ -114,7 +115,8 @@ export var Avatar = function Avatar(_ref4) {
114
115
  variant: variant,
115
116
  type: colorType,
116
117
  "data-qa-user-avatar": name,
117
- $src: src
118
+ $src: src,
119
+ imageFailedLoading: imageFailedLoading
118
120
  }, rest), !src || imageFailedLoading ? /*#__PURE__*/React.createElement(AvatarText, {
119
121
  lineHeight: size,
120
122
  fontWeight: "semibold",
@@ -119,6 +119,6 @@ export var CheckboxContainer = styled.span.withConfig({
119
119
  displayName: "styles__CheckboxContainer",
120
120
  componentId: "sc-1hcgibh-6"
121
121
  })(function (props) {
122
- return css(["display:inline-flex;align-items:center;box-sizing:border-box;position:relative;transition:all ", " ", ";@supports (-webkit-appearance:none){&:before{content:url(\"data:image/svg+xml;utf8,", "\");opacity:", ";position:absolute;width:", ";height:", ";text-align:center;transform:translateY(1px);line-height:1;margin:auto;pointer-events:none;transition:", " ", ";}&:hover:before{opacity:", ";}", " input[type='checkbox']{box-sizing:border-box;appearance:none;margin:0;padding:0;width:", ";height:", ";border:1px solid ", ";border-radius:4px;background-color:", ";transition:all ", " ", ";cursor:", ";flex-shrink:0;&:not(:checked){", "}&:checked{border-color:", ";background-color:", ";}", " &:focus{", "}}}", ""], props.theme.duration.fast, props.theme.easing.ease_in, renderToStaticMarkup(getIcon(props.indeterminate ? "indeterminate" : "check", props.checked ? props.theme.colors.form.background.base : props.theme.colors.form.border.base)), props.checked ? 1 : 0, props.theme.space[400], props.theme.space[400], props.theme.duration.fast, props.theme.easing.ease_inout, props.disabled && !props.checked ? 0 : 1, props.disabled && css(["opacity:0.4;"]), props.theme.space[400], props.theme.space[400], props.theme.colors.form.border.base, props.theme.colors.form.background.base, props.theme.duration.fast, props.theme.easing.ease_in, props.disabled ? "not-allowed" : "pointer", !props.indeterminate && css(["border-color:", " !important;background-color:", ";"], props.theme.colors.form.border.base, props.theme.colors.form.background.base), props.theme.colors.form.border.selected, props.theme.colors.form.background.selected, props.indeterminate && props.checked && css(["border-color:", " !important;background-color:", " !important;"], props.theme.colors.form.border.selected, props.theme.colors.form.background.selected), focusRing, COMMON);
122
+ return css(["display:inline-flex;align-items:center;box-sizing:border-box;position:relative;transition:all ", " ", ";@supports (-webkit-appearance:none){&:before{content:url('data:image/svg+xml;utf8,", "');opacity:", ";position:absolute;width:", ";height:", ";text-align:center;transform:translateY(1px);line-height:1;margin:auto;pointer-events:none;transition:", " ", ";}&:hover:before{opacity:", ";}", " input[type='checkbox']{box-sizing:border-box;appearance:none;margin:0;padding:0;width:", ";height:", ";border:1px solid ", ";border-radius:4px;background-color:", ";transition:all ", " ", ";cursor:", ";flex-shrink:0;&:not(:checked){", "}&:checked{border-color:", ";background-color:", ";}", " &:focus{", "}}}", ""], props.theme.duration.fast, props.theme.easing.ease_in, renderToStaticMarkup(getIcon(props.indeterminate ? "indeterminate" : "check", props.checked ? props.theme.colors.form.background.base : props.theme.colors.form.border.base)), props.checked ? 1 : 0, props.theme.space[400], props.theme.space[400], props.theme.duration.fast, props.theme.easing.ease_inout, props.disabled && !props.checked ? 0 : 1, props.disabled && css(["opacity:0.4;"]), props.theme.space[400], props.theme.space[400], props.theme.colors.form.border.base, props.theme.colors.form.background.base, props.theme.duration.fast, props.theme.easing.ease_in, props.disabled ? "not-allowed" : "pointer", !props.indeterminate && css(["border-color:", " !important;background-color:", ";"], props.theme.colors.form.border.base, props.theme.colors.form.background.base), props.theme.colors.form.border.selected, props.theme.colors.form.background.selected, props.indeterminate && props.checked && css(["border-color:", " !important;background-color:", " !important;"], props.theme.colors.form.border.selected, props.theme.colors.form.background.selected), focusRing, COMMON);
123
123
  });
124
124
  export default Container;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sproutsocial/racine",
3
- "version": "21.0.0",
3
+ "version": "21.0.2",
4
4
  "license": "MIT",
5
5
  "engines": {
6
6
  "node": ">=18"