@justfixnyc/component-library 0.30.0 → 0.31.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.
@@ -14,9 +14,10 @@ const Button = /*#__PURE__*/React.forwardRef((_ref, ref) => {
14
14
  labelIcon: ButtonIcon,
15
15
  iconOnRight,
16
16
  iconOnly,
17
+ className,
17
18
  ...props
18
19
  } = _ref;
19
- const buttonClassNames = classNames('jfcl-button', "jfcl-variant-".concat(variant), "jfcl-size-".concat(size), "".concat(loading ? 'jfcl-is-loading' : ''), "".concat(iconOnly ? 'jfcl-btn-icon-only' : ''));
20
+ const buttonClassNames = classNames('jfcl-button', "jfcl-variant-".concat(variant), "jfcl-size-".concat(size), "".concat(loading ? 'jfcl-is-loading' : ''), "".concat(iconOnly ? 'jfcl-btn-icon-only' : ''), className);
20
21
  const iconClassNames = classNames('jfcl-button__icon', "".concat(iconOnRight ? 'jfcl-button__icon_right' : ''));
21
22
  const arias = {};
22
23
  if (iconOnly) {
@@ -85,10 +86,10 @@ const IconLinkInternal = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/Re
85
86
  cx: "8.31371",
86
87
  cy: "8.01465",
87
88
  r: "7.5",
88
- stroke: "#242323"
89
+ stroke: "currentcolor"
89
90
  }), /*#__PURE__*/React.createElement("path", {
90
91
  d: "M4.62639 7.70676C4.35025 7.70676 4.12639 7.93061 4.12639 8.20676C4.12639 8.4829 4.35025 8.70676 4.62639 8.70676V7.70676ZM11.9344 8.56031C12.1297 8.36505 12.1297 8.04847 11.9344 7.8532L8.75241 4.67122C8.55715 4.47596 8.24056 4.47596 8.0453 4.67122C7.85004 4.86648 7.85004 5.18307 8.0453 5.37833L10.8737 8.20676L8.0453 11.0352C7.85004 11.2304 7.85004 11.547 8.0453 11.7423C8.24056 11.9376 8.55715 11.9376 8.75241 11.7423L11.9344 8.56031ZM4.62639 8.70676H11.5808V7.70676H4.62639V8.70676Z",
91
- fill: "#242323"
92
+ fill: "currentcolor"
92
93
  })));
93
94
  IconLinkInternal.displayName = 'IconLinkInternal';
94
95
  var IconLinkInternal$1 = IconLinkInternal;
@@ -240,6 +241,38 @@ const IconPerson = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/React.cr
240
241
  IconPerson.displayName = 'IconPerson';
241
242
  var IconPerson$1 = IconPerson;
242
243
 
