@policystudio/policy-studio-ui-vue 1.1.90-beta.5 → 1.1.90-beta.50

package/doc/package.json

@@ -0,0 +1,71 @@
+{
+  "name": "@policystudio/policy-studio-ui-vue",
+  "version": "1.1.90-beta.12",
+  "description": "Policy Studio UI",
+  "author": "Policy Studio Team",
+  "scripts": {
+    "serve": "concurrently --kill-others \"npm run watch-storybook\" \"npm run watch-tailwind\"",
+    "lint": "vue-cli-service lint",
+    "build-storybook": "storybook build",
+    "kill-port": "sh ../scripts/kill-port.sh",
+    "serve-prod": "concurrently --kill-others \"npm run watch-storybook\" \"npm run watch-prod-tailwind\"",
+    "storybook": "concurrently \"npm run kill-port\" \"storybook dev -p 6006\"",
+    "watch-prod-tailwind": "watch 'npm run build-tailwind' ./src/assets",
+    "watch-tailwind": "watch 'npm run build-temp-tailwind' ./src/assets"
+  },
+  "types": "shims-vue.d.ts",
+  "dependencies": {
+    "@vue/compat": "^3.4.5",
+    "core-js": "^3.6.5",
+    "tiny-emitter": "^2.1.0",
+    "v-tooltip": "^2.1.3",
+    "vue": "^3.4.5"
+  },
+  "devDependencies": {
+    "@storybook/addon-essentials": "^7.6.7",
+    "@storybook/addon-interactions": "^7.6.7",
+    "@storybook/addon-links": "^7.6.7",
+    "@storybook/blocks": "^7.6.7",
+    "@storybook/test": "^7.6.7",
+    "@storybook/vue3": "^7.6.7",
+    "@storybook/vue3-webpack5": "^7.6.7",
+    "@typescript-eslint/eslint-plugin": "^5.4.0",
+    "@typescript-eslint/parser": "^5.4.0",
+    "@vue/cli-plugin-eslint": "^5.0.8",
+    "@vue/cli-plugin-typescript": "~5.0.0",
+    "@vue/cli-service": "~5.0.8",
+    "@vue/compiler-sfc": "^3.4.5",
+    "@vue/eslint-config-prettier": "^9.0.0",
+    "@vue/eslint-config-typescript": "^9.1.0",
+    "concurrently": "^7.0.0",
+    "eslint": "^8.56.0",
+    "eslint-plugin-prettier": "^5.1.2",
+    "eslint-plugin-storybook": "^0.6.15",
+    "eslint-plugin-vue": "^8.7.1",
+    "postcss": "^8.3.11",
+    "postcss-cli": "^9.0.2",
+    "postcss-import": "^14.0.2",
+    "postcss-nested": "^5.0.6",
+    "prettier": "^3.1.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "storybook": "^7.6.7",
+    "tailwindcss": "^3.4.1",
+    "ts-loader": "^9.5.1",
+    "typescript": "~4.5.5",
+    "vue-eslint-parser": "^9.3.2",
+    "vue-loader": "^17.4.2",
+    "vue-tsc": "^1.8.27",
+    "watch": "^1.0.2",
+    "webpack": "^5.89.0"
+  },
+  "engines": {
+    "node": "20.11.0"
+  },
+  "keywords": [
+    "vue",
+    "ui"
+  ],
+  "license": "MIT",
+  "url": "https://github.com/Policy-Studio/policy-studio-ui-vue"
+}

package/{src → doc}/shims-vue.d.ts

@@ -4,8 +4,3 @@ declare module '*.vue' {
   const component: DefineComponent<{}, {}, any>
   export default component
 }
-
-declare module '*.svg' {
-  const content: string;
-  export default content;
-}

package/{src → doc/src}/stories/Accordion.stories.ts

