@qoretechnologies/reqore 0.31.2 → 0.32.2

package/__tests__/panel.test.tsx

@@ -156,7 +156,7 @@ test('Renders <Panel /> without actions group if all actins are not shown', () =
   expect(document.querySelectorAll('.reqore-input').length).toBe(0);
 });
 
-test('Renders <Panel /> without title & bottom actions if all actions are not shown, there is no icon, title & is not collapsible', () => {
+test('Renders <Panel /> without title & bottom actions if all actions are not shown, there is no icon, & title is not collapsible', () => {
   render(
     <ReqoreUIProvider>
       <ReqoreLayoutContent>
@@ -202,3 +202,21 @@ test('Renders <Panel /> without title & bottom actions if all actions are not sh
   expect(document.querySelectorAll('.reqore-panel-title').length).toBe(0);
   expect(document.querySelectorAll('.reqore-panel-bottom-actions').length).toBe(0);
 });
+
+test('Tooltip on <Panel /> works', () => {
+  jest.useFakeTimers();
+
+  render(
+    <ReqoreUIProvider>
+      <ReqorePanel tooltip='Hello'>Hello</ReqorePanel>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-popover-content').length).toBe(0);
+
+  fireEvent.mouseEnter(document.querySelectorAll('.reqore-panel')[0]);
+
+  jest.advanceTimersByTime(1);
+
+  expect(document.querySelectorAll('.reqore-popover-content').length).toBe(1);
+});

package/__tests__/textarea.test.tsx

@@ -1,14 +1,11 @@
-import { fireEvent, render } from "@testing-library/react";
-import { noop } from "lodash";
-import React from "react";
-import {
-  ReqoreContent,
-  ReqoreLayoutContent,
-  ReqoreTextarea,
-  ReqoreUIProvider,
-} from "../src";
+import '@testing-library/jest-dom/extend-expect';
+import { fireEvent, render } from '@testing-library/react';
+import { noop } from 'lodash';
+import React from 'react';
+import { mockAllIsIntersecting } from 'react-intersection-observer/test-utils';
+import { ReqoreContent, ReqoreLayoutContent, ReqoreTextarea, ReqoreUIProvider } from '../src';
 
-test("Renders <TextArea /> properly", () => {
+test('Renders <TextArea /> properly', () => {
   render(
     <ReqoreUIProvider>
       <ReqoreLayoutContent>
@@ -19,37 +16,32 @@ test("Renders <TextArea /> properly", () => {
     </ReqoreUIProvider>
   );
 
-  expect(document.querySelectorAll(".reqore-textarea").length).toBe(1);
+  expect(document.querySelectorAll('.reqore-textarea').length).toBe(1);
   // No clear button
-  expect(document.querySelectorAll(".reqore-clear-input-button").length).toBe(
-    0
-  );
+  expect(document.querySelectorAll('.reqore-clear-input-button').length).toBe(0);
 });
 
-test("Renders <TextArea /> with clear button properly", () => {
+test('Renders <TextArea /> with clear button properly', () => {
   const fn = jest.fn();
 
   render(
     <ReqoreUIProvider>
       <ReqoreLayoutContent>
         <ReqoreContent>
-          <ReqoreTextarea minimal onChange={noop} onClearClick={fn} />
+          <ReqoreTextarea minimal onChange={noop} onClearClick={fn} value='test' />
         </ReqoreContent>
       </ReqoreLayoutContent>
     </ReqoreUIProvider>
   );
 
-  // No clear button
-  expect(document.querySelectorAll(".reqore-clear-input-button").length).toBe(
-    1
-  );
+  expect(document.querySelectorAll('.reqore-clear-input-button').length).toBe(1);
 
-  fireEvent.click(document.querySelector(".reqore-clear-input-button"));
+  fireEvent.click(document.querySelector('.reqore-clear-input-button')!);
 
   expect(fn).toHaveBeenCalled();
 });
 
-test("Disabled <TextArea /> cannot be cleared", () => {
+test('Disabled <TextArea /> cannot be cleared', () => {
   const fn = jest.fn();
 
   render(
@@ -63,7 +55,414 @@ test("Disabled <TextArea /> cannot be cleared", () => {
   );
 
   // No clear button
-  expect(document.querySelectorAll(".reqore-clear-input-button").length).toBe(
-    0
+  expect(document.querySelectorAll('.reqore-clear-input-button').length).toBe(0);
+});
+
+test('Readonly <Textarea /> cannot be cleared', () => {
+  const fn = jest.fn();
+
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea minimal onChange={noop} onClearClick={fn} readOnly />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  // No clear button
+  expect(document.querySelectorAll('.reqore-clear-input-button').length).toBe(0);
+});
+
+test('<Textarea /> gets automatically focused', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'auto' }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
   );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test('Readonly <Textarea /> does not get automatically focused', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'auto' }} readOnly />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+});
+
+test('Disabled <Textarea /> does not get automatically focused', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'auto' }} disabled />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+});
+
+test("<Textarea /> gets automatically focused if it's out of viewport", () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <div style={{ height: '100vh' }} />
+          <ReqoreTextarea focusRules={{ type: 'auto' }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test("<Textarea /> does not get automatically focused if it's out of viewport", () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <div style={{ height: '100vh' }} />
+          <ReqoreTextarea focusRules={{ type: 'auto', viewportOnly: true }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  mockAllIsIntersecting(false);
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+});
+
+test('<Textarea /> gets automatically focused if its inside of viewport', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'auto', viewportOnly: true }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  mockAllIsIntersecting(true);
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test('<Textarea /> gets focused after any letter is pressed', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: 'letters' }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: 'a',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test('<Textarea /> gets focused after any letter is pressed 2', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: 'letters' }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: '2',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: 'L',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test('<Textarea /> gets focused after any digit is pressed', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: 'numbers' }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: '1',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test('<Textarea /> gets focused after any digit is pressed 2', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: 'numbers' }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: 'u',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: '0',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test('<Textarea /> gets focused after any digit or letter is pressed', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: ['numbers', 'letters'] }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: 'm',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test('<Textarea /> gets focused after any digit or letter is pressed 2', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: ['numbers', 'letters'] }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: '5',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test('<Textarea /> gets focused after a specified shortcut is pressed', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: 's' }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: 'u',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: '0',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: 's',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test("<Textarea /> does not get focused after a specified shortcut is pressed if it's not in Viewport, get's focused when in viewport", () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: 's', viewportOnly: true }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  mockAllIsIntersecting(false);
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: 's',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  mockAllIsIntersecting(true);
+
+  fireEvent.keyDown(document, {
+    key: 's',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test('<Textarea /> does not get focused when typing in another input', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: 's' }} />
+          <ReqoreTextarea focusRules={{ type: 'auto' }} />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+  expect(document.querySelectorAll('.reqore-textarea')[1]).toHaveFocus();
+
+  fireEvent.keyDown(document.querySelectorAll('.reqore-textarea')[1], {
+    key: 's',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+  expect(document.querySelectorAll('.reqore-textarea')[1]).toHaveFocus();
+});
+
+test('Readonly <Textarea /> does not get focused when shortcut is pressed', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: 'letters' }} readOnly />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: 'q',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+});
+
+test('Disabled <Textarea /> does not get focused when shortcut is pressed', () => {
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea focusRules={{ type: 'keypress', shortcut: 'numbers' }} readOnly />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: '8',
+  });
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+});
+
+test('<Textarea /> is cleared when focused', () => {
+  const fn = jest.fn();
+
+  render(
+    <ReqoreUIProvider>
+      <ReqoreLayoutContent>
+        <ReqoreContent>
+          <ReqoreTextarea
+            focusRules={{ type: 'keypress', shortcut: 'letters', clearOnFocus: true }}
+            value='this is a test'
+            onChange={fn}
+          />
+        </ReqoreContent>
+      </ReqoreLayoutContent>
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-textarea')[0]).not.toHaveFocus();
+
+  fireEvent.keyDown(document, {
+    key: 'h',
+  });
+
+  expect(fn).toHaveBeenNthCalledWith(1, { target: { value: '' } });
+  expect(document.querySelectorAll('.reqore-textarea')[0]).toHaveFocus();
+});
+
+test('Tooltip on <Textarea /> works', () => {
+  jest.useFakeTimers();
+
+  render(
+    <ReqoreUIProvider>
+      <ReqoreTextarea tooltip='this is a test' value='this is a test' />
+    </ReqoreUIProvider>
+  );
+
+  expect(document.querySelectorAll('.reqore-popover-content').length).toBe(0);
+
+  fireEvent.mouseEnter(document.querySelectorAll('.reqore-textarea')[0]);
+
+  jest.advanceTimersByTime(1);
+
+  expect(document.querySelectorAll('.reqore-popover-content').length).toBe(1);
 });

package/__tests__/tree.test.tsx

@@ -22,7 +22,7 @@ test('Shows textarea for <Tree /> properly', () => {
     <ReqoreUIProvider>
       <ReqoreLayoutContent>
         <ReqoreContent>
-          <ReqoreTree data={MockObject} />
+          <ReqoreTree data={{ test: true }} />
         </ReqoreContent>
       </ReqoreLayoutContent>
     </ReqoreUIProvider>
@@ -31,6 +31,8 @@ test('Shows textarea for <Tree /> properly', () => {
   fireEvent.click(document.querySelector('.reqore-tree-as-text'));
 
   expect(document.querySelectorAll('.reqore-textarea').length).toBe(1);
+  console.log(document.querySelectorAll('.reqore-textarea')[0].textContent);
+  expect(document.querySelectorAll('.reqore-textarea')[0].textContent).toContain('test: true');
 });
 
 test('<Tree /> items can be expanded and collapsed', () => {

package/dist/components/Breadcrumbs/item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/item.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,qBAAqB,EAAE,MAAM,GAAG,CAAC;AAC1C,OAAO,EAAqC,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAcrD,MAAM,WAAW,0BAA2B,SAAQ,qBAAqB;IACvE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,0BAA2B,SAAQ,0BAA0B;IAC5E,KAAK,EAAE,YAAY,CAAC;CACrB;AAqFD,QAAA,MAAM,qBAAqB,uHAwC1B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
+{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/item.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,qBAAqB,EAAE,MAAM,GAAG,CAAC;AAC1C,OAAO,EAAqC,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAcrD,MAAM,WAAW,0BAA2B,SAAQ,qBAAqB;IACvE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,0BAA2B,SAAQ,0BAA0B;IAC5E,KAAK,EAAE,YAAY,CAAC;CACrB;AAqFD,QAAA,MAAM,qBAAqB,uHA4C1B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/components/Breadcrumbs/item.js

@@ -73,9 +73,13 @@ var StyledBreadcrumbItem = styled_components_1["default"].div(templateObject_4 |
 var ReqoreBreadcrumbsItem = (0, react_1.forwardRef)(function (_a, ref) {
     var tooltip = _a.tooltip, label = _a.label, props = _a.props, icon = _a.icon, active = _a.active, as = _a.as, interactive = _a.interactive, customTheme = _a.customTheme, _b = _a.size, size = _b === void 0 ? 'normal' : _b;
     var targetRef = (0, useCombinedRefs_1.useCombinedRefs)(ref).targetRef;
+    var _c = (0, react_1.useState)(undefined), itemRef = _c[0], setItemRef = _c[1];
     var theme = (0, useTheme_1.useReqoreTheme)('breadcrumbs', customTheme);
-    (0, useTooltip_1.useTooltip)(targetRef === null || targetRef === void 0 ? void 0 : targetRef.current, tooltip);
-    return ((0, jsx_runtime_1.jsxs)(StyledBreadcrumbItem, __assign({ ref: targetRef, active: active, interactive: interactive || !!(props === null || props === void 0 ? void 0 : props.onClick), className: 'reqore-breadcrumbs-item', theme: theme, size: size }, { children: [icon && (0, jsx_runtime_1.jsx)(Icon_1["default"], { icon: icon, size: size, margin: label ? 'right' : undefined }), label && ((0, jsx_runtime_1.jsxs)(Button_1.StyledAnimatedTextWrapper, __assign({ as: as || 'span' }, props, { children: [(0, jsx_runtime_1.jsx)(Button_1.StyledActiveContent, { children: label }), (0, jsx_runtime_1.jsx)(Button_1.StyledInActiveContent, { children: label }), (0, jsx_runtime_1.jsx)(Button_1.StyledInvisibleContent, { children: label })] })))] })));
+    (0, useTooltip_1.useTooltip)(itemRef, tooltip);
+    return ((0, jsx_runtime_1.jsxs)(StyledBreadcrumbItem, __assign({ ref: function (ref) {
+            targetRef.current = ref;
+            setItemRef(ref);
+        }, active: active, interactive: interactive || !!(props === null || props === void 0 ? void 0 : props.onClick), className: 'reqore-breadcrumbs-item', theme: theme, size: size }, { children: [icon && (0, jsx_runtime_1.jsx)(Icon_1["default"], { icon: icon, size: size, margin: label ? 'right' : undefined }), label && ((0, jsx_runtime_1.jsxs)(Button_1.StyledAnimatedTextWrapper, __assign({ as: as || 'span' }, props, { children: [(0, jsx_runtime_1.jsx)(Button_1.StyledActiveContent, { children: label }), (0, jsx_runtime_1.jsx)(Button_1.StyledInActiveContent, { children: label }), (0, jsx_runtime_1.jsx)(Button_1.StyledInvisibleContent, { children: label })] })))] })));
 });
 exports["default"] = ReqoreBreadcrumbsItem;
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/dist/components/Breadcrumbs/item.js.map

@@ -1 +1 @@
-{"version":3,"file":"item.js","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/item.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"item.js","sourceRoot":"","sources":["../../../src/components/Breadcrumbs/item.tsx"],"names":[],"mappings":"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"}

package/dist/components/Button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoD,MAAM,OAAO,CAAC;AAEzE,OAAO,EAML,MAAM,EACP,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAezE,OAAO,EACL,eAAe,EACf,aAAa,EACb,eAAe,EACf,iBAAiB,EACjB,eAAe,EACf,kBAAkB,EACnB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EACL,aAAa,EAIb,kBAAkB,EAClB,eAAe,EAChB,MAAM,WAAW,CAAC;AAGnB,OAAkB,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AAGpD,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,eAAe,CAAC;AAE7D,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAC7C,eAAe,EACf,aAAa,EACb,eAAe,EACf,iBAAiB;IACnB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IACxC,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,iBAAiB,CAAC,EAAE,aAAa,CAAC;CACnC;AAED,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,kBAAkB,EAAE,QAAQ,CAAC;IAC5E,KAAK,EAAE,YAAY,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,eAAe,CAAC;CACzB;AAUD,eAAO,MAAM,yBAAyB,KAOrC,CAAC;AAEF,eAAO,MAAM,mBAAmB,KAkB/B,CAAC;AAEF,eAAO,MAAM,qBAAqB,KAgBjC,CAAC;AAEF,eAAO,MAAM,sBAAsB,KAalC,CAAC;AAEF,eAAO,MAAM,YAAY,KA8IxB,CAAC;AAEF,eAAO,MAAM,mBAAmB,KAgB/B,CAAC;AAEF,MAAM,WAAW,uBAAwB,SAAQ,eAAe;IAC9D,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,OAAO,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,eAAO,MAAM,WAAW,oCAAgB,uBAAuB,iBA0C7D,CAAC;AAEH,QAAA,MAAM,YAAY,yHA6JjB,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAEvE,OAAO,EAML,MAAM,EACP,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAezE,OAAO,EACL,eAAe,EACf,aAAa,EACb,eAAe,EACf,iBAAiB,EACjB,eAAe,EACf,kBAAkB,EACnB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EACL,aAAa,EAIb,kBAAkB,EAClB,eAAe,EAChB,MAAM,WAAW,CAAC;AAGnB,OAAkB,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AAGpD,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,MAAM,GAAG,eAAe,CAAC;AAE7D,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAC7C,eAAe,EACf,aAAa,EACb,eAAe,EACf,iBAAiB;IACnB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IACxC,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,cAAc,CAAC,EAAE,kBAAkB,CAAC;IACpC,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,iBAAiB,CAAC,EAAE,aAAa,CAAC;CACnC;AAED,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,kBAAkB,EAAE,QAAQ,CAAC;IAC5E,KAAK,EAAE,YAAY,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,eAAe,CAAC;CACzB;AAUD,eAAO,MAAM,yBAAyB,KAOrC,CAAC;AAEF,eAAO,MAAM,mBAAmB,KAkB/B,CAAC;AAEF,eAAO,MAAM,qBAAqB,KAgBjC,CAAC;AAEF,eAAO,MAAM,sBAAsB,KAalC,CAAC;AAEF,eAAO,MAAM,YAAY,KA8IxB,CAAC;AAEF,eAAO,MAAM,mBAAmB,KAgB/B,CAAC;AAEF,MAAM,WAAW,uBAAwB,SAAQ,eAAe;IAC9D,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,OAAO,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACxC,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,eAAO,MAAM,WAAW,oCAAgB,uBAAuB,iBA0C7D,CAAC;AAEH,QAAA,MAAM,YAAY,yHAgLjB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/Button/index.js

@@ -58,10 +58,10 @@ var polished_1 = require("polished");
 var react_1 = require("react");
 var styled_components_1 = __importStar(require("styled-components"));
 var sizes_1 = require("../../constants/sizes");
-var ReqoreContext_1 = __importDefault(require("../../context/ReqoreContext"));
 var colors_1 = require("../../helpers/colors");
 var utils_1 = require("../../helpers/utils");
 var useCombinedRefs_1 = require("../../hooks/useCombinedRefs");
+var useReqoreContext_1 = require("../../hooks/useReqoreContext");
 var useReqoreEffect_1 = require("../../hooks/useReqoreEffect");
 var useTheme_1 = require("../../hooks/useTheme");
 var useTooltip_1 = require("../../hooks/useTooltip");
@@ -209,11 +209,12 @@ exports.ButtonBadge = (0, react_1.memo)(function (props) {
 var ReqoreButton = (0, react_1.memo)((0, react_1.forwardRef)(function (_a, ref) {
     var icon = _a.icon, _b = _a.size, size = _b === void 0 ? 'normal' : _b, minimal = _a.minimal, children = _a.children, tooltip = _a.tooltip, className = _a.className, fluid = _a.fluid, fixed = _a.fixed, intent = _a.intent, active = _a.active, flat = _a.flat, rightIcon = _a.rightIcon, customTheme = _a.customTheme, wrap = _a.wrap, readOnly = _a.readOnly, badge = _a.badge, description = _a.description, maxWidth = _a.maxWidth, _c = _a.textAlign, textAlign = _c === void 0 ? 'left' : _c, effect = _a.effect, labelEffect = _a.labelEffect, descriptionEffect = _a.descriptionEffect, leftIconColor = _a.leftIconColor, rightIconColor = _a.rightIconColor, iconColor = _a.iconColor, rest = __rest(_a, ["icon", "size", "minimal", "children", "tooltip", "className", "fluid", "fixed", "intent", "active", "flat", "rightIcon", "customTheme", "wrap", "readOnly", "badge", "description", "maxWidth", "textAlign", "effect", "labelEffect", "descriptionEffect", "leftIconColor", "rightIconColor", "iconColor"]);
     var targetRef = (0, useCombinedRefs_1.useCombinedRefs)(ref).targetRef;
-    var animations = (0, react_1.useContext)(ReqoreContext_1["default"]).animations;
+    var _d = (0, react_1.useState)(undefined), buttonRef = _d[0], setButtonRef = _d[1];
+    var animations = (0, useReqoreContext_1.useReqoreProperty)('animations');
     var theme = (0, useTheme_1.useReqoreTheme)('main', customTheme, intent);
     var fixedEffect = (0, useReqoreEffect_1.useReqoreEffect)('buttons', theme, effect);
     /* A custom hook that is used to add a tooltip to the button. */
-    (0, useTooltip_1.useTooltip)(targetRef.current, tooltip);
+    (0, useTooltip_1.useTooltip)(buttonRef, tooltip);
     // If color or intent was specified, set the color
     var customColor = intent ? theme.main : (0, colors_1.changeLightness)(theme.main, 0.07);
     var _flat = minimal ? flat : flat !== false;
@@ -224,7 +225,20 @@ var ReqoreButton = (0, react_1.memo)((0, react_1.forwardRef)(function (_a, ref)
         : (0, colors_1.getReadableColor)(theme, undefined, undefined, true);
     return ((0, jsx_runtime_1.jsxs)(exports.StyledButton, __assign({}, rest, { effect: intent
             ? undefined
-            : __assign({ interactive: !readOnly && !rest.disabled }, fixedEffect), as: 'button', theme: theme, ref: targetRef, fluid: fluid, fixed: fixed, maxWidth: maxWidth, minimal: minimal, size: size, color: customColor, animate: animations.buttons, flat: _flat, active: active, readOnly: readOnly, wrap: wrap, description: description, className: "".concat(className || '', " reqore-control reqore-button") }, { children: [(0, jsx_runtime_1.jsxs)(exports.StyledButtonContent, __assign({ size: size, wrap: wrap, description: description, flat: _flat }, { children: [icon ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Icon_1["default"], { icon: icon, size: size, color: leftIconColor || iconColor, style: textAlign !== 'left' ? { marginRight: 'auto' } : undefined }), children || badge || rightIcon ? ((0, jsx_runtime_1.jsx)(Spacer_1.ReqoreSpacer, { width: sizes_1.PADDING_FROM_SIZE[size] })) : null] })) : children ? ((0, jsx_runtime_1.jsx)(Spacer_1.ReqoreHorizontalSpacer, { width: 1, style: textAlign !== 'left' ? { marginRight: 'auto' } : undefined })) : null, children && ((0, jsx_runtime_1.jsxs)(exports.StyledAnimatedTextWrapper, __assign({ textAlign: textAlign, style: textAlign === 'center' ? { margin: 'auto' } : undefined }, { children: [(0, jsx_runtime_1.jsx)(exports.StyledActiveContent, __assign({ wrap: wrap, effect: labelEffect }, { children: children })), (0, jsx_runtime_1.jsx)(exports.StyledInActiveContent, __assign({ wrap: wrap, effect: labelEffect }, { children: children })), (0, jsx_runtime_1.jsx)(exports.StyledInvisibleContent, __assign({ wrap: wrap, effect: labelEffect }, { children: children })), (badge || badge === 0) && wrap ? ((0, jsx_runtime_1.jsx)(exports.ButtonBadge, { content: badge, size: size, color: color, wrap: true })) : null] }))), (badge || badge === 0) && !wrap ? ((0, jsx_runtime_1.jsx)(exports.ButtonBadge, { content: badge, size: size, color: color })) : null, !rightIcon ? (children ? ((0, jsx_runtime_1.jsx)(Spacer_1.ReqoreHorizontalSpacer, { width: 1, style: textAlign !== 'right' ? { marginLeft: 'auto' } : undefined })) : null) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [children || badge ? (0, jsx_runtime_1.jsx)(Spacer_1.ReqoreSpacer, { width: sizes_1.PADDING_FROM_SIZE[size] }) : null, (0, jsx_runtime_1.jsx)(Icon_1["default"], { icon: rightIcon, size: size, style: textAlign !== 'right' ? { marginLeft: 'auto' } : undefined, color: rightIconColor || iconColor })] }))] })), description && ((0, jsx_runtime_1.jsx)(Effect_1.ReqoreTextEffect, __assign({ className: 'reqore-button-description', effect: __assign({ textSize: (0, utils_1.getOneLessSize)(size), weight: 'light', color: "".concat(color, "90"), textAlign: textAlign }, descriptionEffect) }, { children: description })))] })));
+            : __assign({ interactive: !readOnly && !rest.disabled }, fixedEffect), tabindex: rest.disabled ? -1 : 0, as: 'button', theme: theme, ref: function (ref) {
+            targetRef.current = ref;
+            setButtonRef(ref);
+        }, fluid: fluid, fixed: fixed, maxWidth: maxWidth, minimal: minimal, size: size, color: customColor, animate: animations.buttons, flat: _flat, active: active, readOnly: readOnly, wrap: wrap, description: description, className: "".concat(className || '', " reqore-control reqore-button") }, { children: [(0, jsx_runtime_1.jsxs)(exports.StyledButtonContent, __assign({ size: size, wrap: wrap, description: description, flat: _flat }, { children: [icon ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Icon_1["default"], { icon: icon, size: size, color: leftIconColor || iconColor, style: textAlign !== 'left'
+                                    ? {
+                                        marginRight: 'auto',
+                                        marginLeft: textAlign === 'center' ? 'auto' : undefined
+                                    }
+                                    : undefined }), children || badge || rightIcon ? ((0, jsx_runtime_1.jsx)(Spacer_1.ReqoreSpacer, { width: sizes_1.PADDING_FROM_SIZE[size] })) : null] })) : children ? ((0, jsx_runtime_1.jsx)(Spacer_1.ReqoreHorizontalSpacer, { width: 1, style: textAlign !== 'left' ? { marginRight: 'auto' } : undefined })) : null, children && ((0, jsx_runtime_1.jsxs)(exports.StyledAnimatedTextWrapper, __assign({ textAlign: textAlign, style: textAlign === 'center' ? { margin: 'auto' } : undefined }, { children: [(0, jsx_runtime_1.jsx)(exports.StyledActiveContent, __assign({ wrap: wrap, effect: labelEffect }, { children: children })), (0, jsx_runtime_1.jsx)(exports.StyledInActiveContent, __assign({ wrap: wrap, effect: labelEffect }, { children: children })), (0, jsx_runtime_1.jsx)(exports.StyledInvisibleContent, __assign({ wrap: wrap, effect: labelEffect }, { children: children })), (badge || badge === 0) && wrap ? ((0, jsx_runtime_1.jsx)(exports.ButtonBadge, { content: badge, size: size, color: color, wrap: true })) : null] }))), (badge || badge === 0) && !wrap ? ((0, jsx_runtime_1.jsx)(exports.ButtonBadge, { content: badge, size: size, color: color })) : null, !rightIcon ? (children ? ((0, jsx_runtime_1.jsx)(Spacer_1.ReqoreHorizontalSpacer, { width: 1, style: textAlign !== 'right' ? { marginLeft: 'auto' } : undefined })) : null) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [children || badge ? (0, jsx_runtime_1.jsx)(Spacer_1.ReqoreSpacer, { width: sizes_1.PADDING_FROM_SIZE[size] }) : null, (0, jsx_runtime_1.jsx)(Icon_1["default"], { icon: rightIcon, size: size, style: textAlign !== 'right'
+                                    ? {
+                                        marginLeft: 'auto',
+                                        marginRight: textAlign === 'center' ? 'auto' : undefined
+                                    }
+                                    : undefined, color: rightIconColor || iconColor })] }))] })), description && ((0, jsx_runtime_1.jsx)(Effect_1.ReqoreTextEffect, __assign({ className: 'reqore-button-description', effect: __assign({ textSize: (0, utils_1.getOneLessSize)(size), weight: 'light', color: "".concat(color, "90"), textAlign: textAlign }, descriptionEffect) }, { children: description })))] })));
 }));
 exports["default"] = ReqoreButton;
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18;