244
+ const IconTwitter = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
245
+ ref: ref
246
+ }, props, {
247
+ xmlns: "http://www.w3.org/2000/svg",
248
+ width: "17",
249
+ height: "16",
250
+ viewBox: "0 0 17 16",
251
+ fill: "none"
252
+ }), /*#__PURE__*/React.createElement("path", {
253
+ d: "M16.3219 2.63826C15.7321 2.92194 15.0999 3.11242 14.4352 3.19888C15.1136 2.75849 15.6348 2.06142 15.8793 1.23198C15.2458 1.63859 14.5412 1.93444 13.7943 2.09385C13.1958 1.40219 12.3428 0.971252 11.3989 0.971252C9.58574 0.971252 8.11555 2.56261 8.11555 4.52681C8.11555 4.80509 8.14548 5.07662 8.2016 5.33735C5.4732 5.18875 3.05531 3.77301 1.43548 1.62103C1.15242 2.14788 0.991558 2.75849 0.991558 3.40962C0.991558 4.64298 1.57016 5.73181 2.45177 6.37078C1.91308 6.35187 1.4068 6.19111 0.964125 5.92498C0.964125 5.93984 0.964125 5.9547 0.964125 5.96956C0.964125 7.69331 2.09638 9.12931 3.5965 9.45757C3.32216 9.53863 3.03162 9.58186 2.73234 9.58186C2.52036 9.58186 2.3146 9.56024 2.11384 9.51701C2.53283 10.9287 3.74489 11.9594 5.18016 11.9878C4.05788 12.9415 2.64256 13.5089 1.10379 13.5089C0.83818 13.5089 0.577561 13.4927 0.32193 13.4589C1.77341 14.4694 3.49923 15.057 5.35349 15.057C11.3914 15.057 14.6934 9.6386 14.6934 4.94018C14.6934 4.78618 14.6896 4.63083 14.6846 4.47953C15.3256 3.97834 15.8817 3.35153 16.3219 2.63826Z",
254
+ fill: "currentColor"
255
+ })));
256
+ IconTwitter.displayName = 'IconTwitter';
257
+ var IconTwitter$1 = IconTwitter;
258
+
259
+ const IconMail = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/React.createElement("svg", _extends({
260
+ ref: ref
261
+ }, props, {
262
+ xmlns: "http://www.w3.org/2000/svg",
263
+ width: "17",
264
+ height: "12",
265
+ viewBox: "0 0 17 12",
266
+ fill: "none"
267
+ }), /*#__PURE__*/React.createElement("path", {
268
+ fillRule: "evenodd",
269
+ clipRule: "evenodd",
270
+ d: "M16.3219 0.206634V0.0570068H0.32193V0.147015L8.33971 6.46405L16.3219 0.206634ZM0.32193 2.69319V11.6751H16.3219V2.74792L8.9551 8.52292L8.3366 9.00778L7.71928 8.52141L0.32193 2.69319Z",
271
+ fill: "currentColor"
272
+ })));
273
+ IconMail.displayName = 'IconMail';
274
+ var IconMail$1 = IconMail;
275
+
243
276
  const Alert = /*#__PURE__*/forwardRef((_ref, ref) => {
244
277
  let {
245
278
  type = 'info',
@@ -292,4 +325,4 @@ const Link = /*#__PURE__*/forwardRef((_ref, ref) => {
292
325
  });
293
326
  Link.displayName = 'Link';
294
327
 
295
- export { Alert, Button, IconCheck$1 as IconCheck, IconChevron$1 as IconChevron, IconClose$1 as IconClose, IconError$1 as IconError, IconGlobe$1 as IconGlobe, IconHamburger$1 as IconHamburger, IconInternet$1 as IconInternet, IconLinkExternal, IconLinkInternal$1 as IconLinkInternal, IconLoading$1 as IconLoading, IconPerson$1 as IconPerson, Link };
328
+ export { Alert, Button, IconCheck$1 as IconCheck, IconChevron$1 as IconChevron, IconClose$1 as IconClose, IconError$1 as IconError, IconGlobe$1 as IconGlobe, IconHamburger$1 as IconHamburger, IconInternet$1 as IconInternet, IconLinkExternal, IconLinkInternal$1 as IconLinkInternal, IconLoading$1 as IconLoading, IconMail$1 as IconMail, IconPerson$1 as IconPerson, IconTwitter$1 as IconTwitter, Link };
package/dist/src/index.js CHANGED
@@ -24,9 +24,10 @@ const Button = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) =>
24
24
  labelIcon: ButtonIcon,
25
25
  iconOnRight,
26
26
  iconOnly,
27
+ className,
27
28
  ...props
28
29
  } = _ref;
29
- const buttonClassNames = classNames__default["default"]('jfcl-button', "jfcl-variant-".concat(variant), "jfcl-size-".concat(size), "".concat(loading ? 'jfcl-is-loading' : ''), "".concat(iconOnly ? 'jfcl-btn-icon-only' : ''));
30
+ const buttonClassNames = classNames__default["default"]('jfcl-button', "jfcl-variant-".concat(variant), "jfcl-size-".concat(size), "".concat(loading ? 'jfcl-is-loading' : ''), "".concat(iconOnly ? 'jfcl-btn-icon-only' : ''), className);
30
31
  const iconClassNames = classNames__default["default"]('jfcl-button__icon', "".concat(iconOnRight ? 'jfcl-button__icon_right' : ''));
31
32
  const arias = {};
32
33
  if (iconOnly) {
@@ -95,10 +96,10 @@ const IconLinkInternal = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE
95
96
  cx: "8.31371",
96
97
  cy: "8.01465",
97
98
  r: "7.5",
98
- stroke: "#242323"
99
+ stroke: "currentcolor"
99
100
  }), /*#__PURE__*/React__default["default"].createElement("path", {
100
101
  d: "M4.62639 7.70676C4.35025 7.70676 4.12639 7.93061 4.12639 8.20676C4.12639 8.4829 4.35025 8.70676 4.62639 8.70676V7.70676ZM11.9344 8.56031C12.1297 8.36505 12.1297 8.04847 11.9344 7.8532L8.75241 4.67122C8.55715 4.47596 8.24056 4.47596 8.0453 4.67122C7.85004 4.86648 7.85004 5.18307 8.0453 5.37833L10.8737 8.20676L8.0453 11.0352C7.85004 11.2304 7.85004 11.547 8.0453 11.7423C8.24056 11.9376 8.55715 11.9376 8.75241 11.7423L11.9344 8.56031ZM4.62639 8.70676H11.5808V7.70676H4.62639V8.70676Z",
101
- fill: "#242323"
102
+ fill: "currentcolor"
102
103
  })));
103
104
  IconLinkInternal.displayName = 'IconLinkInternal';
104
105
  var IconLinkInternal$1 = IconLinkInternal;
@@ -250,6 +251,38 @@ const IconPerson = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/Re
250
251
  IconPerson.displayName = 'IconPerson';
251
252
  var IconPerson$1 = IconPerson;
252
253
 
