@abstraks-dev/ui-library 1.1.26 → 1.1.28

package/dist/__tests__/Comment.test.js

@@ -0,0 +1,69 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _Comment = require("../icons/Comment.js");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// Suppress console.error during tests
+let consoleErrorSpy;
+beforeAll(() => {
+  consoleErrorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+});
+afterAll(() => {
+  consoleErrorSpy.mockRestore();
+});
+describe('Comment Icon', () => {
+  test('renders SVG element', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Comment.Comment, null));
+    const svg = document.querySelector('svg');
+    expect(svg).toBeInTheDocument();
+    expect(svg.tagName).toBe('svg');
+  });
+  test('has correct default props', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Comment.Comment, null));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('width', '24');
+    expect(svg).toHaveAttribute('height', '24');
+    expect(svg).toHaveAttribute('viewBox', '0 96 960 960');
+    expect(svg).toHaveAttribute('fill', '#adb5bd');
+    expect(svg).toHaveClass('icon');
+    expect(svg).toHaveClass('comment');
+  });
+  test('applies custom dimensions', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Comment.Comment, {
+      dimensions: 32
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('width', '32');
+    expect(svg).toHaveAttribute('height', '32');
+  });
+  test('applies custom componentName and additionalClassName', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Comment.Comment, {
+      componentName: "custom-comment",
+      additionalClassName: "extra-class"
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveClass('icon');
+    expect(svg).toHaveClass('custom-comment');
+    expect(svg).toHaveClass('extra-class');
+  });
+  test('applies custom fill color', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Comment.Comment, {
+      fill: "#ff0000"
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('fill', '#ff0000');
+  });
+  test('has correct path data', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Comment.Comment, null));
+    const svg = document.querySelector('svg');
+    const path = svg.querySelector('path');
+    expect(path).toHaveAttribute('d', 'M240 656h480v-60H240v60Zm0-130h480v-60H240v60Zm0-130h480v-60H240v60Zm640 580L720 816H140q-23 0-41.5-18.5T80 756V236q0-23 18.5-41.5T140 176h680q24 0 42 18.5t18 41.5v740ZM140 236v520h605l75 75V236H140Zm0 0v595-595Z');
+  });
+  test('contains exactly one path element', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Comment.Comment, null));
+    const svg = document.querySelector('svg');
+    const paths = svg.querySelectorAll('path');
+    expect(paths).toHaveLength(1);
+  });
+});

package/dist/__tests__/Ellipses.test.js

@@ -0,0 +1,61 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _Ellipses = require("../icons/Ellipses");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+describe('Ellipses Icon', () => {
+  test('renders with default props', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Ellipses.Ellipses, null));
+    const svg = document.querySelector('svg');
+    expect(svg).toBeInTheDocument();
+    expect(svg.tagName).toBe('svg');
+  });
+  test('applies correct default dimensions', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Ellipses.Ellipses, null));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('width', '24');
+    expect(svg).toHaveAttribute('height', '24');
+  });
+  test('applies custom dimensions', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Ellipses.Ellipses, {
+      dimensions: 32
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('width', '32');
+    expect(svg).toHaveAttribute('height', '32');
+  });
+  test('applies correct CSS classes', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Ellipses.Ellipses, null));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveClass('icon', 'ellipses');
+  });
+  test('applies additional className', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Ellipses.Ellipses, {
+      additionalClassName: "custom-class"
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveClass('icon', 'ellipses', 'custom-class');
+  });
+  test('applies custom fill color', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Ellipses.Ellipses, {
+      fill: "#ff0000"
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('fill', '#ff0000');
+  });
+  test('contains correct path data', () => {
+    const {
+      container
+    } = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Ellipses.Ellipses, null));
+    const path = container.querySelector('path');
+    expect(path).toHaveAttribute('d', 'M240-400q-33 0-56.5-23.5T160-480q0-33 23.5-56.5T240-560q33 0 56.5 23.5T320-480q0 33-23.5 56.5T240-400Zm240 0q-33 0-56.5-23.5T400-480q0-33 23.5-56.5T480-560q33 0 56.5 23.5T560-480q0 33-23.5 56.5T480-400Zm240 0q-33 0-56.5-23.5T640-480q0-33 23.5-56.5T720-560q33 0 56.5 23.5T800-480q0 33-23.5 56.5T720-400Z');
+  });
+  test('contains single path element', () => {
+    const {
+      container
+    } = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Ellipses.Ellipses, null));
+    const paths = container.querySelectorAll('path');
+    expect(paths).toHaveLength(1);
+  });
+});

