glints-aries 4.0.167 → 4.0.169

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 (85) hide show
  1. package/es/@next/Badge/Badge.d.ts +9 -0
  2. package/es/@next/Badge/Badge.js +21 -0
  3. package/es/@next/Badge/Badge.stories.d.ts +4 -0
  4. package/es/@next/Badge/Badge.stories.js +19 -0
  5. package/es/@next/Badge/BadgeStyle.d.ts +2 -0
  6. package/es/@next/Badge/BadgeStyle.js +22 -0
  7. package/es/@next/Badge/index.d.ts +1 -0
  8. package/es/@next/Badge/index.js +1 -0
  9. package/es/@next/Button/Button.d.ts +5 -1
  10. package/es/@next/Button/Button.js +23 -5
  11. package/es/@next/Button/Button.stories.d.ts +1 -0
  12. package/es/@next/Button/Button.stories.js +23 -0
  13. package/es/@next/Button/ButtonStyle.d.ts +1 -4
  14. package/es/@next/Button/ButtonStyle.js +9 -22
  15. package/es/@next/Button/DesctructiveButtonStyle.d.ts +1 -1
  16. package/es/@next/Button/DesctructiveButtonStyle.js +1 -1
  17. package/es/@next/Button/OutlineButtonStyle.d.ts +1 -1
  18. package/es/@next/Button/OutlineMonochromeStyle.d.ts +1 -2
  19. package/es/@next/Button/OutlineMonochromeStyle.js +2 -5
  20. package/es/@next/Button/PrimaryButtonStyle.d.ts +1 -1
  21. package/es/@next/Button/PrimaryButtonStyle.js +1 -1
  22. package/es/@next/ButtonGroup/ButtonGroup.stories.js +3 -1
  23. package/es/@next/ButtonGroup/ButtonGroupStyle.js +3 -3
  24. package/es/@next/Checkbox/Checkbox.d.ts +1 -1
  25. package/es/@next/Checkbox/Checkbox.js +2 -2
  26. package/es/@next/Icon/IconStoriesStyles.js +1 -1
  27. package/es/@next/Icon/components/RiFacebook.d.ts +3 -0
  28. package/es/@next/Icon/components/RiFacebook.js +11 -0
  29. package/es/@next/Icon/components/RiLoader.d.ts +3 -0
  30. package/es/@next/Icon/components/RiLoader.js +12 -0
  31. package/es/@next/Icon/components/RiLocation.d.ts +3 -0
  32. package/es/@next/Icon/components/RiLocation.js +11 -0
  33. package/es/@next/Icon/components/RiTwitter.d.ts +3 -0
  34. package/es/@next/Icon/components/RiTwitter.js +11 -0
  35. package/es/@next/Icon/components/index.d.ts +4 -0
  36. package/es/@next/Icon/components/index.js +5 -1
  37. package/es/@next/Icon/icons/icons.d.ts +1 -1
  38. package/es/@next/Icon/icons/icons.js +2 -2
  39. package/es/@next/Spinner/Spinner.d.ts +3 -0
  40. package/es/@next/Spinner/Spinner.js +15 -0
  41. package/es/@next/index.d.ts +4 -3
  42. package/es/@next/index.js +4 -3
  43. package/lib/@next/Badge/Badge.d.ts +9 -0
  44. package/lib/@next/Badge/Badge.js +27 -0
  45. package/lib/@next/Badge/Badge.stories.d.ts +4 -0
  46. package/lib/@next/Badge/Badge.stories.js +26 -0
  47. package/lib/@next/Badge/BadgeStyle.d.ts +2 -0
  48. package/lib/@next/Badge/BadgeStyle.js +28 -0
  49. package/lib/@next/Badge/index.d.ts +1 -0
  50. package/lib/@next/Badge/index.js +9 -0
  51. package/lib/@next/Button/Button.d.ts +5 -1
  52. package/lib/@next/Button/Button.js +22 -4
  53. package/lib/@next/Button/Button.stories.d.ts +1 -0
  54. package/lib/@next/Button/Button.stories.js +25 -1
  55. package/lib/@next/Button/ButtonStyle.d.ts +1 -4
  56. package/lib/@next/Button/ButtonStyle.js +11 -24
  57. package/lib/@next/Button/DesctructiveButtonStyle.d.ts +1 -1
  58. package/lib/@next/Button/DesctructiveButtonStyle.js +1 -1
  59. package/lib/@next/Button/OutlineButtonStyle.d.ts +1 -1
  60. package/lib/@next/Button/OutlineMonochromeStyle.d.ts +1 -2
  61. package/lib/@next/Button/OutlineMonochromeStyle.js +2 -5
  62. package/lib/@next/Button/PrimaryButtonStyle.d.ts +1 -1
  63. package/lib/@next/Button/PrimaryButtonStyle.js +1 -1
  64. package/lib/@next/ButtonGroup/ButtonGroup.stories.js +3 -1
  65. package/lib/@next/ButtonGroup/ButtonGroupStyle.js +3 -3
  66. package/lib/@next/Checkbox/Checkbox.d.ts +1 -1
  67. package/lib/@next/Checkbox/Checkbox.js +2 -2
  68. package/lib/@next/Icon/IconStoriesStyles.js +1 -1
  69. package/lib/@next/Icon/components/RiFacebook.d.ts +3 -0
  70. package/lib/@next/Icon/components/RiFacebook.js +19 -0
  71. package/lib/@next/Icon/components/RiLoader.d.ts +3 -0
  72. package/lib/@next/Icon/components/RiLoader.js +20 -0
  73. package/lib/@next/Icon/components/RiLocation.d.ts +3 -0
  74. package/lib/@next/Icon/components/RiLocation.js +19 -0
  75. package/lib/@next/Icon/components/RiTwitter.d.ts +3 -0
  76. package/lib/@next/Icon/components/RiTwitter.js +19 -0
  77. package/lib/@next/Icon/components/index.d.ts +4 -0
  78. package/lib/@next/Icon/components/index.js +10 -2
  79. package/lib/@next/Icon/icons/icons.d.ts +1 -1
  80. package/lib/@next/Icon/icons/icons.js +2 -2
  81. package/lib/@next/Spinner/Spinner.d.ts +3 -0
  82. package/lib/@next/Spinner/Spinner.js +21 -0
  83. package/lib/@next/index.d.ts +4 -3
  84. package/lib/@next/index.js +9 -7
  85. package/package.json +1 -1
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ declare const badgeStatusVariant: readonly ["neutral", "success", "informational", "warning", "critical", "promotion", "new"];
3
+ export declare type BadgeStatusVariant = typeof badgeStatusVariant[number];
4
+ export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement> {
5
+ children?: React.ReactNode;
6
+ status?: BadgeStatusVariant;
7
+ }
8
+ export declare const Badge: ({ children, status, ...props }: BadgeProps) => JSX.Element;
9
+ export {};
@@ -0,0 +1,21 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
3
+ var _excluded = ["children", "status"];
4
+ import React from 'react';
5
+ import { Typography } from '../Typography';
6
+ import { Neutral } from '../utilities/colors';
7
+ import { BadgeStyle } from './BadgeStyle';
8
+ var badgeStatusVariant = ['neutral', 'success', 'informational', 'warning', 'critical', 'promotion', 'new'];
9
+ export var Badge = function Badge(_ref) {
10
+ var children = _ref.children,
11
+ status = _ref.status,
12
+ props = _objectWithoutPropertiesLoose(_ref, _excluded);
13
+ var content = typeof children === 'string' ? /*#__PURE__*/React.createElement(Typography, {
14
+ variant: "overline",
15
+ color: status === 'new' ? Neutral.B100 : Neutral.B18,
16
+ as: 'span'
17
+ }, children) : children;
18
+ return /*#__PURE__*/React.createElement(BadgeStyle, _extends({
19
+ status: status ? status : 'neutral'
20
+ }, props), /*#__PURE__*/React.createElement("div", null, content));
21
+ };
@@ -0,0 +1,4 @@
1
+ import { Meta } from '@storybook/react';
2
+ declare const _default: Meta<import("@storybook/react").Args>;
3
+ export default _default;
4
+ export declare const Interactive: any;
@@ -0,0 +1,19 @@
1
+ import React from 'react';
2
+ import { BaseContainer } from '../../Layout/GlintsContainer/GlintsContainer';
3
+ import { Badge } from './Badge';
4
+ Badge.displayName = 'Badge';
5
+ var defaultText = 'Badge';
6
+ export default {
7
+ title: '@next/Badge',
8
+ component: Badge,
9
+ decorators: [function (Story) {
10
+ return /*#__PURE__*/React.createElement(BaseContainer, null, Story());
11
+ }]
12
+ };
13
+ var Template = function Template(args) {
14
+ return /*#__PURE__*/React.createElement(Badge, args, defaultText);
15
+ };
16
+ export var Interactive = Template.bind({});
17
+ Interactive.args = {
18
+ status: null
19
+ };
@@ -0,0 +1,2 @@
1
+ import { BadgeProps } from './Badge';
2
+ export declare const BadgeStyle: import("styled-components").StyledComponent<"div", any, BadgeProps, never>;
@@ -0,0 +1,22 @@
1
+ var _badgeBackgroundColor;
2
+ import styled from 'styled-components';
3
+ import { borderRadius20 } from '../utilities/borderRadius';
4
+ import { Blue, Green, Neutral, Orange, Red, Yellow } from '../utilities/colors';
5
+ import { space8 } from '../utilities/spacing';
6
+ var badgeBackgroundColor = (_badgeBackgroundColor = {}, _badgeBackgroundColor['neutral'] = Neutral.B95, _badgeBackgroundColor['success'] = Green.B89, _badgeBackgroundColor['informational'] = Blue.S08, _badgeBackgroundColor['warning'] = Orange.S42, _badgeBackgroundColor['critical'] = Red.B100, _badgeBackgroundColor['promotion'] = Yellow.S75, _badgeBackgroundColor['new'] = Orange.S87, _badgeBackgroundColor);
7
+ var getBadgeBackgroundColor = function getBadgeBackgroundColor(status) {
8
+ if (!(status in badgeBackgroundColor)) {
9
+ console.warn(status + " is not a valid status, default will be used");
10
+ return badgeBackgroundColor['neutral'];
11
+ }
12
+ return badgeBackgroundColor[status];
13
+ };
14
+ export var BadgeStyle = styled.div.withConfig({
15
+ displayName: "BadgeStyle",
16
+ componentId: "sc-1aofb4c-0"
17
+ })(["", "}width:fit-content;padding:2px ", ";border-radius:", ";"], function (_ref) {
18
+ var status = _ref.status;
19
+ return {
20
+ 'background-color': getBadgeBackgroundColor(status)
21
+ };
22
+ }, space8, borderRadius20);
@@ -0,0 +1 @@
1
+ export * from './Badge';
@@ -0,0 +1 @@
1
+ export * from './Badge';
@@ -1,10 +1,14 @@
1
1
  import React from 'react';
