@invoicebox/ui 0.1.0-alpha.3 → 0.1.0-alpha.30

package/README.md

@@ -1,3 +1,17 @@
 # invoicebox-ui
 
-Invoicebox UI
+Библиотека компонентов Invoicebox.
+
+[Cторибук](https://ui.invoicebox.ru/) с документацией и примерами.
+
+# Установка
+
+```bash
+npm i @invoicebox/ui
+```
+
+или
+
+```bash
+yarn add @invoicebox/ui
+```

package/dist/breakpoints/index.d.ts

@@ -0,0 +1,7 @@
+export declare const breakpoints: {
+    sm: string;
+    md: string;
+    ld: string;
+    xl: string;
+    xxl: string;
+};

package/dist/breakpoints/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.breakpoints = void 0;
+var breakpoints = exports.breakpoints = {
+  sm: '(max-width: 576px)',
+  md: '(max-width: 767px)',
+  ld: '(max-width: 992px)',
+  xl: '(max-width: 1200px)',
+  xxl: '(max-width: 1400px)'
+};

package/dist/components/common/Arrow/components/StyledSvg/index.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export declare const StyledSvg: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("../Svg").TProps, {
+    $isOpen: boolean;
+    $isLight: boolean;
+    $openLightColor: string;
+    $closeLightColor: string;
+    $openUsualColor: string;
+    $closeUsualColor: string;
+    $padding: number;
+    $defaultRotate: number;
+}>> & Omit<import("react").FC<import("../Svg").TProps>, keyof import("react").Component<any, {}, any>>;

package/dist/components/common/Arrow/components/StyledSvg/index.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledSvg = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _Svg = require("../Svg");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var StyledSvg = exports.StyledSvg = (0, _styledComponents["default"])(_Svg.Svg).withConfig({
+  displayName: "StyledSvg",
+  componentId: "sc-8dnufv-0"
+})(["transform:rotateZ(", "deg);transition:all 0.2s ease-in-out 0s;box-sizing:content-box;padding:", "px;path{stroke:", ";"], function (_ref) {
+  var $isOpen = _ref.$isOpen,
+    $defaultRotate = _ref.$defaultRotate;
+  return $isOpen ? $defaultRotate + 180 : $defaultRotate;
+}, function (_ref2) {
+  var $padding = _ref2.$padding;
+  return $padding;
+}, function (_ref3) {
+  var $isLight = _ref3.$isLight,
+    $isOpen = _ref3.$isOpen,
+    $openLightColor = _ref3.$openLightColor,
+    $closeLightColor = _ref3.$closeLightColor,
+    $openUsualColor = _ref3.$openUsualColor,
+    $closeUsualColor = _ref3.$closeUsualColor;
+  if ($isLight && $isOpen) return $openLightColor;
+  if ($isLight && !$isOpen) return $closeLightColor;
+  if (!$isLight && $isOpen) return $openUsualColor;
+  if (!$isLight && !$isOpen) return $closeUsualColor;
+});

package/dist/components/common/Arrow/components/StyledSvg/index.stories.d.ts

@@ -0,0 +1,5 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { StyledSvg } from '.';
+declare const meta: Meta<typeof StyledSvg>;
+export default meta;
+export declare const Default: StoryObj<typeof StyledSvg>;

package/dist/components/common/Arrow/components/StyledSvg/index.stories.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _ = require(".");
+var meta = {
+  title: 'common/Arrow/_components/StyledSvg',
+  component: _.StyledSvg,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'centered'
+  }
+};
+var _default = exports["default"] = meta;
+var Default = exports.Default = {
+  args: {
+    $isOpen: false,
+    $isLight: false,
+    $openLightColor: '#cfc',
+    $closeLightColor: '#cac',
+    $openUsualColor: '#05b',
+    $closeUsualColor: '#00b',
+    size: 10,
+    $padding: 7,
+    $defaultRotate: 0
+  }
+};

package/dist/components/common/Arrow/components/Svg/index.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+export type TProps = {
+    className?: string;
+    size: number;
+};
+export declare const Svg: FC<TProps>;

