@factoringplus/pl-components-pack-v3 2.0.0-pre-optimized-17-icons → 2.0.0-pre-optimized-19-icons

package/dist/vite.config.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vite').UserConfigExport;
+export default _default;

package/package.json

@@ -1,24 +1,27 @@
 {
   "name": "@factoringplus/pl-components-pack-v3",
   "private": false,
+  "files": [
+    "dist"
+  ],
   "type": "module",
-  "main": "./pl-components-pack-v3.cjs.js",
-  "module": "./pl-components-pack-v3.es.js",
-  "types": "./pl-components-pack-v3.d.ts",
+  "main": "./dist/pl-components-pack-v3.cjs.js",
+  "module": "./dist/pl-components-pack-v3.es.js",
+  "types": "./dist/pl-components-pack-v3.d.ts",
   "exports": {
     ".": {
-      "import": "./pl-components-pack-v3.es.js",
-      "require": "./pl-components-pack-v3.cjs.js",
-      "types": "./pl-components-pack-v3.d.ts"
+      "import": "./dist/pl-components-pack-v3.es.js",
+      "require": "./dist/pl-components-pack-v3.cjs.js",
+      "types": "./dist/pl-components-pack-v3.d.ts"
     },
     "./icons": {
-      "import": "./icons/index.es.js",
-      "require": "./icons/index.cjs.js",
-      "types": "./icons/index.d.ts"
+      "import": "./dist/icons/index.es.js",
+      "require": "./dist/icons/index.cjs.js",
+      "types": "./dist/icons/index.d.ts"
     },
-    "./style.css": "./dist/style.css"
+    "./style": "./dist/style.css"
   },
-  "version": "2.0.0-pre-optimized-17-icons",
+  "version": "2.0.0-pre-optimized-19-icons",
   "scripts": {
     "dev": "vite",
     "build": "vite build",

package/.editorconfig

@@ -1,10 +0,0 @@
-[*.{js,jsx,ts,tsx,vue,css}]
-indent_style = space
-indent_size = 2
-editor.tabSize = 4
-end_of_line = lf
-trim_trailing_whitespace = false
-insert_final_newline = true
-max_line_length = 120
-editor.insertSpaces = false
-editor.detectIndentation = false

package/.eslintrc.cjs

@@ -1,9 +0,0 @@
-module.exports = {
-  extends: [require.resolve('@factoringplus/frontend-configs/eslint')],
-  rules: {
-    '@typescript-eslint/ban-types': 'off',
-    '@typescript-eslint/no-var-requires': 'off',
-    '@typescript-eslint/explicit-module-boundary-types': 'off',
-    '@typescript-eslint/explicit-function-return-type': 'off',
-  },
-};

package/.github/workflows/gh-pages.yml

@@ -1,30 +0,0 @@
-name: GitHub Pages
-on:
-  push:
-    branches:
-      - main
-jobs:
-  deploy:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v2
-        with:
-          submodules: true
-
-      - name: Setup Node
-        uses: actions/setup-node@v2
-        with:
-          node-version: '14.x'
-
-      - name: Install Dependencies
-        run: npm install
-
-      - name: Build
-        run: npm run build
-
-      - name: Deploy
-        uses: peaceiris/actions-gh-pages@v3
-        with:
-          github_token: ${{ secrets.GITHUB_TOKEN }}
-          publish_dir: ./dist
-          force_orphan: true

package/.gitlab-ci.yml

@@ -1,27 +0,0 @@
-variables:
-  COMMIT: $CI_COMMIT_MESSAGE
-  TEST: 'TRUE'
-  # EXTRA_COMMAND: cp -r rowi-ui/* ./
-  REMOTE_REPO_URL: 'https://gitlab.service.rowi.tech/utils/vitepress.git'
-  # SUBMODULE_NAME: 'rowi-ui'
-  SERVICES_LIST:
-    value: 'https://gitlab.service.rowi.tech/utils/vitepress.git'
-    description: 'List of services and it repo urls, where ROWI-UI is submodule.'
-
-stages:
-  - playwright-test
-  - allure
-  - screenshot-download
-  - ensure_branch
-  - create_jobs_yml
-  - trigger_project_init
-
-include:
-  - project: 'global/templates'
-    file: 'stages/git/check-branch.yml'
-
-  - project: 'global/templates'
-    file: 'stages/git/trigger-project.yml'
-
-  - project: 'global/templates'
-    file: '/tests/e2e/playwright-nodejs.yml'

package/.husky/post-commit

@@ -1,5 +0,0 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
-
-# git stash pop stash@{0}
-# git checkout .gitignore

package/.husky/pre-commit

@@ -1,4 +0,0 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
-
-npx lint-staged

package/.prettierignore

@@ -1,2 +0,0 @@
-/docs/core/logs/index.md
-/docs/components/data/pl-table-plus/index.md

package/.prettierrc.cjs

@@ -1,5 +0,0 @@
-const prettierConfig = require('@factoringplus/frontend-configs/prettier/index.js');
-
-module.exports = {
-	...prettierConfig,
-};

package/.prettierrc.json

@@ -1,10 +0,0 @@
-{
-  "printWidth": 100,
-  "useTabs": false,
-  "tabWidth": 2,
-  "semi": true,
-  "singleQuote": true,
-  "trailingComma": "all",
-  "arrowParens": "always",
-  "endOfLine": "auto"
-}

package/.prettierrc.mjs

@@ -1,5 +0,0 @@
-import prettierConfig from '@factoringplus/frontend-configs/prettier/index.js';
-
-export default {
-	...prettierConfig,
-};

package/.stylelintignore

@@ -1,4 +0,0 @@
-dist
-build
-
-src/styles/tokens_scss/*.scss

package/.stylelintrc.json

@@ -1,24 +0,0 @@
-{
-  "extends": ["stylelint-config-standard-scss", "stylelint-config-recess-order"],
-  "overrides": [
-    {
-      "extends": ["stylelint-config-html/vue"],
-      "files": ["**/*.vue"]
-    },
-    {
-      "extends": ["stylelint-config-html/html"],
-      "files": ["**/*.html"]
-    }
-  ],
-  "rules": {
-    "no-descending-specificity": null,
-    "selector-class-pattern": null,
-    "scss/dollar-variable-pattern": null,
-    "font-family-no-missing-generic-family-keyword": null,
-    "custom-property-pattern": null,
-    "selector-pseudo-class-no-unknown": null,
-    "selector-id-pattern": null,
-    "value-keyword-case": null,
-    "scss/at-extend-no-missing-placeholder": null
-  }
-}