2
2
  export declare type ButtonSize = 'default' | 'slim' | 'large';
3
+ export declare type IconPosition = 'left' | 'right';
3
4
  export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
4
5
  size?: ButtonSize;
5
6
  children?: React.ReactNode;
7
+ /** Indicate if the button is currently selected */
6
8
  active?: boolean;
7
9
  fullWidth?: boolean;
10
+ icon?: React.ReactNode;
11
+ iconPosition?: IconPosition;
8
12
  loading?: boolean;
9
13
  }
10
- export declare const Button: ({ children, ...otherProps }: ButtonProps) => JSX.Element;
14
+ export declare const Button: ({ children, icon, iconPosition, active, fullWidth, loading, ...otherProps }: ButtonProps) => JSX.Element;
@@ -1,18 +1,36 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
3
- var _excluded = ["children"];
3
+ var _excluded = ["children", "icon", "iconPosition", "active", "fullWidth", "loading"];
4
4
  import React from 'react';
5
+ import { Spinner } from '../Spinner/Spinner';
5
6
  import { Typography } from '../Typography';
6
- import { BasicButton } from './ButtonStyle';
7
+ import { StyledButton } from './ButtonStyle';
7
8
  export var Button = function Button(_ref) {
8
9
  var children = _ref.children,
10
+ icon = _ref.icon,
11
+ _ref$iconPosition = _ref.iconPosition,
12
+ iconPosition = _ref$iconPosition === void 0 ? 'left' : _ref$iconPosition,
13
+ active = _ref.active,
14
+ fullWidth = _ref.fullWidth,
15
+ loading = _ref.loading,
9
16
  otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
10
17
  var content = typeof children === 'string' ? /*#__PURE__*/React.createElement(Typography, {
11
- variant: "caption"
18
+ variant: "button"
12
19
  }, " ", children) : children;
13
- return /*#__PURE__*/React.createElement(BasicButton, _extends({}, otherProps, {
20
+ var renderIcon = function renderIcon(position) {
21
+ if (icon && position === iconPosition) {
22
+ return icon;
23
+ }
24
+ return null;
25
+ };
26
+ return /*#__PURE__*/React.createElement(StyledButton, _extends({
27
+ "data-active": active,
28
+ "data-full-width": fullWidth,
29
+ "data-loading": loading,
30
+ "data-icon": !!icon
31
+ }, otherProps, {
14
32
  onMouseUp: function onMouseUp(e) {
15
33
  return e.currentTarget.blur();
16
34
  }
17
- }), content);
35
+ }), loading && /*#__PURE__*/React.createElement(Spinner, null), renderIcon('left'), content, renderIcon('right'));
18
36
  };
@@ -2,3 +2,4 @@ import { Meta } from '@storybook/react';
2
2
  declare const _default: Meta<import("@storybook/react").Args>;
3
3
  export default _default;
4
4
  export declare const Interactive: any;
5
+ export declare const WithIcon: any;
@@ -2,6 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
2
2
  import React from 'react';
3
3
  import { Button } from './Button';
4
4
  import { BaseContainer } from '../../Layout/GlintsContainer/GlintsContainer';
5
+ import { Icon } from '../Icon';
6
+ import { PrimaryButton } from './PrimaryButtonStyle';
5
7
  Button.displayName = 'Button';
6
8
  var defaultText = 'Label';