254
+ const IconTwitter = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React__default["default"].createElement("svg", _extends__default["default"]({
255
+ ref: ref
256
+ }, props, {
257
+ xmlns: "http://www.w3.org/2000/svg",
258
+ width: "17",
259
+ height: "16",
260
+ viewBox: "0 0 17 16",
261
+ fill: "none"
262
+ }), /*#__PURE__*/React__default["default"].createElement("path", {
263
+ d: "M16.3219 2.63826C15.7321 2.92194 15.0999 3.11242 14.4352 3.19888C15.1136 2.75849 15.6348 2.06142 15.8793 1.23198C15.2458 1.63859 14.5412 1.93444 13.7943 2.09385C13.1958 1.40219 12.3428 0.971252 11.3989 0.971252C9.58574 0.971252 8.11555 2.56261 8.11555 4.52681C8.11555 4.80509 8.14548 5.07662 8.2016 5.33735C5.4732 5.18875 3.05531 3.77301 1.43548 1.62103C1.15242 2.14788 0.991558 2.75849 0.991558 3.40962C0.991558 4.64298 1.57016 5.73181 2.45177 6.37078C1.91308 6.35187 1.4068 6.19111 0.964125 5.92498C0.964125 5.93984 0.964125 5.9547 0.964125 5.96956C0.964125 7.69331 2.09638 9.12931 3.5965 9.45757C3.32216 9.53863 3.03162 9.58186 2.73234 9.58186C2.52036 9.58186 2.3146 9.56024 2.11384 9.51701C2.53283 10.9287 3.74489 11.9594 5.18016 11.9878C4.05788 12.9415 2.64256 13.5089 1.10379 13.5089C0.83818 13.5089 0.577561 13.4927 0.32193 13.4589C1.77341 14.4694 3.49923 15.057 5.35349 15.057C11.3914 15.057 14.6934 9.6386 14.6934 4.94018C14.6934 4.78618 14.6896 4.63083 14.6846 4.47953C15.3256 3.97834 15.8817 3.35153 16.3219 2.63826Z",
264
+ fill: "currentColor"
265
+ })));
266
+ IconTwitter.displayName = 'IconTwitter';
267
+ var IconTwitter$1 = IconTwitter;
268
+
269
+ const IconMail = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React__default["default"].createElement("svg", _extends__default["default"]({
270
+ ref: ref
271
+ }, props, {
272
+ xmlns: "http://www.w3.org/2000/svg",
273
+ width: "17",
274
+ height: "12",
275
+ viewBox: "0 0 17 12",
276
+ fill: "none"
277
+ }), /*#__PURE__*/React__default["default"].createElement("path", {
278
+ fillRule: "evenodd",
279
+ clipRule: "evenodd",
280
+ d: "M16.3219 0.206634V0.0570068H0.32193V0.147015L8.33971 6.46405L16.3219 0.206634ZM0.32193 2.69319V11.6751H16.3219V2.74792L8.9551 8.52292L8.3366 9.00778L7.71928 8.52141L0.32193 2.69319Z",
281
+ fill: "currentColor"
282
+ })));
283
+ IconMail.displayName = 'IconMail';
284
+ var IconMail$1 = IconMail;
285
+
253
286
  const Alert = /*#__PURE__*/React.forwardRef((_ref, ref) => {
254
287
  let {
255
288
  type = 'info',
@@ -314,5 +347,7 @@ exports.IconInternet = IconInternet$1;
314
347
  exports.IconLinkExternal = IconLinkExternal;
315
348
  exports.IconLinkInternal = IconLinkInternal$1;
316
349
  exports.IconLoading = IconLoading$1;
350
+ exports.IconMail = IconMail$1;
317
351
  exports.IconPerson = IconPerson$1;
352
+ exports.IconTwitter = IconTwitter$1;
318
353
  exports.Link = Link;
@@ -8,6 +8,7 @@ export interface ButtonProps extends React.ComponentPropsWithoutRef<'button'> {
8
8
  loading?: boolean;
9
9
  iconOnRight?: boolean;
10
10
  iconOnly?: boolean;
11
+ className?: string;
11
12
  }
12
13
  /**
13
14
  * Accepts all `ButtonHTMLAttributes`
@@ -9,4 +9,6 @@ import IconGlobe from './Globe';
9
9
  import IconHamburger from './Hamburger';
10
10
  import IconInternet from './Internet';
11
11
  import IconPerson from './Person';
12
- export { IconLoading, IconLinkExternal, IconLinkInternal, IconCheck, IconError, IconChevron, IconClose, IconGlobe, IconHamburger, IconInternet, IconPerson, };
12
+ import IconTwitter from './Twitter';
13
+ import IconMail from './Mail';
14
+ export { IconLoading, IconLinkExternal, IconLinkInternal, IconCheck, IconError, IconTwitter, IconChevron, IconClose, IconGlobe, IconHamburger, IconInternet, IconPerson, IconMail, };
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ declare const IconMail: React.ForwardRefExoticComponent<React.SVGAttributes<SVGSVGElement> & React.RefAttributes<SVGSVGElement>>;
3
+ export default IconMail;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ declare const IconTwitter: React.ForwardRefExoticComponent<React.SVGAttributes<SVGSVGElement> & React.RefAttributes<SVGSVGElement>>;
3
+ export default IconTwitter;
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@justfixnyc/component-library",
3
3
  "description": "JustFix Component Library",
4
4
  "license": "MIT",
5
- "version": "0.30.0",
5
+ "version": "0.31.0",
6
6
  "main": "dist/src/index.js",
7
7
  "module": "dist/src/index.es.js",
8
8
  "files": [