@sproutsocial/racine 12.2.0-partner-logos.1 → 12.2.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.
@@ -182,90 +182,90 @@ const getIcon = (type, color) => {
182
182
 
183
183
  // eslint-disable-next-line prettier/prettier
184
184
  export const CheckboxContainer: StyledComponent<any, TypeTheme, *> = styled.span(
185
- (props) => css`
186
- display: inline-flex;
187
- align-items: center;
188
- box-sizing: border-box;
189
- position: relative;
190
- transition: all ${props.theme.duration.fast} ${props.theme.easing.ease_in};
191
-
192
- @supports (-webkit-appearance: none) {
193
- &:before {
194
- /* stylelint-disable */
195
- content: url("data:image/svg+xml;utf8,${getIcon(
196
- props.indeterminate ? "indeterminate" : "check",
197
-
198
- props.checked
199
- ? props.theme.colors.form.background.base
200
- : props.theme.colors.form.border.base
201
- )}");
202
- opacity: ${props.checked ? 1 : 0};
203
- position: absolute;
204
- width: ${props.theme.space[400]};
205
- height: ${props.theme.space[400]};
206
- text-align: center;
207
- transform: translateY(1px);
208
- line-height: 1;
209
- margin: auto;
210
- pointer-events: none;
211
- transition: ${props.theme.duration.fast}
212
- ${props.theme.easing.ease_inout};
213
- }
214
-
215
- &:hover:before {
216
- opacity: ${props.disabled && !props.checked ? 0 : 1};
217
- }
218
-
219
- ${props.disabled &&
220
- css`
221
- opacity: 0.4;
222
- `}
223
-
224
- input[type='checkbox'] {
225
- box-sizing: border-box;
226
- appearance: none;
227
- margin: 0;
228
- padding: 0;
229
- width: ${props.theme.space[400]};
230
- height: ${props.theme.space[400]};
231
- border: 1px solid ${props.theme.colors.form.border.base};
232
- border-radius: 4px;
233
- background-color: ${props.theme.colors.form.background.base};
234
- transition: all ${props.theme.duration.fast}
235
- ${props.theme.easing.ease_in};
236
- cursor: ${props.disabled ? "not-allowed" : "pointer"};
237
- flex-shrink: 0;
238
-
239
- &:not(:checked) {
240
- ${!props.indeterminate &&
241
- css`
242
- border-color: ${props.theme.colors
243
- .neutral[300]} !important; /* We don't want the focus ring to remove the border */
244
- background-color: ${props.theme.colors.form.background.base};
245
- `}
185
+ (props) => css`
186
+ display: inline-flex;
187
+ align-items: center;
188
+ box-sizing: border-box;
189
+ position: relative;
190
+ transition: all ${props.theme.duration.fast} ${props.theme.easing.ease_in};
191
+
192
+ @supports (-webkit-appearance: none) {
193
+ &:before {
194
+ /* stylelint-disable */
195
+ content: url("data:image/svg+xml;utf8,${getIcon(
196
+ props.indeterminate ? "indeterminate" : "check",
197
+
198
+ props.checked
199
+ ? props.theme.colors.form.background.base
200
+ : props.theme.colors.form.border.base
201
+ )}");
202
+ opacity: ${props.checked ? 1 : 0};
203
+ position: absolute;
204
+ width: ${props.theme.space[400]};
205
+ height: ${props.theme.space[400]};
206
+ text-align: center;
207
+ transform: translateY(1px);
208
+ line-height: 1;
209
+ margin: auto;
210
+ pointer-events: none;
211
+ transition: ${props.theme.duration.fast}
212
+ ${props.theme.easing.ease_inout};
246
213
  }
247
214
 
248
- &:checked {
249
- border-color: ${props.theme.colors.form.border.selected};
250
- background-color: ${props.theme.colors.form.background.selected};
215
+ &:hover:before {
216
+ opacity: ${props.disabled && !props.checked ? 0 : 1};
251
217
  }
252
218
 
253
- ${props.indeterminate &&
254
- props.checked &&
219
+ ${props.disabled &&
255
220
  css`
256
- border-color: ${props.theme.colors.form.border.selected} !important;
257
- background-color: ${props.theme.colors.form.background
258
- .selected} !important;
221
+ opacity: 0.4;
259
222
  `}
260
223
 
261
- &:focus {
262
- ${focusRing}
224
+ input[type='checkbox'] {
225
+ box-sizing: border-box;
226
+ appearance: none;
227
+ margin: 0;
228
+ padding: 0;
229
+ width: ${props.theme.space[400]};
230
+ height: ${props.theme.space[400]};
231
+ border: 1px solid ${props.theme.colors.form.border.base};
232
+ border-radius: 4px;
233
+ background-color: ${props.theme.colors.form.background.base};
234
+ transition: all ${props.theme.duration.fast}
235
+ ${props.theme.easing.ease_in};
236
+ cursor: ${props.disabled ? "not-allowed" : "pointer"};
237
+ flex-shrink: 0;
238
+
239
+ &:not(:checked) {
240
+ ${!props.indeterminate &&
241
+ css`
242
+ border-color: ${props.theme.colors
243
+ .neutral[300]} !important; /* We don't want the focus ring to remove the border */
244
+ background-color: ${props.theme.colors.form.background.base};
245
+ `}
246
+ }
247
+
248
+ &:checked {
249
+ border-color: ${props.theme.colors.form.border.selected};
250
+ background-color: ${props.theme.colors.form.background.selected};
251
+ }
252
+
253
+ ${props.indeterminate &&
254
+ props.checked &&
255
+ css`
256
+ border-color: ${props.theme.colors.form.border.selected} !important;
257
+ background-color: ${props.theme.colors.form.background
258
+ .selected} !important;
259
+ `}
260
+
261
+ &:focus {
262
+ ${focusRing}
263
+ }
263
264
  }
264
265
  }
265
- }
266
266
 
267
- ${COMMON}
268
- `
269
- );
267
+ ${COMMON}
268
+ `
269
+ );
270
270
 
271
271
  export default Container;
@@ -73,9 +73,8 @@ const Trigger = ({ children, ...rest }) => {
73
73
  };
74
74
 
75
75
  const Panel = ({ children, ...rest }) => {
76
- const { isOpen, id, offset, collapsedHeight, openHeight } = useContext(
77
- CollapsibleContext
78
- );
76
+ const { isOpen, id, offset, collapsedHeight, openHeight } =
77
+ useContext(CollapsibleContext);
79
78
  const ref = useRef();
80
79
  const measurement = useMeasure(ref);
81
80
  const [isHidden, setIsHidden] = useState(undefined);
@@ -80,16 +80,8 @@ export default class Image extends React.Component<TypeProps, TypeState> {
80
80
  };
81
81
 
82
82
  render() {
83
- const {
84
- alt,
85
- title,
86
- onClick,
87
- onError,
88
- onLoad,
89
- src,
90
- qa,
91
- ...rest
92
- } = this.props;
83
+ const { alt, title, onClick, onError, onLoad, src, qa, ...rest } =
84
+ this.props;
93
85
 
94
86
  return (
95
87
  <ImageContainer
@@ -17,9 +17,8 @@ type TypeSegmentedControlContext = {
17
17
  onChange: (e: SyntheticInputEvent<HTMLInputElement>) => void,
18
18
  };
19
19
 
20
- const SegmentedControlContext = React.createContext<?TypeSegmentedControlContext>(
21
- null
22
- );
20
+ const SegmentedControlContext =
21
+ React.createContext<?TypeSegmentedControlContext>(null);
23
22
 
24
23
  type TypeSegmentedControlItemProps = {
25
24
  /** The value of this item. Should be unique among sibling items. */
@@ -22,15 +22,8 @@ export type TypeTableCell = {
22
22
  */
23
23
  export default class TableCell extends React.Component<TypeTableCell> {
24
24
  render() {
25
- const {
26
- id,
27
- content,
28
- colSpan,
29
- width,
30
- align,
31
- children,
32
- ...rest
33
- } = this.props;
25
+ const { id, content, colSpan, width, align, children, ...rest } =
26
+ this.props;
34
27
 
35
28
  return (
36
29
  <Container
@@ -32,15 +32,8 @@ export default class ToggleHint extends React.Component<TypeProps> {
32
32
  };
33
33
 
34
34
  render() {
35
- const {
36
- icon,
37
- isOpen,
38
- openString,
39
- closeString,
40
- qa,
41
- className,
42
- ...rest
43
- } = this.props;
35
+ const { icon, isOpen, openString, closeString, qa, className, ...rest } =
36
+ this.props;
44
37
 
45
38
  return (
46
39
  <Container
package/__flow__/index.js CHANGED
@@ -72,3 +72,4 @@ export { default as Listbox, ListboxButton } from "./Listbox";
72
72
  export { default as OverflowList } from "./OverflowList";
73
73
  export { SingleDatePicker, DateRangePicker } from "./DatePicker";
74
74
  export { VisuallyHidden } from "./VisuallyHidden";
75
+ export { default as PartnerLogo } from "./PartnerLogo";
@@ -14,7 +14,8 @@ import type {
14
14
 
15
15
  // https://styled-system.com/table#color
16
16
 
17
- type TypeBackgroundColorSystemProp = TypeResponsiveBaseSystemProp<BackgroundColorProperty>;
17
+ type TypeBackgroundColorSystemProp =
18
+ TypeResponsiveBaseSystemProp<BackgroundColorProperty>;
18
19
  export type TypeColorSystemProps = $ReadOnly<{|
19
20
  backgroundColor?: TypeBackgroundColorSystemProp,
20
21
  bg?: TypeBackgroundColorSystemProp,
@@ -19,21 +19,13 @@ describe("normalizeResponsiveProp", () => {
19
19
 
20
20
  it("should handle arrays with 4 values", () => {
21
21
  expect(normalizeResponsiveProp([0, 1, 2, 3])).toMatchObject([
22
- 0,
23
- 1,
24
- 2,
25
- 3,
26
- 3,
22
+ 0, 1, 2, 3, 3,
27
23
  ]);
28
24
  });
29
25
 
30
26
  it("should handle arrays with 5 values", () => {
31
27
  expect(normalizeResponsiveProp([0, 1, 2, 3, 4])).toMatchObject([
32
- 0,
33
- 1,
34
- 2,
35
- 3,
36
- 4,
28
+ 0, 1, 2, 3, 4,
37
29
  ]);
38
30
  });
39
31
  });
package/commonjs/index.js CHANGED
@@ -62,6 +62,7 @@ var _exportNames = {
62
62
  Menu: true,
63
63
  Listbox: true,
64
64
  OverflowList: true,
65
+ PartnerLogo: true,
65
66
  sproutLightTheme: true,
66
67
  sproutDarkTheme: true,
67
68
  toast: true,
@@ -73,7 +74,7 @@ var _exportNames = {
73
74
  DateRangePicker: true,
74
75
  VisuallyHidden: true
75
76
  };
76
- exports.visuallyHidden = exports.useTextContent = exports.useSelect = exports.useMultiselect = exports.useInteractiveColor = exports.toast = exports.theme = exports.sproutLightTheme = exports.sproutDarkTheme = exports.focusRing = exports.disabled = exports.darkTheme = exports.VisuallyHidden = exports.Tooltip = exports.TokenInput = exports.Token = exports.ToggleHint = exports.ToastContainer = exports.ThemeProvider = exports.Textarea = exports.Text = exports.Tabs = exports.TableRowAccordion = exports.TableHeaderCell = exports.TableCell = exports.Table = exports.Switch = exports.Stack = exports.Skeleton = exports.SingleDatePicker = exports.Select = exports.SegmentedControl = exports.Radio = exports.Popout = exports.OverflowList = exports.Numeral = exports.Modal = exports.Message = exports.MenuItemContainer = exports.MenuButtonContext = exports.MenuButton = exports.Menu = exports.LoaderButton = exports.Loader = exports.ListboxButton = exports.Listbox = exports.Link = exports.Label = exports.KeyboardKey = exports.Input = exports.Indicator = exports.Image = exports.Icon = exports.FormField = exports.Fieldset = exports.EmptyState = exports.Drawer = exports.DateRangePicker = exports.Collapsible = exports.Checkbox = exports.ChartLegend = exports.CharacterCounter = exports.Card = exports.Button = exports.Breadcrumb = exports.Box = exports.Banner = exports.Badge = exports.Avatar = exports.Alert = void 0;
77
+ exports.visuallyHidden = exports.useTextContent = exports.useSelect = exports.useMultiselect = exports.useInteractiveColor = exports.toast = exports.theme = exports.sproutLightTheme = exports.sproutDarkTheme = exports.focusRing = exports.disabled = exports.darkTheme = exports.VisuallyHidden = exports.Tooltip = exports.TokenInput = exports.Token = exports.ToggleHint = exports.ToastContainer = exports.ThemeProvider = exports.Textarea = exports.Text = exports.Tabs = exports.TableRowAccordion = exports.TableHeaderCell = exports.TableCell = exports.Table = exports.Switch = exports.Stack = exports.Skeleton = exports.SingleDatePicker = exports.Select = exports.SegmentedControl = exports.Radio = exports.Popout = exports.PartnerLogo = exports.OverflowList = exports.Numeral = exports.Modal = exports.Message = exports.MenuItemContainer = exports.MenuButtonContext = exports.MenuButton = exports.Menu = exports.LoaderButton = exports.Loader = exports.ListboxButton = exports.Listbox = exports.Link = exports.Label = exports.KeyboardKey = exports.Input = exports.Indicator = exports.Image = exports.Icon = exports.FormField = exports.Fieldset = exports.EmptyState = exports.Drawer = exports.DateRangePicker = exports.Collapsible = exports.Checkbox = exports.ChartLegend = exports.CharacterCounter = exports.Card = exports.Button = exports.Breadcrumb = exports.Box = exports.Banner = exports.Badge = exports.Avatar = exports.Alert = void 0;
77
78
 
78
79
  var _systemProps = require("./systemProps");
79
80
 
@@ -334,6 +335,10 @@ var _VisuallyHidden = require("./VisuallyHidden");
334
335
 
335
336
  exports.VisuallyHidden = _VisuallyHidden.VisuallyHidden;
336
337
 
338
+ var _PartnerLogo = _interopRequireDefault(require("./PartnerLogo"));
339
+
340
+ exports.PartnerLogo = _PartnerLogo.default;
341
+
337
342
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
338
343
 
339
344
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
package/lib/index.js CHANGED
@@ -60,4 +60,5 @@ export { MenuItemContainer } from "./Menu/styles";
60
60
  export { default as Listbox, ListboxButton } from "./Listbox";
61
61
  export { default as OverflowList } from "./OverflowList";
62
62
  export { SingleDatePicker, DateRangePicker } from "./DatePicker";
63
- export { VisuallyHidden } from "./VisuallyHidden";
63
+ export { VisuallyHidden } from "./VisuallyHidden";
64
+ export { default as PartnerLogo } from "./PartnerLogo";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sproutsocial/racine",
3
- "version": "12.2.0-partner-logos.1",
3
+ "version": "12.2.0",
4
4
  "license": "MIT",
5
5
  "files": [
6
6
  "__flow__",
@@ -9,7 +9,7 @@
9
9
  "lib",
10
10
  "codemods",
11
11
  "bin/racine-codemod.js",
12
- "bin/buildNpm.js"
12
+ "CHANGELOG.md"
13
13
  ],
14
14
  "bin": {
15
15
  "racine-codemod": "bin/racine-codemod.js",