7
9
  export default {
@@ -25,4 +27,25 @@ export var Interactive = Template.bind({});
25
27
  Interactive.args = {
26
28
  size: 'default',
27
29
  disabled: false
30
+ };
31
+ var WithIconsTemplate = function WithIconsTemplate(args) {
32
+ return /*#__PURE__*/React.createElement("div", {
33
+ style: {
34
+ display: 'flex',
35
+ gap: '10px'
36
+ }
37
+ }, /*#__PURE__*/React.createElement(Button, _extends({}, args, {
38
+ type: "button"
39
+ }), defaultText), /*#__PURE__*/React.createElement(PrimaryButton, _extends({}, args, {
40
+ type: "button"
41
+ }), defaultText));
42
+ };
43
+ export var WithIcon = WithIconsTemplate.bind({});
44
+ WithIcon.args = {
45
+ size: 'default',
46
+ icon: /*#__PURE__*/React.createElement(Icon, {
47
+ name: "ri-arrow-up-down-fill"
48
+ }),
49
+ iconPosition: 'left',
50
+ disabled: false
28
51
  };
@@ -1,5 +1,2 @@
1
- import { CSSProperties } from 'react';
2
1
  import { ButtonProps } from './Button';
3
- export declare const BasicButton: import("styled-components").StyledComponent<"button", any, {
4
- style: CSSProperties;
5
- } & ButtonProps, "style">;
2
+ export declare const StyledButton: import("styled-components").StyledComponent<"button", any, ButtonProps, never>;
@@ -1,39 +1,26 @@
1
- import _extends from "@babel/runtime/helpers/extends";
2
1
  import styled from 'styled-components';
3
2
  import * as Breakpoints from '../utilities/breakpoints';
4
3
  import { borderRadius4 } from '../utilities/borderRadius';
5
4
  import { Neutral } from '../utilities/colors';
6
5
  import { button, buttonFocused, insetButtonPressed } from '../utilities/dropShadow';
7
6
  import { space12, space16, space24, space4, space8 } from '../utilities/spacing';
8
- var defaultButtonSizeStyle = "\n width: 75px;\n height: 36px;\n padding: " + space8 + " " + space16 + ";\n\n @media (max-width: " + Breakpoints.large + ") {\n width: 71px;\n }\n";
9
- var largeButtonSizeStyle = "\n width: 91px;\n height: 44px;\n padding: " + space12 + " " + space24 + ";\n\n @media (max-width: " + Breakpoints.large + ") {\n width: 87px;\n }\n";
10
- var slimButtonSizeStyle = "\n width: 67px;\n height: 32px;\n padding: " + space4 + " " + space12 + ";\n\n @media (max-width: " + Breakpoints.large + ") {\n width: 63px;\n }\n";
7
+ var defaultButtonSizeStyle = "\n min-width: 75px;\n height: 36px;\n padding: " + space8 + " " + space16 + ";\n\n @media (max-width: " + Breakpoints.large + ") {\n min-width: 71px;\n }\n";
8
+ var largeButtonSizeStyle = "\nmin-width: 91px;\n height: 44px;\n padding: " + space12 + " " + space24 + ";\n\n @media (max-width: " + Breakpoints.large + ") {\n min-width: 87px;\n }\n";
9
+ var slimButtonSizeStyle = "\nmin-width: 67px;\n height: 32px;\n padding: " + space4 + " " + space12 + ";\n\n @media (max-width: " + Breakpoints.large + ") {\n min-width: 63px;\n }\n";
11
10
  var buttonSizeStyleMap = {
12
11
  "default": defaultButtonSizeStyle,
13
12
  slim: slimButtonSizeStyle,
14
13
  large: largeButtonSizeStyle
15
14
  };
16
- export var BasicButton = styled.button.attrs(function (_ref) {
17
- var active = _ref.active,
18
- fullWidth = _ref.fullWidth;
19
- var activeStyle = {
20
- color: "" + Neutral.B100,
21
- background: "" + Neutral.B40
22
- };
23
- var widthStyle = {
24
- width: '100%'
25
- };
26
- return {
27
- style: _extends({}, active && activeStyle, fullWidth && widthStyle)
28
- };
29
- }).withConfig({
30
- displayName: "ButtonStyle__BasicButton",
15
+ export var StyledButton = styled.button.withConfig({
16
+ displayName: "ButtonStyle__StyledButton",
31
17
  componentId: "sc-8t0676-0"
32
- })(["display:flex;gap:10px;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:", ";}&:disabled{color:", ";background:", ";}", " > svg{width:18px;height:18px;}"], borderRadius4, Neutral.B18, Neutral.B100, Neutral.B68, button, Neutral.B99, Neutral.B100, buttonFocused, Neutral.B95, Neutral.B68, insetButtonPressed, Neutral.B68, Neutral.B95, function (_ref2) {
33
- var size = _ref2.size;
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:", ";}&: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:", ";}"], 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
+ var _ref$size = _ref.size,
20
+ size = _ref$size === void 0 ? 'default' : _ref$size;
34
21
  var sizeStyle = buttonSizeStyleMap[size];
35
22
  if (size && !sizeStyle) {
36
23
  console.warn(size + " is not a valid ButtonSize, default will be used");
37
24
  }
38
25
  return buttonSizeStyleMap[size] || defaultButtonSizeStyle;
39
- });
26
+ }, Neutral.B40, Neutral.B100, Neutral.B40, Neutral.B100, Neutral.B99, Neutral.B85);
@@ -1,2 +1,2 @@
1
1
  /// <reference types="react" />
2
- export declare const DestructiveButton: import("styled-components").StyledComponent<({ children, ...otherProps }: import("./Button").ButtonProps) => JSX.Element, any, {}, never>;
2
+ export declare const DestructiveButton: import("styled-components").StyledComponent<({ children, icon, iconPosition, active, fullWidth, loading, ...otherProps }: import("./Button").ButtonProps) => JSX.Element, any, {}, never>;
@@ -5,4 +5,4 @@ import { Button } from './Button';
5
5
  export var DestructiveButton = styled(Button).withConfig({
6
6
  displayName: "DesctructiveButtonStyle__DestructiveButton",
7
7
  componentId: "sc-1erj0cn-0"
8
- })(["color:", ";background:", ";border:none;&:hover{background:", ";box-shadow:0px 1px 0px rgba(0,0,0,0.08),inset 0px -1px 0px rgba(0,0,0,0.2);}&:focus{box-shadow:0px 0px 0px 2px rgba(69,143,255,1);}&:active{background:", ";box-shadow:", ";}"], Neutral.B100, Red.B93, Red.B74, Red.B65, insetButtonPressed);
8
+ })(["color:", ";background:", ";border:none;&:hover{background:", ";box-shadow:0px 1px 0px rgba(0,0,0,0.08),inset 0px -1px 0px rgba(0,0,0,0.2);}&:focus{box-shadow:0px 0px 0px 2px rgba(69,143,255,1);}&:active{background:", ";box-shadow:", ";}&[data-loading='true']{background:", ";}"], Neutral.B100, Red.B93, Red.B74, Red.B65, insetButtonPressed, Neutral.B95);
@@ -1,2 +1,2 @@
1
1
  /// <reference types="react" />
2
- export declare const OutlineButton: import("styled-components").StyledComponent<({ children, ...otherProps }: import("./Button").ButtonProps) => JSX.Element, any, {}, never>;
2
+ export declare const OutlineButton: import("styled-components").StyledComponent<({ children, icon, iconPosition, active, fullWidth, loading, ...otherProps }: import("./Button").ButtonProps) => JSX.Element, any, {}, never>;
@@ -1,3 +1,2 @@
1
1
  /// <reference types="react" />
2
- import { ButtonProps } from './Button';
3
- export declare const OutlineMonochromeButton: import("styled-components").StyledComponent<({ children, ...otherProps }: ButtonProps) => JSX.Element, any, {}, never>;
2
+ export declare const OutlineMonochromeButton: import("styled-components").StyledComponent<({ children, icon, iconPosition, active, fullWidth, loading, ...otherProps }: import("./Button").ButtonProps) => JSX.Element, any, {}, never>;
@@ -1,12 +1,9 @@
1
1
  import styled from 'styled-components';
2
2
  import { Red } from '../utilities/colors';
3
- import { B100 } from '../utilities/colors/neutral';
3
+ import { Neutral } from '../utilities/colors/';
4
4
  import { button } from '../utilities/dropShadow';
5
5
  import { Button } from './Button';