@@ -1,5 +1,5 @@
-import PsAccordionItem  from '../components/accordion/PsAccordionItem.vue'
-import PsAccordion from '../components/accordion/PsAccordion.vue'
+import PsAccordionItem  from '../../../src/components/accordion/PsAccordionItem.vue'
+import PsAccordion from '../../../src/components/accordion/PsAccordion.vue'
 
 export default {
   title: 'Components/Accordion',
@@ -7,7 +7,6 @@ export default {
   subcomponents: { PsAccordionItem },
 }
 
-
 export const Index = (args:any, { argTypes }: { argTypes:any }) => ({
   props: Object.keys({argTypes, args}),
   components: { PsAccordion, PsAccordionItem },

package/{src → doc/src}/stories/BadgeWithIcon.stories.ts

@@ -1,4 +1,4 @@
-import  PsBadgeWithIcon  from '../components/badges-and-tags/PsBadgeWithIcon.vue'
+import  PsBadgeWithIcon  from '../../../src/components/badges-and-tags/PsBadgeWithIcon.vue'
 
 export default {
     title: 'Badges & Tags/Badges/BadgeWithIcon',

package/{src → doc/src}/stories/BarChart.stories.ts

@@ -1,4 +1,4 @@
-import PsBarChart from '../components/data-graphics/PsBarChart.vue'
+import PsBarChart from '../../../src/components/data-graphics/PsBarChart.vue'
 export default {
   title: 'Data Graphics/Charts/BarChart',
   component: PsBarChart,

package/{src → doc/src}/stories/Breadcrumb.stories.ts

@@ -1,4 +1,4 @@
-import PsBreadcrumb from '../components/navigations/PsBreadcrumb.vue'
+import PsBreadcrumb from '../../../src/components/navigations/PsBreadcrumb.vue'
 export default {
   title: 'Navigations/Breadcrumb',
   component: PsBreadcrumb,

package/doc/src/stories/Button.stories.ts

@@ -0,0 +1,130 @@
+import PsButton, { sizes } from '../../../src/components/buttons/PsButton.vue'
+const icons = ['add_circle', 'delete', 'done', 'info', 'send']
+export default {
+  title: 'Components/Button',
+  component: PsButton,
+  argTypes: {
+    size: { control: { type: 'select', options: sizes } },
+    disabled: { control: 'boolean' },
+    icon: { control: { type: 'select', options: icons } },
+    iconRight: { control: { type: 'select', options: icons } },
+  },
+}
+
+const TemplateDefault = (args, { argTypes }) => ({
+  props: Object.keys(argTypes),
+  components: { PsButton },
+  template: `
+  <div style="display:flex; flex-direction: column;">     
+    <p>Size: Big</p> 
+    <div style="display: flex; flex-direction: column; gap: 10px;">
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;">
+          <span style="text-align: center; color: black;">Solid Style</span>
+          <PsButton label='Left Icon'  layout='solid' icon='verified' iconPosition='left'/>
+          <PsButton label='Right Icon' layout='solid' icon='verified' iconPosition='right'/>
+          <PsButton label='Text Only'  layout='solid' />
+          <PsButton label='Disabled'   layout='solid' icon='verified' iconPosition='left' disabled/>          
+          <PsButton label='Loading Solid'   layout='solid' icon='verified' iconPosition='left' loading />
+      </div>
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: blue;">Outline Style</span>
+          <PsButton label='Left Icon'  layout='outline' icon='verified' iconPosition='left'/>
+          <PsButton label='Right Icon'    layout='outline' icon='verified' iconPosition='right'/>
+          <PsButton label='Text Only'  layout='outline'/>
+          <PsButton label='Disabled' layout='outline' icon='verified' iconPosition='left' disabled/>
+          <PsButton label='Loading Outline' layout='outline' icon='verified' iconPosition='left' loading />
+      </div>
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: brown;">Ghost Style</span>
+          <PsButton label='Left Icon' layout='ghost' icon='verified' iconPosition='left'/>
+          <PsButton label='Right Icon' layout='ghost' icon='verified' iconPosition='right'/>
+          <PsButton label='Text Only' layout='ghost' />
+          <PsButton label='Disabled' layout='ghost' icon='verified' iconPosition='left' disabled/>
+          <PsButton label='Loading Ghost' layout='ghost' icon='verified' iconPosition='left' loading />
+      </div>
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: green;">Only-Text Style</span>
+          <PsButton label='Left Icon' layout='onlytext' icon='verified' iconPosition='left'/>
+          <PsButton label='Right Icon' layout='onlytext' icon='verified' iconPosition='right'/>
+          <PsButton label='Text Only' layout='onlytext'/>
+          <PsButton label='Disabled' layout='onlytext' icon='verified' iconPosition='left' disabled/>
+          <PsButton label='Loading Only-Text' layout='onlytext' icon='verified' iconPosition='left' loading />
+      </div>
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: red;">Caution Button</span>
+          <PsButton label='Left Icon' layout='caution' icon='verified' iconPosition='left'/>
+          <PsButton label='Right Icon' layout='caution' icon='verified' iconPosition='right'/>
+          <PsButton label='Text Only' layout='caution' />
+          <PsButton label='Disabled' layout='caution' icon='verified' iconPosition='left' disabled/>
+          <PsButton label='Loading Caution' layout='caution' icon='verified' iconPosition='left' loading />
+    </div>
+
+
+    </div>
+    <p>Size: Medium</p>
+    <div style="display: flex; flex-direction: column; gap: 10px;">
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: black;">Solid Style</span>
+          <PsButton label='Left Icon' layout='solid' icon='verified' iconPosition='left' size='medium'/>
+          <PsButton label='Right Icon' layout='solid' icon='verified' iconPosition='right' size='medium'/>
+          <PsButton label='Text Only' layout='solid'  size='medium'/>
+          <PsButton label='Disabled' layout='solid' icon='verified' iconPosition='left' disabled size='medium'/>
+      </div>
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: blue;">Outline Style</span>
+          <PsButton label='Left Icon' layout='outline' icon='verified' iconPosition='left' size='medium'/>
+          <PsButton label='Right Icon' layout='outline' icon='verified' iconPosition='right' size='medium'/>
+          <PsButton label='Text Only' layout='outline' size='medium'/>
+          <PsButton label='Disabled' layout='outline' icon='verified' iconPosition='left' disabled size='medium'/>
+      </div>
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: brown;">Ghost Style</span>
+          <PsButton label='Left Icon' layout='ghost' icon='verified' iconPosition='left' size='medium'/>
+          <PsButton label='Right Icon' layout='ghost' icon='verified' iconPosition='right' size='medium'/>
+          <PsButton label='Text Only' layout='ghost' size='medium'/>
+          <PsButton label='Disabled' layout='ghost' icon='verified' iconPosition='left' disabled size='medium'/>
+      </div>
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: green;">Only-Text Style</span>
+          <PsButton label='Left Icon' layout='onlytext' icon='verified' iconPosition='left' size='medium'/>
+          <PsButton label='Right Icon' layout='onlytext' icon='verified' iconPosition='right' size='medium'/>
+          <PsButton label='Text Only' layout='onlytext' size='medium'/>
+          <PsButton label='Disabled' layout='onlytext' disabled icon='verified' iconPosition='left' size='medium'/>
+      </div>
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: red;">Caution Button</span>
+          <PsButton label='Left Icon' layout='caution' icon='verified' iconPosition='left' size='medium'/>
+          <PsButton label='Right Icon' layout='caution' icon='verified' iconPosition='right' size='medium'/>
+          <PsButton label='Text Only' layout='caution' size='medium'/>
+          <PsButton label='Disabled' layout='caution' icon='verified' iconPosition='left' disabled size='medium'/>
+      </div>      
+    </div>
+    <p>Size: Small</p>
+    <div style="display: flex; flex-direction: column; gap: 10px;">
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: black;">Solid Style</span>
+          <PsButton label='Left Icon' layout='solid' icon='verified' iconPosition='left' size='small'/>
+          <PsButton label='Right Icon' layout='solid' icon='verified' iconPosition='right' size='small'/>
+          <PsButton label='Text Only' layout='solid' size='small'/>
+          <PsButton label='Disabled' layout='solid' icon='verified' iconPosition='left' disabled size='small'/>
+      </div>
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: green;">Only-Text Style</span>
+          <PsButton label='Left Icon' layout='onlytext' icon='verified' iconPosition='left' size='small'/>
+          <PsButton label='Right Icon' layout='onlytext' icon='verified' iconPosition='right' size='small'/>
+          <PsButton label='Text Only' layout='onlytext' size='small'/>
+          <PsButton label='Disabled' layout='onlytext' disabled icon='verified' iconPosition='left' size='small'/>
+      </div>
+      <div style="display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.5rem; justify-items: center; align-items: center;" >
+          <span style="text-align: center; color: red;">Caution Button</span>
+          <PsButton label='Left Icon' layout='caution' icon='verified' iconPosition='left' size='small'/>
+          <PsButton label='Right Icon' layout='caution' icon='verified' iconPosition='right' size='small'/>
+          <PsButton label='Text Only' layout='caution' size='small'/>
+          <PsButton label='Disabled' layout='caution' disabled icon='verified' iconPosition='left' size='small'/>
+      </div>
+    </div>
+    </div>
+  `,
+})
+
+export const Default = TemplateDefault.bind({})

package/{src → doc/src}/stories/CardInfos.stories.ts

@@ -1,4 +1,4 @@
-import PsCardInfos from '../components/badges-and-tags/PsCardInfos.vue'
+import PsCardInfos from '../../../src/components/badges-and-tags/PsCardInfos.vue'
 
 export default {
   title: 'Components/CardInfos',

package/{src → doc/src}/stories/ChartLegend.stories.ts

@@ -1,4 +1,4 @@
-import PsChartLegend from '../components/badges-and-tags/PsChartLegend.vue'
+import PsChartLegend from '../../../src/components/badges-and-tags/PsChartLegend.vue'
 
 export default {
   title: 'Badges & Tags/Badges/ChartLegend',

package/{src → doc/src}/stories/Checkbox.stories.ts

@@ -1,4 +1,4 @@
-import PsCheckbox from '../components/controls/PsCheckbox.vue'
+import PsCheckbox from '../../../src/components/controls/PsCheckbox.vue'
 // const icons = ['add_circle', 'delete', 'done', 'info', 'send']
 export default {
   title: 'Controls & Selectors/Checkbox',

package/{src → doc/src}/stories/CheckboxSimple.stories.ts

@@ -1,4 +1,4 @@
-import PsCheckboxSimple from '../components/controls/PsCheckboxSimple.vue'
+import PsCheckboxSimple from '../../../src/components/controls/PsCheckboxSimple.vue'
 // const icons = ['add_circle', 'delete', 'done', 'info', 'send']
 export default {
   title: 'Text fields & Forms/Inputs V2/Checkbox',

package/{src → doc/src}/stories/Chips.stories.ts

@@ -1,8 +1,6 @@
-import PsChips from '../components/chips/PsChips.vue'
+import PsChips from '../../../src/components/chips/PsChips.vue'
 import type { Meta, StoryObj } from '@storybook/vue3'
 
-import * as HeaderStories from '../stories/Header.stories'
-
 const meta: Meta<typeof PsChips> = {
   component: PsChips
 }
@@ -27,7 +25,6 @@ export const Primary: Story = {
     args:{
       label: 'Simple Chip',
       icon:'',
-      ...HeaderStories.LoggedIn.args
     }
   })
 }

package/{src → doc/src}/stories/ClimateZoneBadge.stories.ts

@@ -1,4 +1,4 @@
-import PsClimateZoneBadge from '../components/badges-and-tags/PsClimateZoneBadge.vue'
+import PsClimateZoneBadge from '../../../src/components/badges-and-tags/PsClimateZoneBadge.vue'
 
 export default {
   title: 'Badges & Tags/Badges/ClimateZoneBadge',
@@ -12,6 +12,7 @@ const Template = (args:any, { argTypes }:{ argTypes:any }) => ({
 })
 
 export const ClimateZoneBadge = Template.bind({})
+// @ts-ignore
 ClimateZoneBadge.args = {
   icon: 'area_chart',
 }

package/doc/src/stories/Collapse.stories.ts

@@ -0,0 +1,46 @@
+import PsCollapse from '../../../src/components/collapse/PsCollapse.vue'
+import type { Meta, StoryObj } from '@storybook/vue3'
+
+const meta: Meta<typeof PsCollapse> = {
+  title: 'Collapse/Collapse/Default',
+  component: PsCollapse
+}
+
+export default meta
+
+type Story = StoryObj<typeof PsCollapse>
+
+export const Primary: Story = {
+  render: (args) => ({
+    components: { PsCollapse },
+    setup(){
+      return { ...args }
+    },
+    template: `<div style="width: 150px;">
+                <PsCollapse :title="title">
+                <template #header-action>
+                  <span>a</span>
+                </template>
+                  <template #content>
+                    <PsCollapse  :title="title_second" :disabled="true">
+                      <template #header-action>
+                        <div>a</div>
+                      </template>
+                      <template #content>
+                        <div style="display: flex; flex-direction: column; padding: 0px 8px;">
+                          <span>Active</span>
+                          <span>Resting</span>
+                          <span>Disabled</span>
+                        </div>
+                      </template>
+                    </PsCollapse>
+                  </template>
+                </PsCollapse>
+              </div>
+              `,
+            }),
+            args:{
+              title: 'First Level',
+              title_second: '2nd Level Dis'
+            }
+}

package/{src → doc/src}/stories/CostEffectBar.stories.ts

@@ -1,4 +1,4 @@
-import PsCostEffectBar from '../components/badges-and-tags/PsCostEffectBar.vue'
+import PsCostEffectBar from '../../../src/components/badges-and-tags/PsCostEffectBar.vue'
 
 export default {
   title: 'Badges & Tags/Badges/CostEffectBar',
@@ -20,4 +20,5 @@ const Template = (args:any, { argTypes }:{ argTypes:any }) => ({
 })
 
 export const SimpleProgressBar = Template.bind({})
+// @ts-ignore
 SimpleProgressBar.args = {}

package/{src → doc/src}/stories/Datatable.stories.ts

@@ -1,5 +1,6 @@
-import PsDataTable, { alignment } from '../components/datatable/PsDataTable.vue'
-import PsDataTableItem from '../components/datatable/PsDataTableItem.vue'
+// @ts-ignore
+import PsDataTable, { alignment } from '../../../src/components/datatable/PsDataTable.vue'
+import PsDataTableItem from '../../../src/components/datatable/PsDataTableItem.vue'
 
 export default {
     title: 'Data Tables/DataTable',
@@ -34,6 +35,7 @@ const RichTemplate = (args:any, { argTypes }:{ argTypes:any } ) => ({
 
 
 export const Simple = Template.bind({})
+// @ts-ignore
 Simple.args = {
     header: ['year', 'month', 'sale'],
     data: [{ year: '1992', month: '12', sale: '1000.00' }, { year: '1989', month: '02', sale: '1200.00' }],
@@ -42,6 +44,7 @@ Simple.args = {
 }
 
 export const Rich = RichTemplate.bind({})
+// @ts-ignore
 Rich.args = {
     header: ['header 1', 'header 2', 'header 3'],
     data:[[ [ 20, -3],  [  20,  2], [  20,  2] ], { header4: { value: 20, delta: 2}, header5: { value: 20, delta: 2}, header6: { value: 20, delta: 2} }],

package/{src → doc/src}/stories/DateCardInfo.stories.ts

@@ -1,4 +1,4 @@
-import PsDateCardInfo from '../components/badges-and-tags/PsDateCardInfo.vue'
+import PsDateCardInfo from '../../../src/components/badges-and-tags/PsDateCardInfo.vue'
 
 export default {
     title: 'Components/DateCardInfo',

package/{src → doc/src}/stories/Dialog.stories.ts

@@ -1,10 +1,10 @@
-import PsDialog from '../components/notifications/PsDialog.vue'
+import PsDialog from '../../../src/components/notifications/PsDialog.vue'
 
 export default {
   title: 'Notifications/Dialog',
   component: PsDialog,
 }
-
+// @ts-ignore
 const TemplateExamples = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { PsDialog },

package/{src → doc/src}/stories/Draggable.stories.ts

@@ -1,10 +1,10 @@
-import PsDraggable from '../components/controls/PsDraggable.vue'
+import PsDraggable from '../../../src/components/controls/PsDraggable.vue'
 
 export default {
   title: 'Controls & Selectors/Draggable',
   component: PsDraggable 
 }
-
+// @ts-ignore
 const Template = (args, {argTypes}) => ({
   props: Object.keys(argTypes),
   components: { PsDraggable },
@@ -16,6 +16,7 @@ const Template = (args, {argTypes}) => ({
 })
 
 export const Component = Template.bind({})
+// @ts-ignore
 Component.args = {
   getColumns: {columnGroups:[{title: 'COST EFFECTIVENESS', columns: [ 'Item 1' , 'Item 2' , 'Item 3', 'Item 4']}, {title: 'PER HOME RESULTS', columns: [ 'Item 1' , 'Item 2' , 'Item 3', 'Item 4']}]},
   module: 'comparison'

package/{src → doc/src}/stories/Dropdown.stories.ts

@@ -1,10 +1,10 @@
-import PsDropdown from '../components/forms/PsDropdown.vue'
-import PsDropdownList from '../components/forms/PsDropdownList.vue'
+import PsDropdown from '../../../src/components/forms/PsDropdown.vue'
+import PsDropdownList from '../../../src/components/forms/PsDropdownList.vue'
 export default {
   title: 'Components/Dropdown',
   component: { PsDropdown, PsDropdownList },
 }
-
+// @ts-ignore
 const Template = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { PsDropdown, PsDropdownList },
@@ -87,6 +87,7 @@ const Template = (args, { argTypes }) => ({
 })
 
 export const DropdownMenu = Template.bind({})
+// @ts-ignore
 DropdownMenu.args = {
   items: [
     'Selectable option 01',

package/{src → doc/src}/stories/DropdownList.stories.ts

@@ -1,4 +1,5 @@
-import PsDropdownList, { itemStyle } from '../components/forms/PsDropdownList.vue'
+// @ts-ignore
+import PsDropdownList, { itemStyle } from '../../../src/components/forms/PsDropdownList.vue'
 export default {
   title: 'Components/Dropdown/Dropdown List',
   component: { PsDropdownList },
@@ -17,7 +18,7 @@ export default {
     }
   }
 }
-
+// @ts-ignore
 const Template = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { PsDropdownList },
@@ -205,6 +206,7 @@ const studyData = {
 }
 
 export const DropdownList = Template.bind({})
+// @ts-ignore
 DropdownList.args = {
   items: onlyTextItems,
   study_data: studyData,

package/{src → doc/src}/stories/HighlightRippleDot.stories.ts

@@ -1,10 +1,10 @@
-import PsHighlightRippleDot from '../components/badges-and-tags/PsHighlightRippleDot.vue'
+import PsHighlightRippleDot from '../../../src/components/badges-and-tags/PsHighlightRippleDot.vue'
 
 export default {
   title: 'Badges & Tags/Badges/HighlightRippleDot',
   component: PsHighlightRippleDot,
 }
-
+// @ts-ignore
 const Template = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { PsHighlightRippleDot },
@@ -12,4 +12,5 @@ const Template = (args, { argTypes }) => ({
 })
 
 export const HighlightRippleDot = Template.bind({})
+// @ts-ignore
 HighlightRippleDot.args = {}

package/{src → doc/src}/stories/Icon.stories.ts

@@ -1,4 +1,4 @@
-import PsIcon from '../components/ui/PsIcon.vue'
+import PsIcon from '../../../src/components/ui/PsIcon.vue'
 
 export default {
     title: 'Components/Icon',
@@ -6,6 +6,7 @@ export default {
     argTypes: {},
   }
   
+  // @ts-ignore
   const Template = (args, { argTypes }) => ({
     props: Object.keys(argTypes),
     components: { PsIcon },
@@ -18,4 +19,5 @@ export default {
   })
   
   export const IconSimple = Template.bind({})
+  // @ts-ignore
   IconSimple.args = {}

package/{src → doc/src}/stories/InlineSelector.stories.ts

@@ -1,4 +1,4 @@
-import PsInlineSelector from '../components/controls/PsInlineSelector.vue'
+import PsInlineSelector from '../../../src/components/controls/PsInlineSelector.vue'
 
 export default {
   title: 'Controls & Selectors/InlineSelector',

package/{src → doc/src}/stories/Input.stories.ts

@@ -1,4 +1,4 @@
-import PsInput from '../components/forms/PsInput.vue'
+import PsInput from '../../../src/components/forms/PsInput.vue'
 export default {
   title: 'Text fields & Forms/Input',
   component: PsInput,
@@ -7,7 +7,7 @@ export default {
     required: { control: 'boolean' },
   },
 }
- 
+ // @ts-ignore
 const TemplateInputText = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { PsInput },
@@ -79,7 +79,7 @@ const TemplateInputText = (args, { argTypes }) => ({
     </div>
   `
 })
- 
+ // @ts-ignore
 const TemplateInputPassword = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { PsInput },
@@ -183,7 +183,7 @@ const TemplateInputPassword = (args, { argTypes }) => ({
     </div>
   `
 })
- 
+ // @ts-ignore
 const TemplateSlots = (args, { argTypes }) => ({
   props: Object.keys(argTypes),
   components: { PsInput },
@@ -212,6 +212,7 @@ const TemplateSlots = (args, { argTypes }) => ({
 })
  
 export const InputText = TemplateInputText.bind({})
+// @ts-ignore
 InputText.args = {
   label: 'Input Text',
   placeholder: 'Placeholder',
@@ -222,6 +223,7 @@ InputText.args = {
 }
  
 export const InputPassword = TemplateInputPassword.bind({})
+// @ts-ignore
 InputPassword.args = {
   type: 'password',
   label: 'Password',
@@ -231,6 +233,7 @@ InputPassword.args = {
 }
  
 export const InputSlots = TemplateSlots.bind({})
+// @ts-ignore
 InputSlots.args = {
   label: 'Label',
   placeholder: 'Placeholder',

package/{src → doc/src}/stories/InputSelect.stories.ts

@@ -1,10 +1,10 @@
-import PsInputSelect from '../components/forms/PsInputSelect.vue'
+import PsInputSelect from '../../../src/components/forms/PsInputSelect.vue'
 
 export default {
   title: 'Text fields & Forms/InputSelect',
   component: PsInputSelect
 }
-
+// @ts-ignore
 const TemplateDefault = (args, {argTypes})=> ({
     props: Object.keys(argTypes),
     components: {PsInputSelect},
@@ -25,6 +25,7 @@ const TemplateDefault = (args, {argTypes})=> ({
 })
 
 export const Default = TemplateDefault.bind({})
+// @ts-ignore
 Default.args = {
     items: [{title:'Text 1', value:'Value 1'}, {title:'Text 2', value:'Value 2'}]
 }

package/{src → doc/src}/stories/InputTextArea.stories.ts

@@ -1,4 +1,4 @@
-import PsInputTextArea from '../components/forms/PsInputTextArea.vue'
+import PsInputTextArea from '../../../src/components/forms/PsInputTextArea.vue'
 
 export default {
   title: 'Text fields & Forms/Input Textarea',