package/dist/__tests__/Explore.test.js

@@ -0,0 +1,61 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _Explore = require("../icons/Explore");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+describe('Explore Icon', () => {
+  test('renders with default props', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Explore.Explore, null));
+    const svg = document.querySelector('svg');
+    expect(svg).toBeInTheDocument();
+    expect(svg.tagName).toBe('svg');
+  });
+  test('applies correct default dimensions', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Explore.Explore, null));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('width', '24');
+    expect(svg).toHaveAttribute('height', '24');
+  });
+  test('applies custom dimensions', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Explore.Explore, {
+      dimensions: 32
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('width', '32');
+    expect(svg).toHaveAttribute('height', '32');
+  });
+  test('applies correct CSS classes', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Explore.Explore, null));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveClass('icon', 'explore');
+  });
+  test('applies additional className', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Explore.Explore, {
+      additionalClassName: "custom-class"
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveClass('icon', 'explore', 'custom-class');
+  });
+  test('applies custom fill color', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Explore.Explore, {
+      fill: "#ff0000"
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('fill', '#ff0000');
+  });
+  test('contains correct path data', () => {
+    const {
+      container
+    } = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Explore.Explore, null));
+    const path = container.querySelector('path');
+    expect(path).toHaveAttribute('d', 'm300-300 280-80 80-280-280 80-80 280Zm180-120q-25 0-42.5-17.5T420-480q0-25 17.5-42.5T480-540q25 0 42.5 17.5T540-480q0 25-17.5 42.5T480-420Zm0 340q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q133 0 226.5-93.5T800-480q0-133-93.5-226.5T480-800q-133 0-226.5 93.5T160-480q0 133 93.5 226.5T480-160Zm0-320Z');
+  });
+  test('contains single path element', () => {
+    const {
+      container
+    } = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Explore.Explore, null));
+    const paths = container.querySelectorAll('path');
+    expect(paths).toHaveLength(1);
+  });
+});

package/dist/__tests__/FileInput.test.js

@@ -0,0 +1,148 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _FileInput = require("../components/FileInput");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// Suppress console.error during tests
+let consoleErrorSpy;
+beforeAll(() => {
+  consoleErrorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+});
+afterAll(() => {
+  consoleErrorSpy.mockRestore();
+});
+describe('FileInput Component', () => {
+  test('renders with default label', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, null));
+    expect(_react2.screen.getByText('Choose File')).toBeInTheDocument();
+  });
+  test('renders with custom label', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      label: "Upload Image"
+    }));
+    expect(_react2.screen.getByText('Upload Image')).toBeInTheDocument();
+  });
+  test('renders file input element', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, null));
+    const fileInput = _react2.screen.getByLabelText('File input');
+    expect(fileInput).toBeInTheDocument();
+    expect(fileInput).toHaveAttribute('type', 'file');
+  });
+  test('applies default props correctly', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, null));
+    const fileInput = _react2.screen.getByLabelText('File input');
+    expect(fileInput).toHaveAttribute('accept', '*/*');
+    expect(fileInput).not.toHaveAttribute('multiple');
+    expect(fileInput).not.toBeDisabled();
+  });
+  test('applies custom accept attribute', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      accept: "image/*"
+    }));
+    const fileInput = _react2.screen.getByLabelText('File input');
+    expect(fileInput).toHaveAttribute('accept', 'image/*');
+  });
+  test('enables multiple file selection when multiple is true', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      multiple: true
+    }));
+    const fileInput = _react2.screen.getByLabelText('File input');
+    expect(fileInput).toHaveAttribute('multiple');
+  });
+  test('disables input when disabled is true', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      disabled: true
+    }));
+    const fileInput = _react2.screen.getByLabelText('File input');
+    expect(fileInput).toBeDisabled();
+  });
+  test('applies disabled class when disabled', () => {
+    const {
+      container
+    } = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      disabled: true
+    }));
+    const wrapper = container.querySelector('.ui-file-input');
+    expect(wrapper).toHaveClass('ui-file-input--disabled');
+  });
+  test('calls onChange when file is selected', () => {
+    const onChange = jest.fn();
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      onChange: onChange
+    }));
+    const fileInput = _react2.screen.getByLabelText('File input');
+    const file = new File(['test'], 'test.txt', {
+      type: 'text/plain'
+    });
+    _react2.fireEvent.change(fileInput, {
+      target: {
+        files: [file]
+      }
+    });
+    expect(onChange).toHaveBeenCalledTimes(1);
+  });
+  test('applies custom className', () => {
+    const {
+      container
+    } = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      className: "custom-class"
+    }));
+    const wrapper = container.querySelector('.ui-file-input');
+    expect(wrapper).toHaveClass('ui-file-input');
+    expect(wrapper).toHaveClass('custom-class');
+  });
+  test('applies custom aria-label', () => {
+    const {
+      container
+    } = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      ariaLabel: "Custom file input"
+    }));
+    const fileInput = container.querySelector('input[type="file"]');
+    expect(fileInput).toHaveAttribute('aria-label', 'Custom file input');
+  });
+  test('applies aria-describedby attribute', () => {
+    const {
+      container
+    } = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      ariaDescribedBy: "file-help"
+    }));
+    const fileInput = container.querySelector('input[type="file"]');
+    expect(fileInput).toHaveAttribute('aria-describedby', 'file-help');
+  });
+  test('triggers file input click when label is clicked', () => {
+    const {
+      container
+    } = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      label: "Click me"
+    }));
+    const label = _react2.screen.getByText('Click me');
+    const fileInput = container.querySelector('input[type="file"]');
+    const clickSpy = jest.spyOn(fileInput, 'click');
+    _react2.fireEvent.click(label);
+    expect(clickSpy).toHaveBeenCalled();
+    clickSpy.mockRestore();
+  });
+  test('does not trigger click when disabled', () => {
+    const {
+      container
+    } = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      label: "Click me",
+      disabled: true
+    }));
+    const label = _react2.screen.getByText('Click me');
+    const fileInput = container.querySelector('input[type="file"]');
+    const clickSpy = jest.spyOn(fileInput, 'click');
+    _react2.fireEvent.click(label);
+    expect(clickSpy).not.toHaveBeenCalled();
+    clickSpy.mockRestore();
+  });
+  test('forwards ref correctly', () => {
+    const ref = /*#__PURE__*/_react.default.createRef();
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_FileInput.FileInput, {
+      ref: ref
+    }));
+    expect(ref.current).toBeInstanceOf(HTMLInputElement);
+    expect(ref.current.type).toBe('file');
+  });
+});