6
6
  export var OutlineMonochromeButton = styled(Button).withConfig({
7
7
  displayName: "OutlineMonochromeStyle__OutlineMonochromeButton",
8
8
  componentId: "sc-2c3b7a-0"
9
- })(["", " color:", ";border:1px solid ", ";filter:drop-shadow(", ");&:hover{background:", ";opacity:0.9;box-shadow:", ";}&:active{background:", ";opacity:1;border:1px solid ", ";}"], function (_ref) {
10
- var active = _ref.active;
11
- return active ? "&[style] {\n color: " + B100 + " !important;\n background: " + Red.B93 + " !important;\n }" : "";
12
- }, Red.B93, Red.B93, button, Red.B100, button, Red.B100, Red.B93);
9
+ })(["color:", ";border:1px solid ", ";filter:drop-shadow(", ");&:hover{background:", ";opacity:0.9;box-shadow:", ";}&:active{background:", ";opacity:1;border:1px solid ", ";}&[data-active='true']{color:", ";background:", ";}"], Red.B93, Red.B93, button, Red.B100, button, Red.B100, Red.B93, Neutral.B100, Red.B93);
@@ -1,2 +1,2 @@
1
1
  /// <reference types="react" />
2
- export declare const PrimaryButton: import("styled-components").StyledComponent<({ children, ...otherProps }: import("./Button").ButtonProps) => JSX.Element, any, {}, never>;
2
+ export declare const PrimaryButton: import("styled-components").StyledComponent<({ children, icon, iconPosition, active, fullWidth, loading, ...otherProps }: import("./Button").ButtonProps) => JSX.Element, any, {}, never>;
@@ -4,4 +4,4 @@ import { Button } from './Button';
4
4
  export var PrimaryButton = styled(Button).withConfig({
5
5
  displayName: "PrimaryButtonStyle__PrimaryButton",
6
6
  componentId: "sc-1iczr6c-0"
7
- })(["color:", ";background:", ";border:none;&:hover{background:", ";opacity:0.9;box-shadow:0px 1px 0px rgba(0,0,0,0.08),inset 0px -1px 0px rgba(0,0,0,0.2);}&:active{background:", ";opacity:1;}"], Neutral.B100, Blue.S99, Blue.S100, Blue.S100);
7
+ })(["color:", ";background:", ";border:none;&:hover{background:", ";opacity:0.9;box-shadow:0px 1px 0px rgba(0,0,0,0.08),inset 0px -1px 0px rgba(0,0,0,0.2);}&:active{background:", ";opacity:1;}&[data-loading='true']{background:", ";}svg{fill:", ";}"], Neutral.B100, Blue.S99, Blue.S100, Blue.S100, Neutral.B95, Neutral.B100);
@@ -18,7 +18,9 @@ export default {
18
18
  };
19
19
  var Template = function Template(args) {
20
20
  var segmented = args.segmented;
21
- var children = segmented ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(OutlineButton, null, "Label"), /*#__PURE__*/React.createElement(OutlineButton, null, "Label"), /*#__PURE__*/React.createElement(OutlineButton, null, "Label"), /*#__PURE__*/React.createElement(OutlineButton, null, "Label"), /*#__PURE__*/React.createElement(OutlineButton, null, "Label")) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, null, "Label"), /*#__PURE__*/React.createElement(PrimaryButton, null, "Label"));
21
+ var children = segmented ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(OutlineButton, null, "Label"), /*#__PURE__*/React.createElement(OutlineButton, null, "Label"), /*#__PURE__*/React.createElement(OutlineButton, {
22
+ active: true
23
+ }, "Label"), /*#__PURE__*/React.createElement(OutlineButton, null, "Label"), /*#__PURE__*/React.createElement(OutlineButton, null, "Label")) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, null, "Label"), /*#__PURE__*/React.createElement(PrimaryButton, null, "Label"));
22
24
  return /*#__PURE__*/React.createElement(ButtonGroup, args, children);
23
25
  };
24
26
  export var Interactive = Template.bind({});
@@ -1,13 +1,13 @@
1
1
  import styled from 'styled-components';
2
2
  import { borderRadius4 } from '../utilities/borderRadius';
3
- import { B68 } from '../utilities/colors/neutral';
3
+ import { Neutral } from '../utilities/colors';
4
4
  import { space8 } from '../utilities/spacing';