package/dist/components/common/Arrow/components/Svg/index.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Svg = void 0;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var Svg = exports.Svg = function Svg(_ref) {
+  var className = _ref.className,
+    size = _ref.size;
+  return /*#__PURE__*/_react["default"].createElement("svg", {
+    className: className,
+    width: size,
+    height: size,
+    viewBox: "7 7 10 10",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/_react["default"].createElement("path", {
+    d: "M16.0846 9.95825L12.0013 14.0416L7.91797 9.95825",
+    stroke: "currentColor",
+    strokeWidth: "1.5",
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }));
+};

package/dist/components/common/Arrow/components/Svg/index.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { Svg, TProps } from '.';
+declare const meta: Meta<typeof Svg>;
+export default meta;
+type TStory = StoryObj<TProps>;
+export declare const Default: TStory;

package/dist/components/common/Arrow/components/Svg/index.stories.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _ = require(".");
+var meta = {
+  title: 'common/Arrow/_components/Svg',
+  component: _.Svg,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'centered'
+  }
+};
+var _default = exports["default"] = meta;
+var Default = exports.Default = {
+  args: {
+    size: 10
+  }
+};

package/dist/components/common/Arrow/index.d.ts

@@ -0,0 +1,11 @@
+import { FC } from 'react';
+import { TArrowPalette } from './palette';
+export type TProps = {
+    isOpen: boolean;
+    isLight?: boolean;
+    innerSize?: number;
+    outterSize?: number;
+    defaultRotate?: number;
+    palette?: Partial<TArrowPalette>;
+};
+export declare const Arrow: FC<TProps>;

package/dist/components/common/Arrow/index.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Arrow = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _StyledSvg = require("./components/StyledSvg");
+var _palette = require("../../../palette");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var Arrow = exports.Arrow = function Arrow(_ref) {
+  var isOpen = _ref.isOpen,
+    _ref$isLight = _ref.isLight,
+    isLight = _ref$isLight === void 0 ? false : _ref$isLight,
+    _ref$innerSize = _ref.innerSize,
+    innerSize = _ref$innerSize === void 0 ? 10 : _ref$innerSize,
+    _ref$outterSize = _ref.outterSize,
+    outterSize = _ref$outterSize === void 0 ? 24 : _ref$outterSize,
+    _ref$defaultRotate = _ref.defaultRotate,
+    defaultRotate = _ref$defaultRotate === void 0 ? 0 : _ref$defaultRotate,
+    palette = _ref.palette;
+  var mergedPalette = (0, _palette.useComponentPalette)('arrow', palette);
+  return /*#__PURE__*/_react["default"].createElement(_StyledSvg.StyledSvg, {
+    $isOpen: isOpen,
+    $isLight: isLight,
+    $openLightColor: mergedPalette.openLight,
+    $closeLightColor: mergedPalette.closeLight,
+    $openUsualColor: mergedPalette.openUsual,
+    $closeUsualColor: mergedPalette.closeUsual,
+    size: innerSize,
+    $padding: (outterSize - innerSize) / 2,
+    $defaultRotate: defaultRotate
+  });
+};

package/dist/components/common/Arrow/index.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { Arrow, TProps } from '.';
+declare const meta: Meta<typeof Arrow>;
+export default meta;
+type TStory = StoryObj<TProps>;
+export declare const Default: TStory;

package/dist/components/common/Arrow/index.stories.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _ = require(".");
+var meta = {
+  title: 'common/Arrow',
+  component: _.Arrow,
+  tags: ['autodocs']
+};
+var _default = exports["default"] = meta;
+var Default = exports.Default = {
+  args: {
+    isOpen: false,
+    isLight: false,
+    innerSize: 10,
+    outterSize: 24,
+    defaultRotate: 0
+  }
+};

package/dist/components/common/Arrow/palette.d.ts

@@ -0,0 +1,8 @@
+import { TAbstractPalette } from '../../../palette';
+export type TArrowPalette = {
+    openLight: string;
+    closeLight: string;
+    openUsual: string;
+    closeUsual: string;
+};
+export declare const generateArrowPalette: (abstractPalette: TAbstractPalette) => TArrowPalette;

package/dist/components/common/Arrow/palette.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateArrowPalette = void 0;
+var _hexToRgba = _interopRequireDefault(require("hex-to-rgba"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var generateArrowPalette = exports.generateArrowPalette = function generateArrowPalette(abstractPalette) {
+  return {
+    openLight: (0, _hexToRgba["default"])(abstractPalette.neutralUsual, 0.8),
+    closeLight: (0, _hexToRgba["default"])(abstractPalette.neutralUsual, 0.8),
+    openUsual: (0, _hexToRgba["default"])(abstractPalette.primary, 0.5),
+    closeUsual: (0, _hexToRgba["default"])(abstractPalette.primary, 0.5)
+  };
+};

package/dist/components/common/InvoiceboxLoader/index.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+export type TProps = {
+    width?: string;
+};
+export declare const InvoiceboxLoader: FC<TProps>;