package/.vscode/extensions.json

@@ -1,3 +0,0 @@
-{
-  "recommendations": ["johnsoncodehk.volar"]
-}

package/.vscode/launch.json

@@ -1,15 +0,0 @@
-{
-  // Use IntelliSense to learn about possible attributes.
-  // Hover to view descriptions of existing attributes.
-  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
-  "version": "0.2.1",
-  "configurations": [
-    {
-      "type": "chrome",
-      "request": "launch",
-      "name": "Storybook",
-      "url": "http://localhost:6006",
-      "webRoot": "${workspaceFolder}/"
-    }
-  ]
-}

package/.vscode/settings.json

@@ -1,12 +0,0 @@
-{
-  "editor.defaultFormatter": "esbenp.prettier-vscode",
-  "editor.formatOnSave": true,
-  "css.validate": false,
-  "scss.validate": false,
-  "stylelint.validate": ["vue", "scss", "css", "html"],
-
-  "editor.codeActionsOnSave": {
-    "source.fixAll.stylelint": "explicit"
-  },
-  "cSpell.words": ["helpertext", "пропа"]
-}

package/buildStyles.cjs

@@ -1,108 +0,0 @@
-/* eslint-disable */
-
-const StyleDictionaryPackage = require('style-dictionary');
-
-StyleDictionaryPackage.registerFormat({
-  name: `custom-scss/variables`,
-  formatter: ({ dictionary }) =>
-    `${dictionary.allTokens
-      .map((token) => {
-        let value = token.value;
-        if (token.type === 'boxShadow') {
-          value = `${token.value.x}px ${token.value.y}px ${token.value.blur}px ${token.value.color}`;
-        }
-        if (token.type === 'sizing' || token.type === 'borderRadius' || token.type === 'spacing') {
-          value = `${token.original.value}px`;
-        }
-        return `$${token.name}: ${value};`;
-      })
-      .join(`\n`)}`,
-});
-
-StyleDictionaryPackage.registerFormat({
-  name: `custom-scss/color-variables`,
-  formatter: ({ dictionary }) => `:root {
-  ${dictionary.allTokens
-    .map((token) => {
-      let value = token.value;
-
-      if (token.name.includes('gradient')) {
-        value = `${token.original.value}`;
-      }
-      return `--${token.name}: ${value};`;
-    })
-    .join(`\n  `)}
-}`,
-});
-
-const getStyleDictionaryConfig = (platform) => {
-  return {
-    source: [`src/styles/tokens_json/${platform}.json`],
-    platforms: {
-      shadows: {
-        transformGroup: 'scss',
-        buildPath: `src/styles/tokens_scss/`,
-        prefix: 'token',
-        files: [
-          {
-            destination: 'shadows.scss',
-            format: 'custom-scss/variables',
-          },
-        ],
-      },
-      color: {
-        transformGroup: 'scss',
-        buildPath: `src/styles/tokens_scss/`,
-        prefix: 'token',
-        files: [
-          {
-            destination: 'color.css',
-            format: 'custom-scss/color-variables',
-          },
-        ],
-      },
-      radius: {
-        transformGroup: 'scss',
-        buildPath: `src/styles/tokens_scss/`,
-        prefix: 'token',
-        files: [
-          {
-            destination: 'radius.scss',
-            format: 'custom-scss/variables',
-          },
-        ],
-      },
-      spacing: {
-        transformGroup: 'scss',
-        buildPath: `src/styles/tokens_scss/`,
-        prefix: 'token',
-        files: [
-          {
-            destination: 'spacing.scss',
-            format: 'custom-scss/variables',
-          },
-        ],
-      },
-      size: {
-        transformGroup: 'scss',
-        buildPath: `src/styles/tokens_scss/`,
-        prefix: 'token',
-        files: [
-          {
-            destination: 'size.scss',
-            format: 'custom-scss/variables',
-          },
-        ],
-      },
-    },
-  };
-};
-
-const camelToKebabCase = (str) => str.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`);
-
-const platforms = ['color', 'radius', 'spacing', 'size', 'shadows'];
-
-platforms.map((platform) => {
-  const StyleDictionary = StyleDictionaryPackage.extend(getStyleDictionaryConfig(platform));
-  StyleDictionary.buildPlatform(platform);
-});

package/component-tests/basic/pl-button-dropdown.spec.ts

@@ -1,142 +0,0 @@
-import { test, expect } from '../fixtures';
-import PlButtonDropdown from '@/components/basic/pl-button-dropdown/pl-button-dropdown.vue';
-
-test('Button dropdown is shown', async ({ mount }) => {
-  const component = await mount(PlButtonDropdown, {
-    props: {
-      options: [
-        { label: 'Option 1', value: 'opt1' },
-        { label: 'Option 2', value: 'opt2' },
-      ],
-      modelValue: 'opt1',
-    },
-    slots: {
-      default: 'Primary',
-    },
-  });
-
-  const locator = component.getByTestId(/button-dropdown/);
-  await expect(locator).toBeVisible();
-  await expect(locator).toContainText('Primary');
-});
-
-test('opens dropdown on click and shows options', async ({ mount, page }) => {
-  const component = await mount(PlButtonDropdown, {
-    props: {
-      options: [
-        { label: 'Option 1', value: 'opt1' },
-        { label: 'Option 2', value: 'opt2' },
-      ],
-    },
-    slots: { default: 'Dropdown' },
-  });
-
-  await component.getByTestId('button-dropdown').click();
-  const dropdown = page.getByTestId('dropdown');
-  await expect(dropdown).toBeVisible();
-  await expect(dropdown).toContainText('Option 1');
-  await expect(dropdown).toContainText('Option 2');
-});
-
-
-test('emits update:modelValue and select-value on option click', async ({ mount, page }) => {
-  const emitted: any[] = [];
-  const component = await mount(PlButtonDropdown, {
-    props: {
-      options: [
-        { label: 'Option 1', value: 'opt1' },
-        { label: 'Option 2', value: 'opt2' },
-      ],
-      onSelectValue: (option) => emitted.push(['select-value', option]),
-      'onUpdate:modelValue': (val) => emitted.push(['update:modelValue', val]),
-    },
-    slots: { default: 'Dropdown' },
-  });
-
-  await component.getByTestId('button-dropdown').click();
-  const dropdown = page.getByTestId('dropdown');
-
-  await dropdown.getByText('Option 2').click();
-
-  expect(emitted).toEqual([
-    ['select-value', { label: 'Option 2', value: 'opt2' }],
-    ['update:modelValue', 'opt2'],
-  ]);
-});
-
-test('does not render icon when noIcon prop is true', async ({ mount, page }) => {
-  const component = await mount(PlButtonDropdown, {
-    props: {
-      options: [{ label: 'Option 1', value: 'opt1' }],
-      noIcon: true,
-    },
-    slots: { default: 'Dropdown' },
-  });
-
-  const locator = component.getByTestId(/button-dropdown/);
-  await expect(locator).toBeVisible();
-
-  const icon = page.getByTestId(/icon-right/);
-  await expect(icon).not.toBeAttached();
-});
-
-test('mobile version shows title from sheetTitle prop when width = 375', async ({ mount, page }) => {
-  await page.setViewportSize({ width: 375, height: 800 });
-
-  const component = await mount(PlButtonDropdown, {
-    props: {
-      options: [{ label: 'Option 1', value: 'opt1' }],
-      sheetTitle: 'My Sheet Title',
-    },
-    slots: { default: 'Dropdown' },
-  });
-
-  const button = component.getByTestId(/button-dropdown/);
-  await button.click();
-
-  const dialog = page.getByTestId(/dialog-title/);
-  await expect(dialog).toBeVisible();
-
-  await expect(dialog).toContainText('My Sheet Title');
-});
-
-
-test('dropdown positions correctly based on position right', async ({ mount }) => {
-  const component = await mount(PlButtonDropdown, {
-    props: {
-      options: [{ label: 'Option 1', value: 'opt1' }],
-      position: 'right',
-    },
-    slots: { default: 'Dropdown' },
-  });
-
-  const button = component.getByTestId(/button-dropdown/);
-  const dropdown = component.getByTestId(/dropdown/);
-
-  await button.click();
-  await expect(dropdown).toBeVisible();
-
-  const buttonBox = await button.evaluate(el => el.getBoundingClientRect());
-  const dropdownBox = await dropdown.evaluate(el => el.getBoundingClientRect());
-
-  expect(Math.abs(dropdownBox.right - buttonBox.right)).toBeLessThan(2);
-});
-
-test('dropdown is aligned to the left when position left', async ({ mount }) => {
-  const component = await mount(PlButtonDropdown, {
-    props: {
-      options: [{ label: 'Option 1', value: 'opt1' }],
-      position: 'left',
-    },
-    slots: { default: 'Dropdown' },
-  });
-
-  const button = component.getByTestId(/button-dropdown/);
-  const dropdown = component.getByTestId(/dropdown/);
-  await button.click();
-
-  const buttonBox = await button.evaluate(el => el.getBoundingClientRect());
-  const dropdownBox = await dropdown.evaluate(el => el.getBoundingClientRect());
-
-  expect(Math.abs(dropdownBox.left - buttonBox.left)).toBeLessThan(2);
-});

package/component-tests/basic/pl-button.spec.ts

@@ -1,140 +0,0 @@
-import { test, expect } from '../fixtures';
-import PlButton from '@/components/basic/pl-button/pl-button.vue';
-
-test('Button is shown', async ({ mount }) => {
-  const component = await mount(PlButton, {
-    props: { size: 'large' },
-    slots: { default: 'Primary' },
-  });
-
-  await expect(component).toBeVisible();
-  await expect(component).toContainText('Primary');
-});
-
-test('emits click when enabled', async ({ mount }) => {
-  let clicked = false;
-  const component = await mount(PlButton, {
-    props: {
-      size: 'large',
-      onClick: () => {
-        clicked = true;
-      },
-    },
-    slots: { default: 'Click me' },
-  });
-
-  await component.click();
-  expect(clicked).toBe(true);
-});
-
-test('does not emit click when disabled', async ({ mount }) => {
-  let clicked = false;
-  const component = await mount(PlButton, {
-    props: {
-      disabled: true,
-      onClick: () => {
-        clicked = true;
-      },
-    },
-    slots: { default: 'Disabled' },
-  });
-
-  await expect(component).toHaveAttribute('disabled');
-  await component.click({ force: true });
-  expect(clicked).toBe(false);
-});
-
-
-test.describe('PlButton iconPosition', () => {
-  for (const { position, testId } of [
-    { position: 'left', testId: 'Cube24' },
-    { position: 'right', testId: 'Cube24' },
-  ] as const) {
-    test(`shows ${position} icon when iconPosition = ${position}`, async ({ mount }) => {
-      const component = await mount(PlButton, {
-        props: {
-          icon: 'Cube24',
-          iconPosition: position,
-        },
-        slots: { default: 'With Icon' },
-      });
-
-      await expect(component.getByTestId(testId)).toBeVisible();
-    });
-  }
-});
-
-test('shows spinner when loading without icon', async ({ mount }) => {
-  const component = await mount(PlButton, {
-    props: { loading: true },
-    slots: { default: 'Loading' },
-  });
-
-  const spinner = component.locator('svg');
-  await expect(spinner).toBeVisible();
-});
-
-test('shows spinner next to icon when loading and icon present', async ({ mount }) => {
-  const component = await mount(PlButton, {
-    props: {
-      icon: 'Cube24',
-      iconPosition: 'left',
-      loading: true,
-    },
-    slots: { default: 'Loading Icon' },
-  });
-
-  await expect(component.getByTestId('spinner-with-icon-left')).toBeVisible();
-});
-
-
-test('button has class full-width', async ({ mount }) => {
-  const component = await mount(PlButton, {
-    props: { fullWidth: true },
-    slots: { default: 'Full Width' },
-  });
-
-  await expect(component).toHaveClass(/full-width/);
-});
-
-test.describe('type classes', () => {
-  const types = ['alternative', 'secondary', 'error', 'empty'] as const;
-
-  for (const type of types) {
-    test(`button has correct class for type="${type}"`, async ({ mount }) => {
-      const component = await mount(PlButton, {
-        props: { type },
-        slots: { default: type },
-      });
-
-      await expect(component).toHaveClass(new RegExp(`button-${type}`));
-    });
-  }
-});
-
-test.describe('size paddings', () => {
-  const sizes = {
-    large: { paddingLeft: '8px', paddingRight: '8px' },
-    medium: { paddingLeft: '4px', paddingRight: '4px' },
-    small: {},
-  } as const;
-
-  for (const [size, expected] of Object.entries(sizes)) {
-    test(`button has correct paddings for size="${size}"`, async ({ mount }) => {
-      const component = await mount(PlButton, {
-        props: { size },
-        slots: { default: size },
-      });
-
-      const locator = component.getByTestId('button');
-      const styles = await locator.evaluate(el => ({
-        paddingLeft: getComputedStyle(el).paddingLeft,
-        paddingRight: getComputedStyle(el).paddingRight,
-      }));
-
-      for (const [side, value] of Object.entries(expected)) {
-        expect(styles[side as keyof typeof styles]).toBe(value);
-      }
-    });
-  }
-});

package/component-tests/basic/pl-dialog.spec.ts

@@ -1,12 +0,0 @@
-import { test, expect } from '../fixtures';
-import PlDialogPlus from '@/components/basic/pl-dialog/pl-dialog-plus.vue';
-
-test('Dialog is shown', async ({ mount }) => {
-  const component = await mount(PlDialogPlus, {
-    props: { modelValue: true, title: 'Heading' },
-    slots: {
-      default: 'Content',
-    },
-  });
-  await expect(component).toHaveCount(1);
-});