5
5
  export var ButtonGroup = styled.div.withConfig({
6
6
  displayName: "ButtonGroupStyle__ButtonGroup",
7
7
  componentId: "sc-7vhxrt-0"
8
- })(["display:flex;flex-direction:row;align-items:center;padding:0px;> button{z-index:1;}", " ", ""], function (_ref) {
8
+ })(["display:flex;flex-direction:row;align-items:center;padding:0px;", " ", ""], function (_ref) {
9
9
  var segmented = _ref.segmented;
10
- return segmented ? "> button {\n border-radius: 0;\n border-right: 0;\n \n :nth-child(1) {\n border-radius: " + borderRadius4 + " 0px 0px " + borderRadius4 + "; \n }\n\n :nth-last-child(1) {\n border-radius: 0px " + borderRadius4 + " " + borderRadius4 + " 0px;\n border-right: 1px solid " + B68 + "\n }\n }" : "gap: " + space8 + ";";
10
+ return segmented ? "> button {\n border-radius: 0;\n border-right: 0;\n \n :nth-child(1) {\n border-radius: " + borderRadius4 + " 0px 0px " + borderRadius4 + "; \n }\n\n :nth-last-child(1) {\n border-radius: 0px " + borderRadius4 + " " + borderRadius4 + " 0px;\n border-right: 1px solid " + Neutral.B68 + "\n }\n }\n > button:focus {\n z-index: 1;\n border: 1px solid " + Neutral.B68 + "\n }\n\n button[data-active='true'] {\n border: 1px solid " + Neutral.B40 + "\n }\n " : "gap: " + space8 + ";";
11
11
  }, function (_ref2) {
12
12
  var fullWidth = _ref2.fullWidth;
13
13
  return fullWidth ? "> button {\n flex: 1;\n }" : "";
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- export interface CheckboxProps extends Omit<React.HtmlHTMLAttributes<HTMLInputElement>, 'type' | 'onChange'> {
2
+ export interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'onChange'> {
3
3
  id?: string;
4
4
  label?: string;
5
5
  hasError?: boolean;
@@ -33,12 +33,12 @@ export var Checkbox = function Checkbox(_ref) {
33
33
  setCheckedState(value);
34
34
  }, [checked, indeterminate]);
35
35
  var handleClick = function handleClick() {
36
- if (!onChange || !inputNode.current || disabled) {
36
+ if (!inputNode.current || disabled) {
37
37
  return;
38
38
  }
39
39
  var checkedValue = !checkedState;
40
40
  setCheckedState(checkedValue);
41
- onChange(checkedValue, checkBoxId);
41
+ onChange == null ? void 0 : onChange(checkedValue, checkBoxId);
42
42
  };
43
43
  return /*#__PURE__*/React.createElement(StyledContainer, {
44
44
  "aria-disabled": disabled,
@@ -11,4 +11,4 @@ export var StyledItemList = styled.li.withConfig({
11
11
  export var StyledIcon = styled(Icon).withConfig({
12
12
  displayName: "IconStoriesStyles__StyledIcon",
13
13
  componentId: "sc-7j50pb-2"
14
- })(["margin-right:1em;"]);
14
+ })(["margin-right:1em;fill:currentColor;"]);
@@ -0,0 +1,3 @@
1
+ import { SVGProps } from 'react';
2
+ declare const SvgRiFacebook: (props: SVGProps<SVGSVGElement>) => JSX.Element;
3
+ export default SvgRiFacebook;
@@ -0,0 +1,11 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import * as React from 'react';
3
+ var SvgRiFacebook = function SvgRiFacebook(props) {
4
+ return /*#__PURE__*/React.createElement("svg", _extends({
5
+ viewBox: "0 0 24 24",
6
+ xmlns: "http://www.w3.org/2000/svg"
7
+ }, props), /*#__PURE__*/React.createElement("path", {
8
+ d: "M13 19.938A8.001 8.001 0 0 0 12 4a8 8 0 0 0-1 15.938V14H9v-2h2v-1.654c0-1.337.14-1.822.4-2.311.256-.484.652-.88 1.136-1.135.382-.205.857-.328 1.687-.381.329-.021.755.005 1.278.08v1.9H15c-.917 0-1.296.043-1.522.164a.727.727 0 0 0-.314.314c-.12.226-.164.45-.164 1.368V12h2.5l-.5 2h-2v5.938ZM12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10Z"
9
+ }));
10
+ };
11
+ export default SvgRiFacebook;
@@ -0,0 +1,3 @@
1
+ import { SVGProps } from 'react';
2
+ declare const SvgRiLoader: (props: SVGProps<SVGSVGElement>) => JSX.Element;
3
+ export default SvgRiLoader;
@@ -0,0 +1,12 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import * as React from 'react';
3
+ var SvgRiLoader = function SvgRiLoader(props) {
4
+ return /*#__PURE__*/React.createElement("svg", _extends({
5
+ viewBox: "0 0 18 18",
6
+ fill: "none",
7
+ xmlns: "http://www.w3.org/2000/svg"
8
+ }, props), /*#__PURE__*/React.createElement("path", {
9
+ d: "M15.364 2.636 13.95 4.05A7 7 0 1 0 16 9h2a9 9 0 1 1-2.636-6.364Z"
10
+ }));
11
+ };
12
+ export default SvgRiLoader;
@@ -0,0 +1,3 @@
1
+ import { SVGProps } from 'react';
2
+ declare const SvgRiLocation: (props: SVGProps<SVGSVGElement>) => JSX.Element;
3
+ export default SvgRiLocation;
@@ -0,0 +1,11 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import * as React from 'react';
3
+ var SvgRiLocation = function SvgRiLocation(props) {
4
+ return /*#__PURE__*/React.createElement("svg", _extends({
5
+ viewBox: "0 0 24 24",
6
+ xmlns: "http://www.w3.org/2000/svg"
7
+ }, props), /*#__PURE__*/React.createElement("path", {
8
+ d: "m12 23.728-6.364-6.364a9 9 0 1 1 12.728 0L12 23.728Zm4.95-7.778a7 7 0 1 0-9.9 0L12 20.9l4.95-4.95ZM12 13a2 2 0 1 1 0-4 2 2 0 0 1 0 4Z"
9
+ }));
10
+ };
11
+ export default SvgRiLocation;
@@ -0,0 +1,3 @@
1
+ import { SVGProps } from 'react';
2
+ declare const SvgRiTwitter: (props: SVGProps<SVGSVGElement>) => JSX.Element;
3
+ export default SvgRiTwitter;
@@ -0,0 +1,11 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import * as React from 'react';
3
+ var SvgRiTwitter = function SvgRiTwitter(props) {
4
+ return /*#__PURE__*/React.createElement("svg", _extends({
5
+ viewBox: "0 0 24 24",
6
+ xmlns: "http://www.w3.org/2000/svg"
7
+ }, props), /*#__PURE__*/React.createElement("path", {
8
+ d: "M15.3 5.55a2.9 2.9 0 0 0-2.9 2.847l-.028 1.575a.599.599 0 0 1-.68.583l-1.561-.212c-2.054-.28-4.022-1.226-5.91-2.799-.598 3.31.57 5.603 3.383 7.372l1.747 1.098a.6.6 0 0 1 .034.993L7.793 18.17c.947.06 1.846.017 2.592-.13 4.718-.943 7.855-4.493 7.855-10.349 0-.478-1.012-2.14-2.94-2.14Zm-4.9 2.81a4.9 4.9 0 0 1 8.385-3.355c.711-.005 1.316.175 2.669-.645-.335 1.64-.5 2.352-1.214 3.331 0 7.642-4.697 11.358-9.463 12.31-3.268.651-8.02-.42-9.382-1.842.694-.054 3.514-.357 5.144-1.55C5.16 15.7-.329 12.47 3.278 3.786c1.693 1.977 3.41 3.323 5.15 4.037 1.158.475 1.442.465 1.973.538H10.4Z"
9
+ }));
10
+ };
11
+ export default SvgRiTwitter;
@@ -45,8 +45,11 @@ export { default as RiDeleteBinFill } from './RiDeleteBinFill';
45
45
  export { default as RiDeleteBinLine } from './RiDeleteBinLine';
46
46
  export { default as RiErrorWarningFill } from './RiErrorWarningFill';
47
47
  export { default as RiErrorWarningLine } from './RiErrorWarningLine';
48
+ export { default as RiFacebook } from './RiFacebook';
48
49
  export { default as RiInformationFill } from './RiInformationFill';
49
50
  export { default as RiInformationLine } from './RiInformationLine';
51
+ export { default as RiLoader } from './RiLoader';
52
+ export { default as RiLocation } from './RiLocation';
50
53
  export { default as RiMessageFill } from './RiMessageFill';
51
54
  export { default as RiMessageLine } from './RiMessageLine';
52
55
  export { default as RiPencilFill } from './RiPencilFill';
@@ -60,3 +63,4 @@ export { default as RiSendPlaneFill } from './RiSendPlaneFill';
60
63
  export { default as RiSendPlaneLine } from './RiSendPlaneLine';
61
64
  export { default as RiSettingsFill } from './RiSettingsFill';
62
65
  export { default as RiSettingsLine } from './RiSettingsLine';
66
+ export { default as RiTwitter } from './RiTwitter';
@@ -45,8 +45,11 @@ export { default as RiDeleteBinFill } from './RiDeleteBinFill';
45
45
  export { default as RiDeleteBinLine } from './RiDeleteBinLine';
46
46
  export { default as RiErrorWarningFill } from './RiErrorWarningFill';
47
47
  export { default as RiErrorWarningLine } from './RiErrorWarningLine';
48
+ export { default as RiFacebook } from './RiFacebook';
48
49
  export { default as RiInformationFill } from './RiInformationFill';
49
50
  export { default as RiInformationLine } from './RiInformationLine';
51
+ export { default as RiLoader } from './RiLoader';
52
+ export { default as RiLocation } from './RiLocation';
50
53
  export { default as RiMessageFill } from './RiMessageFill';
51
54
  export { default as RiMessageLine } from './RiMessageLine';
52
55
  export { default as RiPencilFill } from './RiPencilFill';
@@ -59,4 +62,5 @@ export { default as RiSearch } from './RiSearch';
59
62
  export { default as RiSendPlaneFill } from './RiSendPlaneFill';
60
63
  export { default as RiSendPlaneLine } from './RiSendPlaneLine';
61
64
  export { default as RiSettingsFill } from './RiSettingsFill';
62
- export { default as RiSettingsLine } from './RiSettingsLine';
65
+ export { default as RiSettingsLine } from './RiSettingsLine';
66
+ export { default as RiTwitter } from './RiTwitter';
@@ -1,5 +1,5 @@
1
1
  import { SVGProps } from 'react';
2
- export declare const iconNames: readonly ["ri-account-circle-fill", "ri-account-circle-line", "ri-add-circle-fill", "ri-add-circle-line", "ri-add", "ri-alarm-warning-fill", "ri-alarm-warning-line", "ri-arrow-down-fill", "ri-arrow-down-line", "ri-arrow-go-back-fill", "ri-arrow-go-back-line", "ri-arrow-go-forward-fill", "ri-arrow-go-forward-line", "ri-arrow-left-fill", "ri-arrow-left-line", "ri-arrow-left-right-fill", "ri-arrow-left-right-line", "ri-arrow-m-down-fill", "ri-arrow-m-down-line", "ri-arrow-m-left-fill", "ri-arrow-m-left-line", "ri-arrow-m-right-fill", "ri-arrow-m-right-line", "ri-arrow-m-up-fill", "ri-arrow-m-up-line", "ri-arrow-right-fill", "ri-arrow-right-line", "ri-arrow-up-down-fill", "ri-arrow-up-down-line", "ri-arrow-up-fill", "ri-arrow-up-line", "ri-arrow-xs-down-fill", "ri-arrow-xs-up-fill", "ri-calendar-fill", "ri-calendar-line", "ri-check", "ri-close-circle-fill", "ri-close-circle-line", "ri-close", "ri-delete-bin-fill", "ri-delete-bin-line", "ri-error-warning-fill", "ri-error-warning-line", "ri-information-fill", "ri-information-line", "ri-message-fill", "ri-message-line", "ri-pencil-fill", "ri-pencil-line", "ri-question-fill", "ri-question-line", "ri-reply-fill", "ri-reply-line", "ri-send-plane-fill", "ri-send-plane-line", "ri-settings-fill", "ri-settings-line", "ri-checkbox-fill", "ri-checkbox-line", "ri-checkbox-indeterminate-fill", "ri-checkbox-indeterminate-line", "ri-search"];
2
+ export declare const iconNames: readonly ["ri-account-circle-fill", "ri-account-circle-line", "ri-add-circle-fill", "ri-add-circle-line", "ri-add", "ri-alarm-warning-fill", "ri-alarm-warning-line", "ri-arrow-down-fill", "ri-arrow-down-line", "ri-arrow-go-back-fill", "ri-arrow-go-back-line", "ri-arrow-go-forward-fill", "ri-arrow-go-forward-line", "ri-arrow-left-fill", "ri-arrow-left-line", "ri-arrow-left-right-fill", "ri-arrow-left-right-line", "ri-arrow-m-down-fill", "ri-arrow-m-down-line", "ri-arrow-m-left-fill", "ri-arrow-m-left-line", "ri-arrow-m-right-fill", "ri-arrow-m-right-line", "ri-arrow-m-up-fill", "ri-arrow-m-up-line", "ri-arrow-right-fill", "ri-arrow-right-line", "ri-arrow-up-down-fill", "ri-arrow-up-down-line", "ri-arrow-up-fill", "ri-arrow-up-line", "ri-arrow-xs-down-fill", "ri-arrow-xs-up-fill", "ri-calendar-fill", "ri-calendar-line", "ri-check", "ri-checkbox-fill", "ri-checkbox-indeterminate-fill", "ri-checkbox-indeterminate-line", "ri-checkbox-line", "ri-close-circle-fill", "ri-close-circle-line", "ri-close", "ri-delete-bin-fill", "ri-delete-bin-line", "ri-error-warning-fill", "ri-error-warning-line", "ri-facebook", "ri-information-fill", "ri-information-line", "ri-loader", "ri-location", "ri-message-fill", "ri-message-line", "ri-pencil-fill", "ri-pencil-line", "ri-question-fill", "ri-question-line", "ri-reply-fill", "ri-reply-line", "ri-search", "ri-send-plane-fill", "ri-send-plane-line", "ri-settings-fill", "ri-settings-line", "ri-twitter"];
3
3
  export declare type IconNames = typeof iconNames[number];
4
4
  declare type SVGComponent = (props: SVGProps<SVGSVGElement>) => JSX.Element;
5
5
  export declare const iconsMappingComponent: {
@@ -1,4 +1,4 @@
1
1
  var _iconsMappingComponen;
2
2
  import * as Icons from '../components';
3
- export var iconNames = ['ri-account-circle-fill', 'ri-account-circle-line', 'ri-add-circle-fill', 'ri-add-circle-line', 'ri-add', 'ri-alarm-warning-fill', 'ri-alarm-warning-line', 'ri-arrow-down-fill', 'ri-arrow-down-line', 'ri-arrow-go-back-fill', 'ri-arrow-go-back-line', 'ri-arrow-go-forward-fill', 'ri-arrow-go-forward-line', 'ri-arrow-left-fill', 'ri-arrow-left-line', 'ri-arrow-left-right-fill', 'ri-arrow-left-right-line', 'ri-arrow-m-down-fill', 'ri-arrow-m-down-line', 'ri-arrow-m-left-fill', 'ri-arrow-m-left-line', 'ri-arrow-m-right-fill', 'ri-arrow-m-right-line', 'ri-arrow-m-up-fill', 'ri-arrow-m-up-line', 'ri-arrow-right-fill', 'ri-arrow-right-line', 'ri-arrow-up-down-fill', 'ri-arrow-up-down-line', 'ri-arrow-up-fill', 'ri-arrow-up-line', 'ri-arrow-xs-down-fill', 'ri-arrow-xs-up-fill', 'ri-calendar-fill', 'ri-calendar-line', 'ri-check', 'ri-close-circle-fill', 'ri-close-circle-line', 'ri-close', 'ri-delete-bin-fill', 'ri-delete-bin-line', 'ri-error-warning-fill', 'ri-error-warning-line', 'ri-information-fill', 'ri-information-line', 'ri-message-fill', 'ri-message-line', 'ri-pencil-fill', 'ri-pencil-line', 'ri-question-fill', 'ri-question-line', 'ri-reply-fill', 'ri-reply-line', 'ri-send-plane-fill', 'ri-send-plane-line', 'ri-settings-fill', 'ri-settings-line', 'ri-checkbox-fill', 'ri-checkbox-line', 'ri-checkbox-indeterminate-fill', 'ri-checkbox-indeterminate-line', 'ri-search'];
4
- export var iconsMappingComponent = (_iconsMappingComponen = {}, _iconsMappingComponen['ri-account-circle-fill'] = Icons.RiAccountCircleFill, _iconsMappingComponen['ri-account-circle-line'] = Icons.RiAccountCircleLine, _iconsMappingComponen['ri-add'] = Icons.RiAdd, _iconsMappingComponen['ri-add-circle-fill'] = Icons.RiAddCircleFill, _iconsMappingComponen['ri-add-circle-line'] = Icons.RiAddCircleLine, _iconsMappingComponen['ri-alarm-warning-fill'] = Icons.RiAlarmWarningFill, _iconsMappingComponen['ri-alarm-warning-line'] = Icons.RiAlarmWarningLine, _iconsMappingComponen['ri-arrow-down-fill'] = Icons.RiArrowDownFill, _iconsMappingComponen['ri-arrow-down-line'] = Icons.RiArrowDownLine, _iconsMappingComponen['ri-arrow-go-back-fill'] = Icons.RiArrowGoBackFill, _iconsMappingComponen['ri-arrow-go-back-line'] = Icons.RiArrowGoBackLine, _iconsMappingComponen['ri-arrow-go-forward-fill'] = Icons.RiArrowGoForwardFill, _iconsMappingComponen['ri-arrow-go-forward-line'] = Icons.RiArrowGoForwardLine, _iconsMappingComponen['ri-arrow-left-fill'] = Icons.RiArrowLeftFill, _iconsMappingComponen['ri-arrow-left-line'] = Icons.RiArrowLeftLine, _iconsMappingComponen['ri-arrow-left-right-fill'] = Icons.RiArrowLeftRightFill, _iconsMappingComponen['ri-arrow-left-right-line'] = Icons.RiArrowLeftRightLine, _iconsMappingComponen['ri-arrow-m-down-fill'] = Icons.RiArrowMDownFill, _iconsMappingComponen['ri-arrow-m-down-line'] = Icons.RiArrowMDownLine, _iconsMappingComponen['ri-arrow-m-left-fill'] = Icons.RiArrowMLeftFill, _iconsMappingComponen['ri-arrow-m-left-line'] = Icons.RiArrowMLeftLine, _iconsMappingComponen['ri-arrow-m-right-fill'] = Icons.RiArrowMRightFill, _iconsMappingComponen['ri-arrow-m-right-line'] = Icons.RiArrowMRightLine, _iconsMappingComponen['ri-arrow-m-up-fill'] = Icons.RiArrowMUpFill, _iconsMappingComponen['ri-arrow-m-up-line'] = Icons.RiArrowMUpLine, _iconsMappingComponen['ri-arrow-right-fill'] = Icons.RiArrowRightFill, _iconsMappingComponen['ri-arrow-right-line'] = Icons.RiArrowRightLine, _iconsMappingComponen['ri-arrow-up-down-fill'] = Icons.RiArrowUpDownFill, _iconsMappingComponen['ri-arrow-up-down-line'] = Icons.RiArrowUpDownLine, _iconsMappingComponen['ri-arrow-up-fill'] = Icons.RiArrowUpFill, _iconsMappingComponen['ri-arrow-up-line'] = Icons.RiArrowUpLine, _iconsMappingComponen['ri-arrow-xs-down-fill'] = Icons.RiArrowXsDownFill, _iconsMappingComponen['ri-arrow-xs-up-fill'] = Icons.RiArrowXsUpFill, _iconsMappingComponen['ri-calendar-fill'] = Icons.RiCalendarFill, _iconsMappingComponen['ri-calendar-line'] = Icons.RiCalendarLine, _iconsMappingComponen['ri-check'] = Icons.RiCheck, _iconsMappingComponen['ri-close-circle-fill'] = Icons.RiCloseCircleFill, _iconsMappingComponen['ri-close-circle-line'] = Icons.RiCloseCircleLine, _iconsMappingComponen['ri-close'] = Icons.RiClose, _iconsMappingComponen['ri-delete-bin-fill'] = Icons.RiDeleteBinFill, _iconsMappingComponen['ri-delete-bin-line'] = Icons.RiDeleteBinLine, _iconsMappingComponen['ri-error-warning-fill'] = Icons.RiErrorWarningFill, _iconsMappingComponen['ri-error-warning-line'] = Icons.RiErrorWarningLine, _iconsMappingComponen['ri-information-fill'] = Icons.RiInformationFill, _iconsMappingComponen['ri-information-line'] = Icons.RiInformationLine, _iconsMappingComponen['ri-message-fill'] = Icons.RiMessageFill, _iconsMappingComponen['ri-message-line'] = Icons.RiMessageLine, _iconsMappingComponen['ri-pencil-fill'] = Icons.RiPencilFill, _iconsMappingComponen['ri-pencil-line'] = Icons.RiPencilLine, _iconsMappingComponen['ri-reply-fill'] = Icons.RiReplyFill, _iconsMappingComponen['ri-reply-line'] = Icons.RiReplyLine, _iconsMappingComponen['ri-question-fill'] = Icons.RiQuestionFill, _iconsMappingComponen['ri-question-line'] = Icons.RiQuestionLine, _iconsMappingComponen['ri-send-plane-fill'] = Icons.RiSendPlaneFill, _iconsMappingComponen['ri-send-plane-line'] = Icons.RiSendPlaneLine, _iconsMappingComponen['ri-settings-fill'] = Icons.RiSettingsFill, _iconsMappingComponen['ri-settings-line'] = Icons.RiSettingsLine, _iconsMappingComponen['ri-checkbox-fill'] = Icons.RiCheckboxFill, _iconsMappingComponen['ri-checkbox-line'] = Icons.RiCheckboxLine, _iconsMappingComponen['ri-checkbox-indeterminate-fill'] = Icons.RiCheckboxIndeterminateFill, _iconsMappingComponen['ri-checkbox-indeterminate-line'] = Icons.RiCheckboxIndeterminateLine, _iconsMappingComponen['ri-search'] = Icons.RiSearch, _iconsMappingComponen);
3
+ export var iconNames = ['ri-account-circle-fill', 'ri-account-circle-line', 'ri-add-circle-fill', 'ri-add-circle-line', 'ri-add', 'ri-alarm-warning-fill', 'ri-alarm-warning-line', 'ri-arrow-down-fill', 'ri-arrow-down-line', 'ri-arrow-go-back-fill', 'ri-arrow-go-back-line', 'ri-arrow-go-forward-fill', 'ri-arrow-go-forward-line', 'ri-arrow-left-fill', 'ri-arrow-left-line', 'ri-arrow-left-right-fill', 'ri-arrow-left-right-line', 'ri-arrow-m-down-fill', 'ri-arrow-m-down-line', 'ri-arrow-m-left-fill', 'ri-arrow-m-left-line', 'ri-arrow-m-right-fill', 'ri-arrow-m-right-line', 'ri-arrow-m-up-fill', 'ri-arrow-m-up-line', 'ri-arrow-right-fill', 'ri-arrow-right-line', 'ri-arrow-up-down-fill', 'ri-arrow-up-down-line', 'ri-arrow-up-fill', 'ri-arrow-up-line', 'ri-arrow-xs-down-fill', 'ri-arrow-xs-up-fill', 'ri-calendar-fill', 'ri-calendar-line', 'ri-check', 'ri-checkbox-fill', 'ri-checkbox-indeterminate-fill', 'ri-checkbox-indeterminate-line', 'ri-checkbox-line', 'ri-close-circle-fill', 'ri-close-circle-line', 'ri-close', 'ri-delete-bin-fill', 'ri-delete-bin-line', 'ri-error-warning-fill', 'ri-error-warning-line', 'ri-facebook', 'ri-information-fill', 'ri-information-line', 'ri-loader', 'ri-location', 'ri-message-fill', 'ri-message-line', 'ri-pencil-fill', 'ri-pencil-line', 'ri-question-fill', 'ri-question-line', 'ri-reply-fill', 'ri-reply-line', 'ri-search', 'ri-send-plane-fill', 'ri-send-plane-line', 'ri-settings-fill', 'ri-settings-line', 'ri-twitter'];
4
+ export var iconsMappingComponent = (_iconsMappingComponen = {}, _iconsMappingComponen['ri-account-circle-fill'] = Icons.RiAccountCircleFill, _iconsMappingComponen['ri-account-circle-line'] = Icons.RiAccountCircleLine, _iconsMappingComponen['ri-add-circle-fill'] = Icons.RiAddCircleFill, _iconsMappingComponen['ri-add-circle-line'] = Icons.RiAddCircleLine, _iconsMappingComponen['ri-add'] = Icons.RiAdd, _iconsMappingComponen['ri-alarm-warning-fill'] = Icons.RiAlarmWarningFill, _iconsMappingComponen['ri-alarm-warning-line'] = Icons.RiAlarmWarningLine, _iconsMappingComponen['ri-arrow-down-fill'] = Icons.RiArrowDownFill, _iconsMappingComponen['ri-arrow-down-line'] = Icons.RiArrowDownLine, _iconsMappingComponen['ri-arrow-go-back-fill'] = Icons.RiArrowGoBackFill, _iconsMappingComponen['ri-arrow-go-back-line'] = Icons.RiArrowGoBackLine, _iconsMappingComponen['ri-arrow-go-forward-fill'] = Icons.RiArrowGoForwardFill, _iconsMappingComponen['ri-arrow-go-forward-line'] = Icons.RiArrowGoForwardLine, _iconsMappingComponen['ri-arrow-left-fill'] = Icons.RiArrowLeftFill, _iconsMappingComponen['ri-arrow-left-line'] = Icons.RiArrowLeftLine, _iconsMappingComponen['ri-arrow-left-right-fill'] = Icons.RiArrowLeftRightFill, _iconsMappingComponen['ri-arrow-left-right-line'] = Icons.RiArrowLeftRightLine, _iconsMappingComponen['ri-arrow-m-down-fill'] = Icons.RiArrowMDownFill, _iconsMappingComponen['ri-arrow-m-down-line'] = Icons.RiArrowMDownLine, _iconsMappingComponen['ri-arrow-m-left-fill'] = Icons.RiArrowMLeftFill, _iconsMappingComponen['ri-arrow-m-left-line'] = Icons.RiArrowMLeftLine, _iconsMappingComponen['ri-arrow-m-right-fill'] = Icons.RiArrowMRightFill, _iconsMappingComponen['ri-arrow-m-right-line'] = Icons.RiArrowMRightLine, _iconsMappingComponen['ri-arrow-m-up-fill'] = Icons.RiArrowMUpFill, _iconsMappingComponen['ri-arrow-m-up-line'] = Icons.RiArrowMUpLine, _iconsMappingComponen['ri-arrow-right-fill'] = Icons.RiArrowRightFill, _iconsMappingComponen['ri-arrow-right-line'] = Icons.RiArrowRightLine, _iconsMappingComponen['ri-arrow-up-down-fill'] = Icons.RiArrowUpDownFill, _iconsMappingComponen['ri-arrow-up-down-line'] = Icons.RiArrowUpDownLine, _iconsMappingComponen['ri-arrow-up-fill'] = Icons.RiArrowUpFill, _iconsMappingComponen['ri-arrow-up-line'] = Icons.RiArrowUpLine, _iconsMappingComponen['ri-arrow-xs-down-fill'] = Icons.RiArrowXsDownFill, _iconsMappingComponen['ri-arrow-xs-up-fill'] = Icons.RiArrowXsUpFill, _iconsMappingComponen['ri-calendar-fill'] = Icons.RiCalendarFill, _iconsMappingComponen['ri-calendar-line'] = Icons.RiCalendarLine, _iconsMappingComponen['ri-check'] = Icons.RiCheck, _iconsMappingComponen['ri-checkbox-fill'] = Icons.RiCheckboxFill, _iconsMappingComponen['ri-checkbox-indeterminate-fill'] = Icons.RiCheckboxIndeterminateFill, _iconsMappingComponen['ri-checkbox-indeterminate-line'] = Icons.RiCheckboxIndeterminateLine, _iconsMappingComponen['ri-checkbox-line'] = Icons.RiCheckboxLine, _iconsMappingComponen['ri-close-circle-fill'] = Icons.RiCloseCircleFill, _iconsMappingComponen['ri-close-circle-line'] = Icons.RiCloseCircleLine, _iconsMappingComponen['ri-close'] = Icons.RiClose, _iconsMappingComponen['ri-delete-bin-fill'] = Icons.RiDeleteBinFill, _iconsMappingComponen['ri-delete-bin-line'] = Icons.RiDeleteBinLine, _iconsMappingComponen['ri-error-warning-fill'] = Icons.RiErrorWarningFill, _iconsMappingComponen['ri-error-warning-line'] = Icons.RiErrorWarningLine, _iconsMappingComponen['ri-facebook'] = Icons.RiFacebook, _iconsMappingComponen['ri-information-fill'] = Icons.RiInformationFill, _iconsMappingComponen['ri-information-line'] = Icons.RiInformationLine, _iconsMappingComponen['ri-loader'] = Icons.RiLoader, _iconsMappingComponen['ri-location'] = Icons.RiLocation, _iconsMappingComponen['ri-message-fill'] = Icons.RiMessageFill, _iconsMappingComponen['ri-message-line'] = Icons.RiMessageLine, _iconsMappingComponen['ri-pencil-fill'] = Icons.RiPencilFill, _iconsMappingComponen['ri-pencil-line'] = Icons.RiPencilLine, _iconsMappingComponen['ri-question-fill'] = Icons.RiQuestionFill, _iconsMappingComponen['ri-question-line'] = Icons.RiQuestionLine, _iconsMappingComponen['ri-reply-fill'] = Icons.RiReplyFill, _iconsMappingComponen['ri-reply-line'] = Icons.RiReplyLine, _iconsMappingComponen['ri-search'] = Icons.RiSearch, _iconsMappingComponen['ri-send-plane-fill'] = Icons.RiSendPlaneFill, _iconsMappingComponen['ri-send-plane-line'] = Icons.RiSendPlaneLine, _iconsMappingComponen['ri-settings-fill'] = Icons.RiSettingsFill, _iconsMappingComponen['ri-settings-line'] = Icons.RiSettingsLine, _iconsMappingComponen['ri-twitter'] = Icons.RiTwitter, _iconsMappingComponen);
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ import { IconProps } from '../Icon';
3
+ export declare const Spinner: (props: Omit<IconProps, 'name'>) => JSX.Element;
@@ -0,0 +1,15 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+ import React from 'react';
3
+ import styled from 'styled-components';
4
+ import { Icon } from '../Icon';
5
+ var StyledWrapper = styled.div.withConfig({
6
+ displayName: "Spinner__StyledWrapper",
7
+ componentId: "sc-ynwr5u-0"
8
+ })(["@keyframes p-keyframes-spin{to{transform:rotate(1turn);}}svg{animation:p-keyframes-spin 800ms linear infinite;}"]);
9
+ export var Spinner = function Spinner(props) {
10
+ return /*#__PURE__*/React.createElement(StyledWrapper, {
11
+ className: "spinner-container"
12
+ }, /*#__PURE__*/React.createElement(Icon, _extends({
13
+ name: "ri-loader"
14
+ }, props)));
15
+ };
@@ -1,10 +1,11 @@
1
- export { Button, OutlineButton, DestructiveButton, OutlineMonochromeButton, PrimaryButton, } from './Button';
1
+ export { Badge } from './Badge';
2
+ export { Button, DestructiveButton, OutlineButton, OutlineMonochromeButton, PrimaryButton, } from './Button';
2
3
  export { ButtonGroup } from './ButtonGroup';
3
4
  export { Icon } from './Icon';
5
+ export { Tab, TabProps, Tabs, TabsProps } from './Tabs';
4
6
  export { Typography } from './Typography';
5
- export { Tab, Tabs, TabProps, TabsProps } from './Tabs';
6
- import * as Breakpoints from './utilities/breakpoints';
7
7
  import * as BorderRadius from './utilities/borderRadius';
8
+ import * as Breakpoints from './utilities/breakpoints';
8
9
  import * as Colors from './utilities/colors';
9
10
  import * as DropShadow from './utilities/dropShadow';
10
11
  import * as Fonts from './utilities/fonts';
package/es/@next/index.js CHANGED
@@ -1,12 +1,13 @@
1
- export { Button, OutlineButton, DestructiveButton, OutlineMonochromeButton, PrimaryButton } from './Button';
1
+ export { Badge } from './Badge';
2
+ export { Button, DestructiveButton, OutlineButton, OutlineMonochromeButton, PrimaryButton } from './Button';
2
3
  export { ButtonGroup } from './ButtonGroup';
3
4
  export { Icon } from './Icon';
5
+ export { Tab, TabProps, Tabs, TabsProps } from './Tabs';
4
6
  export { Typography } from './Typography';
5
- export { Tab, Tabs, TabProps, TabsProps } from './Tabs';
6
7
 
7
8
  // Utilities
8
- import * as Breakpoints from './utilities/breakpoints';
9
9
  import * as BorderRadius from './utilities/borderRadius';
10
+ import * as Breakpoints from './utilities/breakpoints';
10
11
  import * as Colors from './utilities/colors';
11
12
  import * as DropShadow from './utilities/dropShadow';
12
13
  import * as Fonts from './utilities/fonts';