@eturnity/eturnity_reusable_components 7.33.2 → 7.33.4-EPDM-11766.0

package/src/stories/header.css

@@ -0,0 +1,32 @@
+.storybook-header {
+  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+  padding: 15px 20px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.storybook-header svg {
+  display: inline-block;
+  vertical-align: top;
+}
+
+.storybook-header h1 {
+  font-weight: 700;
+  font-size: 20px;
+  line-height: 1;
+  margin: 6px 0 6px 10px;
+  display: inline-block;
+  vertical-align: top;
+}
+
+.storybook-header button + button {
+  margin-left: 10px;
+}
+
+.storybook-header .welcome {
+  color: #333;
+  font-size: 14px;
+  margin-right: 10px;
+}

package/src/stories/page.css

@@ -0,0 +1,69 @@
+.storybook-page {
+  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-size: 14px;
+  line-height: 24px;
+  padding: 48px 20px;
+  margin: 0 auto;
+  max-width: 600px;
+  color: #333;
+}
+
+.storybook-page h2 {
+  font-weight: 700;
+  font-size: 32px;
+  line-height: 1;
+  margin: 0 0 4px;
+  display: inline-block;
+  vertical-align: top;
+}
+
+.storybook-page p {
+  margin: 1em 0;
+}
+
+.storybook-page a {
+  text-decoration: none;
+  color: #1ea7fd;
+}
+
+.storybook-page ul {
+  padding-left: 30px;
+  margin: 1em 0;
+}
+
+.storybook-page li {
+  margin-bottom: 8px;
+}
+
+.storybook-page .tip {
+  display: inline-block;
+  border-radius: 1em;
+  font-size: 11px;
+  line-height: 12px;
+  font-weight: 700;
+  background: #e7fdd8;
+  color: #66bf3c;
+  padding: 4px 12px;
+  margin-right: 10px;
+  vertical-align: top;
+}
+
+.storybook-page .tip-wrapper {
+  font-size: 13px;
+  line-height: 20px;
+  margin-top: 40px;
+  margin-bottom: 40px;
+}
+
+.storybook-page .tip-wrapper svg {
+  display: inline-block;
+  height: 12px;
+  width: 12px;
+  margin-right: 4px;
+  vertical-align: top;
+  margin-top: 3px;
+}
+
+.storybook-page .tip-wrapper svg path {
+  fill: #1ea7fd;
+}

package/.eslintrc.js

@@ -1,186 +0,0 @@
-module.exports = {
-  root: true,
-  env: {
-    browser: true,
-    node: true,
-    es6: true,
-  },
-  extends: [
-    'eslint:recommended',
-    'eslint:recommended',
-    'plugin:vue/vue3-recommended',
-    'plugin:prettier/recommended',
-  ],
-  plugins: ['vue', 'prettier'],
-  parserOptions: {
-    ecmaVersion: 2020,
-    sourceType: 'module',
-  },
-  rules: {
-    'vue/component-name-in-template-casing': [
-      'warn',
-      'PascalCase',
-      {
-        registeredComponentsOnly: false,
-        ignores: [],
-      },
-    ],
-    'vue/multi-word-component-names': [
-      'warn',
-      {
-        ignores: [],
-      },
-    ],
-    'vue/html-closing-bracket-newline': [
-      'warn',
-      {
-        singleline: 'never',
-        multiline: 'always',
-      },
-    ],
-    'vue/html-closing-bracket-spacing': [
-      'warn',
-      {
-        startTag: 'never',
-        endTag: 'never',
-        selfClosingTag: 'always',
-      },
-    ],
-    'vue/no-multi-spaces': [
-      'warn',
-      {
-        ignoreProperties: false,
-      },
-    ],
-    'vue/html-end-tags': 'warn',
-    'keyword-spacing': [
-      'warn',
-      {
-        before: true, // Require a space before keywords
-        after: true, // Require a space after keywords
-      },
-    ],
-    // Enforce one space after comma
-    'comma-spacing': [
-      'warn',
-      {
-        before: false, // No space before comma
-        after: true, // Require a space after comma
-      },
-    ],
-    'func-call-spacing': ['warn', 'never'],
-    // Enforce one space around binary operators (+, -, *, /, etc.)
-    'space-infix-ops': 'warn',
-    // Enforce no space inside parentheses
-    'space-in-parens': ['warn', 'never'],
-    // Enforce one space before block statements (if, else, for, etc.)
-    'space-before-blocks': 'warn',
-    // Enforce no spaces inside square brackets
-    'array-bracket-spacing': ['warn', 'never'],
-    // Enforce one space before function parentheses
-    'space-before-function-paren': ['warn', 'never'],
-    // Enforce one space inside braces of object literals
-    'object-curly-spacing': ['warn', 'always'],
-    // Enforce one space before and after arrow functions (optional)
-    'arrow-spacing': ['warn', { before: true, after: true }],
-    // Enforce one space after colon in object literals
-    'key-spacing': [
-      'warn',
-      {
-        beforeColon: false, // No space before colon
-        afterColon: true, // Require one space after colon
-        mode: 'strict', // Enforce spacing between key and value
-      },
-    ],
-    'vue/html-indent': 'off',
-    'vue/html-quotes': ['warn', 'double'],
-    'vue/html-self-closing': [
-      'warn',
-      {
-        html: {
-          void: 'always',
-          normal: 'never',
-          component: 'always',
-        },
-        svg: 'always',
-        math: 'always',
-      },
-    ],
-    'vue/require-default-prop': 'warn',
-    'vue/require-prop-types': 'warn',
-    'vue/v-on-event-hyphenation': [
-      'warn',
-      'always',
-      {
-        autofix: true,
-        ignore: [],
-      },
-    ],
-    'vue/prop-name-casing': ['warn', 'camelCase'],
-    'vue/order-in-components': 'warn',
-    'vue/this-in-template': ['warn', 'never'],
-    'vue/attributes-order': [
-      'warn',
-      {
-        order: [
-          'DEFINITION',
-          'LIST_RENDERING',
-          'CONDITIONALS',
-          'RENDER_MODIFIERS',
-          'GLOBAL',
-          ['UNIQUE', 'SLOT'],
-          'TWO_WAY_BINDING',
-          'OTHER_DIRECTIVES',
-          'OTHER_ATTR',
-          'EVENTS',
-          'CONTENT',
-        ],
-        alphabetical: true,
-      },
-    ],
-    'vue/no-unused-vars': 'warn',
-    'vue/no-use-v-if-with-v-for': [
-      'warn',
-      {
-        allowUsingIterationVar: false,
-      },
-    ],
-    'no-unused-vars': 'warn',
-    'no-undef': 'warn',
-    'no-console': 'warn',
-    'no-debugger': 'warn',
-    'no-multi-spaces': 'warn',
-    'no-mixed-spaces-and-tabs': 'warn',
-    'no-redeclare': 'warn',
-    'vue/no-reserved-component-names': 'warn',
-    'vue/no-deprecated-destroyed-lifecycle': 'warn',
-    'no-prototype-builtins': 'warn',
-    'no-unsafe-finally': 'warn',
-    'max-len': [
-      'warn',
-      {
-        code: 120,
-        tabWidth: 2,
-        ignoreUrls: true,
-        ignoreComments: true,
-        ignoreTrailingComments: true,
-        ignorePattern: '^import\\s.+\\sfrom\\s.+;$',
-      },
-    ],
-    'prettier/prettier': [
-      'warn',
-      {
-        semi: false,
-        singleQuote: true,
-        trailingComma: 'es5',
-        printWidth: 80,
-        tabWidth: 2,
-        useTabs: false,
-        endOfLine: 'auto',
-      },
-    ],
-  },
-  globals: {
-    _: true,
-  },
-}

package/.prettierrc

@@ -1,9 +0,0 @@
-{
-  "semi": false,
-  "singleQuote": true,
-  "printWidth": 80,
-  "tabWidth": 2,
-  "trailingComma": "es5",
-  "bracketSpacing": true,
-  "vueIndentScriptAndStyle": true
-}

package/.storybook/main.js

@@ -1,8 +0,0 @@
-module.exports = {
-  stories: ["../src/components/**/*.stories.@(js|mdx)"],
-  addons: [
-    "@storybook/addon-links",
-    "@storybook/addon-essentials",
-    "@storybook/addon-docs",
-  ],
-}

package/.storybook/preview.js

@@ -1,46 +0,0 @@
-import { ThemeProvider } from "vue3-styled-components"
-
-const theme = {
-  colors: {
-    primary: "#48a2d0",
-    secondary: "#fdb813",
-    tertiary: "#d5d5d5",
-    black: "#353535",
-    yellow: "#fdb813",
-    darkGray: "#818181",
-    gray1: "#666",
-    mediumGray: "#d5d5d5",
-    lightGray: "#f2f2f2",
-    white: "#fff",
-    blue: "#48a2d0",
-    red: "#ff7e7e",
-    blue1: "#e4efff",
-    grey1: "#666",
-    grey2: "#c4c4c4",
-    grey3: "#b2b9c5",
-    grey4: "#ebeef4",
-    grey5: "#fafafa",
-    green: "#99db0c",
-    disabled: "#dfe1e1",
-  },
-  screen: {
-    mobileSmall: "345px",
-    mobile: "425px",
-    mobileLarge: "530px",
-    tablet: "768px",
-    tabletLarge: "950px",
-  },
-  borderRadius: "4px",
-}
-
-export const decorators = [
-  (story) => ({
-    components: { story, ThemeProvider },
-    data: () => ({ theme }),
-    template: '<theme-provider :theme="theme"><story/> </theme-provider>',
-  }),
-]
-
-export const parameters = {
-  actions: { argTypesRegex: "^on[A-Z].*" },
-}

package/babel.config.js

@@ -1,7 +0,0 @@
-module.exports = {
-  presets: ['@vue/cli-plugin-babel/preset', '@babel/preset-env'],
-  plugins: [
-    '@babel/plugin-syntax-import-meta',
-    '@babel/plugin-transform-runtime',
-  ],
-}

package/jest.config.js

@@ -1,19 +0,0 @@
-module.exports = {
-  transform: {
-    '^.+\\.vue$': 'vue-jest',
-    '^.+\\.js$': 'babel-jest',
-  },
-  moduleFileExtensions: ['js', 'json', 'vue'],
-  transformIgnorePatterns: ['<rootDir>/node_modules/'],
-  testMatch: ['**/src/**/*.spec.js'],
-  collectCoverageFrom: [
-    'src/**/*.{js,vue}',
-    '!src/main.js',
-    '!src/router/index.js',
-    '!**/node_modules/**',
-  ],
-  moduleNameMapper: {
-    '^@/(.*)$': '<rootDir>/src/$1',
-    '^@/components/icon/iconCache$': '<rootDir>/tests/__mocks__/iconCache.js',
-  },
-}

package/postcss.config.js

@@ -1,6 +0,0 @@
-module.exports = {
-  plugins: {
-    // Add your PostCSS plugins here
-    // Example: require('autoprefixer')
-  }
-}

package/src/components/banner/banner/banner.stories.js

@@ -1,31 +0,0 @@
-import Modal from './index.vue'
-
-export default {
-  title: 'Modal',
-  component: Modal,
-  // argTypes: {},
-}
-
-const Template = (args, { argTypes }) => ({
-  // Components used in your story `template` are defined in the `components` object
-  components: { Modal },
-  // The story's `args` need to be mapped into the template through the `setup()` method
-  props: Object.keys(argTypes),
-  template: '<modal v-bind="$props" />',
-
-  // import Modal from "@eturnity/eturnity_reusable_components/src/components/modals/modal"
-  // This is a more flexible modal box, where the parent can decide how the body of the modal looks
-  // To use:
-  // <modal :isOpen="isOpen" @on-close="$emit('on-close-summary')" :preventOutsideClose="true" :isLoading="true" :hideClose="true">
-  //   <div>Data....</div>
-  // </modal>
-})
-
-export const Default = Template.bind({
-  isOpen: true,
-  preventOutsideClose: true,
-  isLoading: false,
-  hideClose: false,
-  backdrop: 'dark',
-})
-Default.args = {}