package/dist/__tests__/Filter.test.js

@@ -0,0 +1,69 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _Filter = require("../icons/Filter.js");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+// Suppress console.error during tests
+let consoleErrorSpy;
+beforeAll(() => {
+  consoleErrorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+});
+afterAll(() => {
+  consoleErrorSpy.mockRestore();
+});
+describe('Filter Icon', () => {
+  test('renders SVG element', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Filter.Filter, null));
+    const svg = document.querySelector('svg');
+    expect(svg).toBeInTheDocument();
+    expect(svg.tagName).toBe('svg');
+  });
+  test('has correct default props', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Filter.Filter, null));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('width', '24');
+    expect(svg).toHaveAttribute('height', '24');
+    expect(svg).toHaveAttribute('viewBox', '0 -960 960 960');
+    expect(svg).toHaveAttribute('fill', '#adb5bd');
+    expect(svg).toHaveClass('icon');
+    expect(svg).toHaveClass('filter');
+  });
+  test('applies custom dimensions', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Filter.Filter, {
+      dimensions: 32
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('width', '32');
+    expect(svg).toHaveAttribute('height', '32');
+  });
+  test('applies custom componentName and additionalClassName', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Filter.Filter, {
+      componentName: "custom-filter",
+      additionalClassName: "extra-class"
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveClass('icon');
+    expect(svg).toHaveClass('custom-filter');
+    expect(svg).toHaveClass('extra-class');
+  });
+  test('applies custom fill color', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Filter.Filter, {
+      fill: "#ff0000"
+    }));
+    const svg = document.querySelector('svg');
+    expect(svg).toHaveAttribute('fill', '#ff0000');
+  });
+  test('has correct path data', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Filter.Filter, null));
+    const svg = document.querySelector('svg');
+    const path = svg.querySelector('path');
+    expect(path).toHaveAttribute('d', 'M440-120v-240h80v80h320v80H520v80h-80Zm-320-80v-80h240v80H120Zm160-160v-80H120v-80h160v-80h80v240h-80Zm160-80v-80h400v80H440Zm160-160v-240h80v80h160v80H680v80h-80Zm-480-80v-80h400v80H120Z');
+  });
+  test('contains exactly one path element', () => {
+    (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Filter.Filter, null));
+    const svg = document.querySelector('svg');
+    const paths = svg.querySelectorAll('path');
+    expect(paths).toHaveLength(1);
+  });
+});