@policystudio/policy-studio-ui-vue 1.1.90-beta.0 → 1.1.90-beta.12

package/dist/index.js

@@ -0,0 +1,114 @@
+/**
+ * General Components
+ */
+import PsButton from './components/buttons/PsButton.vue';
+import PsCheckbox from './components/controls/PsCheckbox.vue';
+import PsRadioButton from './components/controls/PsRadioButton.vue';
+import PsSlider from './components/controls/PsSlider.vue';
+import PsSwitch from './components/controls/PsSwitch.vue';
+import PsToggle from './components/controls/PsToggle.vue';
+import PsInput from './components/forms/PsInput.vue';
+import PsDropdown from './components/forms/PsDropdown.vue';
+import PsDropdownList from './components/forms/PsDropdownList.vue';
+import PsInputTextArea from './components/forms/PsInputTextArea.vue';
+import PsInputSelect from './components/forms/PsInputSelect.vue';
+import PsDialog from './components/notifications/PsDialog.vue';
+import PsToast from './components/notifications/PsToast.vue';
+import PsTabHeader from './components/tabs/PsTabHeader.vue';
+import PsAccordion from './components/accordion/PsAccordion.vue';
+import PsAccordionItem from './components/accordion/PsAccordionItem.vue';
+import PsChips from './components/chips/PsChips.vue';
+import PsDataTable from './components/datatable/PsDataTable.vue';
+import PsDataTableItem from './components/datatable/PsDataTableItem.vue';
+import PsTableResults from './components/table-results/PsTableResults.vue';
+import PsTableResultsBody from './components/table-results/PsTableResultsBody.vue';
+import PsTableResultsHead from './components/table-results/PsTableResultsHead.vue';
+import PsTableResultsHeadComparison from './components/table-results/PsTableResultsHeadComparison.vue';
+import PsTableResultsHeadFlexible from './components/table-results/PsTableResultsHeadFlexible.vue';
+import PsIcon from './components/ui/PsIcon.vue';
+import PsDotLoader from './components/ui/PsDotLoader.vue';
+import PsTooltip from './components/tooltip/PsTooltip.vue';
+import PsRichTooltip from './components/tooltip/PsRichTooltip.vue';
+import PsDialogTooltip from './components/tooltip/PsDialogTooltip.vue';
+import PsDraggable from './components/controls/PsDraggable.vue';
+import PsCardInfos from './components/badges-and-tags/PsCardInfos.vue';
+import PsChartLegend from './components/badges-and-tags/PsChartLegend.vue';
+import PsInlineSelector from './components/controls/PsInlineSelector.vue';
+import PsScrollBar from './components/playground/PsScrollBar.vue';
+import PsMiniTag from './components/badges-and-tags/PsMiniTag.vue';
+import PsCheckboxSimple from './components/controls/PsCheckboxSimple.vue';
+import PsBadgeWithIcon from './components/badges-and-tags/PsBadgeWithIcon.vue';
+import PsProgressBar from './components/badges-and-tags/PsProgressBar.vue';
+import PsRadioButtonSimple from './components/controls/PsRadioButtonSimple.vue';
+import PsTestimonialCard from './components/badges-and-tags/PsTestimonialCard.vue';
+import PsDateCardInfo from './components/badges-and-tags/PsDateCardInfo.vue';
+import PsTagScope from './components/badges-and-tags/PsTagScope.vue';
+import PsBarChart from './components/data-graphics/PsBarChart.vue';
+import PsSimpleAlert from './components/notifications/PsSimpleAlert.vue';
+import PsBreadcrumb from './components/navigations/PsBreadcrumb.vue';
+export default {
+    install(Vue) {
+        Vue.component('PsButton', PsButton);
+        Vue.component('PsCheckbox', PsCheckbox);
+        Vue.component('PsDialog', PsDialog);
+        Vue.component('PsToast', PsToast);
+        Vue.component('PsTabHeader', PsTabHeader);
+        Vue.component('PsRadioButton', PsRadioButton);
+        Vue.component('PsSlider', PsSlider);
+        Vue.component('PsSwitch', PsSwitch);
+        Vue.component('PsInput', PsInput);
+        Vue.component('PsToggle', PsToggle);
+        Vue.component('PsAccordion', PsAccordion);
+        Vue.component('PsAccordionItem', PsAccordionItem);
+        Vue.component('PsChips', PsChips);
+        Vue.component('PsDataTable', PsDataTable);
+        Vue.component('PsDataTableItem', PsDataTableItem);
+        Vue.component('PsTableResults', PsTableResults);
+        Vue.component('PsTableResultsHead', PsTableResultsHead);
+        Vue.component('PsTableResultsHeadComparison', PsTableResultsHeadComparison);
+        Vue.component('PsTableResultsBody', PsTableResultsBody);
+        Vue.component('PsTableResultsHeadFlexible', PsTableResultsHeadFlexible);
+        Vue.component('PsIcon', PsIcon);
+        Vue.component('PsDotLoader', PsDotLoader);
+        Vue.component('PsTooltip', PsTooltip);
+        Vue.component('PsRichTooltip', PsRichTooltip);
+        Vue.component('PsDialogTooltip', PsDialogTooltip);
+        Vue.component('PsDraggable', PsDraggable);
+        Vue.component('PsCardInfos', PsCardInfos);
+        Vue.component('PsChartLegend', PsChartLegend);
+        Vue.component('PsInlineSelector', PsInlineSelector);
+        Vue.component('PsInputTextArea', PsInputTextArea);
+        Vue.component('PsInputSelect', PsInputSelect);
+        Vue.component('PsDropdown', PsDropdown);
+        Vue.component('PsDropdownList', PsDropdownList);
+        Vue.component('PsScrollBar', PsScrollBar);
+        Vue.component('PsMiniTag', PsMiniTag);
+        Vue.component('PsCheckboxSimple', PsCheckboxSimple);
+        Vue.component('PsBadgeWithIcon', PsBadgeWithIcon);
+        Vue.component('PsProgressBar', PsProgressBar);
+        Vue.component('PsRadioButtonSimple', PsRadioButtonSimple);
+        Vue.component('PsTestimonialCard', PsTestimonialCard);
+        Vue.component('PsDateCardInfo', PsDateCardInfo);
+        Vue.component('PsTagScope', PsTagScope);
+        Vue.component('PsBarChart', PsBarChart);
+        Vue.component('PsSimpleAlert', PsSimpleAlert);
+        Vue.component('PsBreadcrumb', PsBreadcrumb);
+        Vue.directive('click-outside', {
+            bind: function (el, binding, vnode) {
+                el.clickOutsideEvent = function (event) {
+                    // here I check that click was outside the el and his children
+                    if (!(el == event.target || el.contains(event.target))) {
+                        // and if it did, call method provided in attribute value
+                        vnode.context[binding.expression](event);
+                    }
+                };
+                document.body.addEventListener('click', el.clickOutsideEvent);
+            },
+            unbind: function (el) {
+                document.body.removeEventListener('click', el.clickOutsideEvent);
+            },
+        });
+    },
+};
+export { PsButton, PsCheckbox, PsRadioButton, PsSlider, PsSwitch, PsToggle, PsInput, PsDialog, PsToast, PsTabHeader, PsAccordion, PsAccordionItem, PsChips, PsDataTable, PsDataTableItem, PsTableResults, PsTableResultsHead, PsTableResultsBody, PsTableResultsHeadFlexible, PsTableResultsHeadComparison, PsIcon, PsDotLoader, PsTooltip, PsRichTooltip, PsDialogTooltip, PsDraggable, PsCardInfos, PsChartLegend, PsInlineSelector, PsInputTextArea, PsInputSelect, PsDropdown, PsDropdownList, PsScrollBar, PsMiniTag, PsCheckboxSimple, PsBadgeWithIcon, PsProgressBar, PsRadioButtonSimple, PsTestimonialCard, PsDateCardInfo, PsTagScope, PsBarChart, PsSimpleAlert, PsBreadcrumb };
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/stories/Accordion.stories.js

@@ -0,0 +1,56 @@
+import PsAccordionItem from '../components/accordion/PsAccordionItem.vue';
+import PsAccordion from '../components/accordion/PsAccordion.vue';
+export default {
+    title: 'Components/Accordion',
+    component: PsAccordion,
+    subcomponents: { PsAccordionItem },
+};
+export const Index = (args, { argTypes }) => ({
+    props: Object.keys({ argTypes, args }),
+    components: { PsAccordion, PsAccordionItem },
+    template: `
+    <div class="psui-p-8 psui-bg-gray-10 psui-grid psui-grid-cols-2 psui-gap-6">                    
+      <div>
+        <div class="psui-my-4">
+          <h1 class="psui-font-bold psui-border-b psui-border-gray-30">Accordion Big</h1>
+        </div>
+        <PsAccordion layout="big" class="psui-bg-white">
+          <PsAccordionItem title="Header 01">
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+          </PsAccordionItem>      
+          <PsAccordionItem title="Header 02">
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+          </PsAccordionItem>      
+          <PsAccordionItem title="Header 03">
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+          </PsAccordionItem>      
+        </PsAccordion>
+      </div>
+
+      <div>
+        <div class="psui-my-4">
+          <h1 class="psui-font-bold psui-border-b psui-border-gray-30">Accordion Medium</h1>
+        </div>
+        <PsAccordion layout="medium" class="psui-bg-white">
+          <PsAccordionItem title="Header 01">
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+          </PsAccordionItem>      
+          <PsAccordionItem title="Header 02" :opened="false">
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+          </PsAccordionItem>      
+          <PsAccordionItem title="Header 03">
+            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates, illum.</p>
+          </PsAccordionItem>      
+        </PsAccordion>
+      </div>
+    </div>  
+    `,
+});
+//# sourceMappingURL=Accordion.stories.js.map

package/dist/stories/Accordion.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.stories.js","sourceRoot":"","sources":["../../src/stories/Accordion.stories.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAO,6CAA6C,CAAA;AAC1E,OAAO,WAAW,MAAM,yCAAyC,CAAA;AAEjE,eAAe;IACb,KAAK,EAAE,sBAAsB;IAC7B,SAAS,EAAE,WAAW;IACtB,aAAa,EAAE,EAAE,eAAe,EAAE;CACnC,CAAA;AAGD,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,IAAQ,EAAE,EAAE,QAAQ,EAAoB,EAAE,EAAE,CAAC,CAAC;IAClE,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAC,CAAC;IACpC,UAAU,EAAE,EAAE,WAAW,EAAE,eAAe,EAAE;IAC5C,QAAQ,EACN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA2CC;CACJ,CAAC,CAAA"}

package/dist/stories/BadgeWithIcon.stories.js

@@ -0,0 +1,28 @@
+import PsBadgeWithIcon from '../components/badges-and-tags/PsBadgeWithIcon.vue';
+export default {
+    title: 'Badges & Tags/Badges/BadgeWithIcon',
+    component: PsBadgeWithIcon,
+    argTypes: {},
+};
+const TemplateDefault = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsBadgeWithIcon },
+    template: `
+        <div style="display: flex; flex-direction: column;">
+          <div style="width: fit-content; display:flex; gap:70px; margin-left: 40px;"> 
+            <span>Grey</span>
+            <span style="margin-left: 8px;">Blue</span>
+            <span style="margin-left: 5px;">Green</span>
+            <span>Yellow</span>
+          </div>
+          <div style="width: fit-content; display:flex; gap:5px;"> 
+            <PsBadgeWithIcon/>
+            <PsBadgeWithIcon layout="blue"/>
+            <PsBadgeWithIcon layout="green"/>
+            <PsBadgeWithIcon layout="yellow"/>
+          </div>
+        </div>
+    `
+});
+export const Default = TemplateDefault.bind({});
+//# sourceMappingURL=BadgeWithIcon.stories.js.map

package/dist/stories/BadgeWithIcon.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BadgeWithIcon.stories.js","sourceRoot":"","sources":["../../src/stories/BadgeWithIcon.stories.ts"],"names":[],"mappings":"AAAA,OAAQ,eAAe,MAAO,mDAAmD,CAAA;AAEjF,eAAe;IACX,KAAK,EAAE,oCAAoC;IAC3C,SAAS,EAAE,eAAe;IAC1B,QAAQ,EAAE,EACT;CACF,CAAA;AAED,MAAM,eAAe,GAAG,CAAC,IAAQ,EAAE,EAAC,QAAQ,EAAgB,EAAC,EAAE,CAAA,CAAC;IAC9D,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAC,EAAC,eAAe,EAAC;IAC5B,QAAQ,EAAE;;;;;;;;;;;;;;;KAeT;CACF,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}

package/dist/stories/BarChart.stories.js

@@ -0,0 +1,16 @@
+import PsBarChart from '../components/data-graphics/PsBarChart.vue';
+export default {
+    title: 'Data Graphics/Charts/BarChart',
+    component: PsBarChart,
+};
+const defaultTemplate = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsBarChart },
+    template: `
+    <div style='padding: 20px;'>
+      <PsBarChart v-bind="$props"/>
+    </div>
+    `
+});
+export const BarChart = defaultTemplate.bind({});
+//# sourceMappingURL=BarChart.stories.js.map

package/dist/stories/BarChart.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BarChart.stories.js","sourceRoot":"","sources":["../../src/stories/BarChart.stories.ts"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,4CAA4C,CAAA;AACnE,eAAe;IACb,KAAK,EAAE,+BAA+B;IACtC,SAAS,EAAE,UAAU;CACtB,CAAA;AAED,MAAM,eAAe,GAAG,CAAC,IAAQ,EAAE,EAAC,QAAQ,EAAgB,EAAE,EAAE,CAAC,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAE,EAAE,UAAU,EAAE;IAC1B,QAAQ,EAAE;;;;KAIP;CACJ,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}

package/dist/stories/Breadcrumb.stories.js

@@ -0,0 +1,21 @@
+import PsBreadcrumb from '../components/navigations/PsBreadcrumb.vue';
+export default {
+    title: 'Navigations/Breadcrumb',
+    component: PsBreadcrumb,
+    argTypes: {},
+};
+const items = [
+    { title: '1st level', route: '' },
+    { title: 'Big name that needs to be shortened', route: '#' },
+    { title: '3rd level', route: '' },
+    { title: '4th level', route: '' },
+];
+const Template = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsBreadcrumb },
+    template: `
+    <PsBreadcrumb v-bind="$props" />
+  `,
+});
+export const Default = Template.bind({});
+//# sourceMappingURL=Breadcrumb.stories.js.map

package/dist/stories/Breadcrumb.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumb.stories.js","sourceRoot":"","sources":["../../src/stories/Breadcrumb.stories.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,4CAA4C,CAAA;AACrE,eAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE,EAAE;CACb,CAAA;AACD,MAAM,KAAK,GAAG;IACZ,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,EAAE;IACjC,EAAE,KAAK,EAAE,qCAAqC,EAAE,KAAK,EAAE,GAAG,EAAE;IAC5D,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,EAAE;IACjC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,EAAE;CAClC,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAQ,EAAE,EAAE,QAAQ,EAAiB,EAAE,EAAE,CAAC,CAAC;IAC3D,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAE,EAAE,YAAY,EAAE;IAC5B,QAAQ,EAAE;;GAET;CACF,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}

package/dist/stories/Button.stories.js

@@ -0,0 +1,44 @@
+import MyButton from './Button.vue';
+// More on how to set up stories at: https://storybook.js.org/docs/writing-stories
+export default {
+    title: 'Example/Button',
+    component: MyButton,
+    tags: ['autodocs'],
+    argTypes: {
+        backgroundColor: {
+            control: 'color',
+        },
+        onClick: {},
+        size: {
+            control: {
+                type: 'select',
+            },
+            options: ['small', 'medium', 'large'],
+        },
+    },
+};
+// More on writing stories with args: https://storybook.js.org/docs/writing-stories/args
+export const Primary = {
+    args: {
+        primary: true,
+        label: 'Button',
+    },
+};
+export const Secondary = {
+    args: {
+        label: 'Button',
+    },
+};
+export const Large = {
+    args: {
+        size: 'large',
+        label: 'Button',
+    },
+};
+export const Small = {
+    args: {
+        size: 'small',
+        label: 'Button',
+    },
+};
+//# sourceMappingURL=Button.stories.js.map

package/dist/stories/Button.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../src/stories/Button.stories.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,cAAc,CAAA;AAEnC,kFAAkF;AAClF,eAAe;IACb,KAAK,EAAE,gBAAgB;IACvB,SAAS,EAAE,QAAQ;IACnB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACR,eAAe,EAAE;YACf,OAAO,EAAE,OAAO;SACjB;QACD,OAAO,EAAE,EAAE;QACX,IAAI,EAAE;YACJ,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,OAAO,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC;SACtC;KACF;CACF,CAAA;AAED,wFAAwF;AACxF,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,IAAI,EAAE;QACJ,OAAO,EAAE,IAAI;QACb,KAAK,EAAE,QAAQ;KAChB;CACF,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,IAAI,EAAE;QACJ,KAAK,EAAE,QAAQ;KAChB;CACF,CAAA;AAED,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,IAAI,EAAE;QACJ,IAAI,EAAE,OAAO;QACb,KAAK,EAAE,QAAQ;KAChB;CACF,CAAA;AAED,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,IAAI,EAAE;QACJ,IAAI,EAAE,OAAO;QACb,KAAK,EAAE,QAAQ;KAChB;CACF,CAAA"}

package/dist/stories/CardInfos.stories.js

@@ -0,0 +1,13 @@
+import PsCardInfos from '../components/badges-and-tags/PsCardInfos.vue';
+export default {
+    title: 'Components/CardInfos',
+    component: PsCardInfos,
+    argTypes: {},
+};
+const Template = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsCardInfos },
+    template: '<PsCardInfos v-bind="$props" />',
+});
+export const CardInfos = Template.bind({});
+//# sourceMappingURL=CardInfos.stories.js.map

package/dist/stories/CardInfos.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardInfos.stories.js","sourceRoot":"","sources":["../../src/stories/CardInfos.stories.ts"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,+CAA+C,CAAA;AAEvE,eAAe;IACb,KAAK,EAAE,sBAAsB;IAC7B,SAAS,EAAE,WAAW;IACtB,QAAQ,EAAE,EAAE;CACb,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAQ,EAAE,EAAE,QAAQ,EAAmB,EAAE,EAAE,CAAC,CAAC;IAC7D,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAE,EAAE,WAAW,EAAE;IAC3B,QAAQ,EAAE,iCAAiC;CAC5C,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}

package/dist/stories/ChartLegend.stories.js

@@ -0,0 +1,13 @@
+import PsChartLegend from '../components/badges-and-tags/PsChartLegend.vue';
+export default {
+    title: 'Badges & Tags/Badges/ChartLegend',
+    component: PsChartLegend,
+    argTypes: {},
+};
+const Template = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsChartLegend },
+    template: '<PsChartLegend v-bind="$props" />',
+});
+export const ChartLegend = Template.bind({});
+//# sourceMappingURL=ChartLegend.stories.js.map

package/dist/stories/ChartLegend.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartLegend.stories.js","sourceRoot":"","sources":["../../src/stories/ChartLegend.stories.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,iDAAiD,CAAA;AAE3E,eAAe;IACb,KAAK,EAAE,kCAAkC;IACzC,SAAS,EAAE,aAAa;IACxB,QAAQ,EAAE,EAAE;CACb,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAQ,EAAE,EAAE,QAAQ,EAAqB,EAAE,EAAE,CAAC,CAAC;IAC/D,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAE,EAAE,aAAa,EAAE;IAC7B,QAAQ,EAAE,mCAAmC;CAC9C,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}

package/dist/stories/Checkbox.stories.js

@@ -0,0 +1,44 @@
+import PsCheckbox from '../components/controls/PsCheckbox.vue';
+// const icons = ['add_circle', 'delete', 'done', 'info', 'send']
+export default {
+    title: 'Controls & Selectors/Checkbox',
+    component: PsCheckbox,
+};
+const defaultTemplate = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsCheckbox },
+    template: `
+    <div style='display:flex; gap: 20px;'>
+      <div style='display:flex; flex-direction:column; gap:5px;'>
+        <p>Resting</p>
+        <div style='display: flex; flex-direction:column; gap: 10px;'>
+          <PsCheckbox v-bind="$props" label='Label 1' />
+          <PsCheckbox v-bind="$props" label='Label 2' size='small' />
+        </div>
+      </div>
+      <div style='display:flex; flex-direction:column; gap:5px;'>
+        <p>Active</p>
+        <div style='display: flex; flex-direction:column; gap: 10px;'>
+          <PsCheckbox v-bind="$props" label='Label 3'  checked />
+          <PsCheckbox v-bind="$props" label='Label 4'  checked size='small'/>
+        </div>
+      </div>
+      <div style='display:flex; flex-direction:column; gap:5px;'>
+        <p>Mixed</p>
+        <div style='display: flex; flex-direction:column; gap: 10px;'>
+          <PsCheckbox v-bind="$props" label='Label 5' layout='mixed' checked />
+          <PsCheckbox v-bind="$props" label='Label 6' layout='mixed' size='small' checked />
+        </div>
+      </div>
+      <div style='display:flex; flex-direction:column; gap:5px;'>
+        <p>Disabled</p>
+        <div style='display: flex; flex-direction:column; gap: 10px;'>
+          <PsCheckbox v-bind="$props" label='Label 7' disabled/>
+          <PsCheckbox v-bind="$props" label='Label 8' size='small' disabled/>
+        </div>
+      </div>
+    </div>
+    `
+});
+export const Default = defaultTemplate.bind({});
+//# sourceMappingURL=Checkbox.stories.js.map

package/dist/stories/Checkbox.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.stories.js","sourceRoot":"","sources":["../../src/stories/Checkbox.stories.ts"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,uCAAuC,CAAA;AAC9D,iEAAiE;AACjE,eAAe;IACb,KAAK,EAAE,+BAA+B;IACtC,SAAS,EAAE,UAAU;CACtB,CAAA;AAED,MAAM,eAAe,GAAG,CAAC,IAAQ,EAAE,EAAC,QAAQ,EAAgB,EAAE,EAAE,CAAC,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAE,EAAE,UAAU,EAAC;IACzB,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+BP;CACJ,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}

package/dist/stories/CheckboxSimple.stories.js

@@ -0,0 +1,48 @@
+import PsCheckboxSimple from '../components/controls/PsCheckboxSimple.vue';
+// const icons = ['add_circle', 'delete', 'done', 'info', 'send']
+export default {
+    title: 'Text fields & Forms/Inputs V2/Checkbox',
+    component: PsCheckboxSimple,
+};
+const defaultTemplate = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsCheckboxSimple },
+    data: () => ({
+        checkBox1: true
+    }),
+    template: `
+    <div style='display:flex; gap: 20px;'>
+      <div style='display:flex; flex-direction:column; gap:5px;'>
+        <p>Resting</p>
+        <div style='display: flex; flex-direction:column; gap: 10px;'>
+          <PsCheckboxSimple :checked="checkBox1" @click="checkBox1 = !checkBox1" label='Label 1' />
+          <PsCheckboxSimple v-bind="$props" label='Label 2' size='small' />
+        </div>
+      </div>
+      <div style='display:flex; flex-direction:column; gap:5px;'>
+        <p>Active</p>
+        <div style='display: flex; flex-direction:column; gap: 10px;'>
+          <PsCheckboxSimple v-bind="$props" label='Label 3' checked />
+          <PsCheckboxSimple v-bind="$props" label='Label 4' checked size='small'/>
+        </div>
+      </div>
+      <div style='display:flex; flex-direction:column; gap:5px;'>
+        <p>Mixed</p>
+        <div style='display: flex; flex-direction:column; gap: 10px;'>
+          <PsCheckboxSimple v-bind="$props" label='Label 5' layout='mixed' checked />
+          <PsCheckboxSimple v-bind="$props" label='Label 6' layout='mixed' size='small' checked />
+        </div>
+      </div>
+      <div style='display:flex; flex-direction:column; gap:5px;'>
+        <p>Disabled</p>
+        <div style='display: flex; flex-direction:column; gap: 10px;'>
+          <PsCheckboxSimple v-bind="$props" label='Input via inputAttrs' :inputAttrs="{ id: 'my-input-id' }" disabled/>
+          <PsCheckboxSimple v-bind="$props" label='Input via component id' size='small' id="my-component-id" data-test="test" disabled/>
+          <PsCheckboxSimple v-bind="$props" label='Input fallback' size='small' disabled/>
+        </div>
+      </div>
+    </div>
+    `
+});
+export const Default = defaultTemplate.bind({});
+//# sourceMappingURL=CheckboxSimple.stories.js.map

package/dist/stories/CheckboxSimple.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxSimple.stories.js","sourceRoot":"","sources":["../../src/stories/CheckboxSimple.stories.ts"],"names":[],"mappings":"AAAA,OAAO,gBAAgB,MAAM,6CAA6C,CAAA;AAC1E,iEAAiE;AACjE,eAAe;IACb,KAAK,EAAE,wCAAwC;IAC/C,SAAS,EAAE,gBAAgB;CAC5B,CAAA;AAED,MAAM,eAAe,GAAG,CAAC,IAAQ,EAAE,EAAC,QAAQ,EAAgB,EAAE,EAAE,CAAC,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAE,EAAE,gBAAgB,EAAE;IAChC,IAAI,EAAE,GAAG,EAAE,CAAC,CAAC;QACX,SAAS,EAAG,IAAI;KACjB,CAAC;IACF,QAAQ,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAgCP;CACJ,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}

package/dist/stories/Chips.stories.js

@@ -0,0 +1,27 @@
+import PsChips from '../components/chips/PsChips.vue';
+import * as HeaderStories from '../stories/Header.stories';
+const meta = {
+    component: PsChips
+};
+export default meta;
+export const Primary = {
+    render: (args) => ({
+        components: { PsChips },
+        setup() {
+            return { args };
+        },
+        template: `<div style="display:flex; gap: 10px;">
+                <PsChips v-bind='$props' label="Simple chips with icons" type="button" layout="with-icon" icon="home" @update:checked='isChecked = $event' :checked='isChecked'/>
+                <PsChips v-bind='$props' label="Radio chips" type="radio" @update:checked='isChecked = $event' :checked='isChecked'/>
+                <PsChips v-bind='$props' label="Checkbox chips" type="checkbox" @update:checked='isCheckedTwo = $event' :checked='isCheckedTwo'/>
+                <PsChips v-bind='$props' label="Rich chips" type="button" layout="rich" icon="text_snippet" @update:checked='isChecked = $event' :checked='isChecked'/>
+              </div>
+              `,
+        args: {
+            label: 'Simple Chip',
+            icon: '',
+            ...HeaderStories.LoggedIn.args
+        }
+    })
+};
+//# sourceMappingURL=Chips.stories.js.map

package/dist/stories/Chips.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chips.stories.js","sourceRoot":"","sources":["../../src/stories/Chips.stories.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,iCAAiC,CAAA;AAGrD,OAAO,KAAK,aAAa,MAAM,2BAA2B,CAAA;AAE1D,MAAM,IAAI,GAAyB;IACjC,SAAS,EAAE,OAAO;CACnB,CAAA;AAED,eAAe,IAAI,CAAA;AAInB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACjB,UAAU,EAAE,EAAE,OAAO,EAAE;QACvB,KAAK;YACH,OAAO,EAAE,IAAI,EAAE,CAAA;QACjB,CAAC;QACD,QAAQ,EAAE;;;;;;eAMC;QACX,IAAI,EAAC;YACH,KAAK,EAAE,aAAa;YACpB,IAAI,EAAC,EAAE;YACP,GAAG,aAAa,CAAC,QAAQ,CAAC,IAAI;SAC/B;KACF,CAAC;CACH,CAAA"}

package/dist/stories/ClimateZoneBadge.stories.js

@@ -0,0 +1,15 @@
+import PsClimateZoneBadge from '../components/badges-and-tags/PsClimateZoneBadge.vue';
+export default {
+    title: 'Badges & Tags/Badges/ClimateZoneBadge',
+    component: PsClimateZoneBadge,
+};
+const Template = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsClimateZoneBadge },
+    template: '<PsClimateZoneBadge v-bind="$props" />',
+});
+export const ClimateZoneBadge = Template.bind({});
+ClimateZoneBadge.args = {
+    icon: 'area_chart',
+};
+//# sourceMappingURL=ClimateZoneBadge.stories.js.map

package/dist/stories/ClimateZoneBadge.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClimateZoneBadge.stories.js","sourceRoot":"","sources":["../../src/stories/ClimateZoneBadge.stories.ts"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,MAAM,sDAAsD,CAAA;AAErF,eAAe;IACb,KAAK,EAAE,uCAAuC;IAC9C,SAAS,EAAE,kBAAkB;CAC9B,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAQ,EAAE,EAAE,QAAQ,EAAmB,EAAE,EAAE,CAAC,CAAC;IAC7D,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAE,EAAE,kBAAkB,EAAE;IAClC,QAAQ,EAAE,wCAAwC;CACnD,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACjD,gBAAgB,CAAC,IAAI,GAAG;IACtB,IAAI,EAAE,YAAY;CACnB,CAAA"}

package/dist/stories/CostEffectBar.stories.js

@@ -0,0 +1,21 @@
+import PsCostEffectBar from '../components/badges-and-tags/PsCostEffectBar.vue';
+export default {
+    title: 'Badges & Tags/Badges/CostEffectBar',
+    component: PsCostEffectBar,
+    argTypes: {
+        value: {
+            control: { type: 'number', min: 0, max: 100 },
+        },
+        breakEven: {
+            control: { type: 'number', min: 0, max: 100 },
+        },
+    },
+};
+const Template = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsCostEffectBar },
+    template: '<PsCostEffectBar v-bind="$props" />',
+});
+export const SimpleProgressBar = Template.bind({});
+SimpleProgressBar.args = {};
+//# sourceMappingURL=CostEffectBar.stories.js.map

package/dist/stories/CostEffectBar.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CostEffectBar.stories.js","sourceRoot":"","sources":["../../src/stories/CostEffectBar.stories.ts"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,mDAAmD,CAAA;AAE/E,eAAe;IACb,KAAK,EAAE,oCAAoC;IAC3C,SAAS,EAAE,eAAe;IAC1B,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE;SAC9C;QACD,SAAS,EAAE;YACT,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE;SAC9C;KACF;CACF,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAQ,EAAE,EAAE,QAAQ,EAAmB,EAAE,EAAE,CAAC,CAAC;IAC7D,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAE,EAAE,eAAe,EAAE;IAC/B,QAAQ,EAAE,qCAAqC;CAChD,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAClD,iBAAiB,CAAC,IAAI,GAAG,EAAE,CAAA"}

package/dist/stories/Datatable.stories.js

@@ -0,0 +1,45 @@
+import PsDataTable, { alignment } from '../components/datatable/PsDataTable.vue';
+import PsDataTableItem from '../components/datatable/PsDataTableItem.vue';
+export default {
+    title: 'Data Tables/DataTable',
+    component: PsDataTable,
+    subcomponents: { PsDataTableItem },
+    argTypes: {
+        align: { control: { type: 'select', options: alignment } },
+    }
+};
+const Template = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsDataTable },
+    template: `
+        <div style="width:400px;">
+            <PsDataTable v-bind="$props" />
+        </div>
+        `
+});
+const RichTemplate = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsDataTable, PsDataTableItem },
+    template: `
+            <div style="width:400px">    
+                <PsDataTable v-bind="$props">
+                    <PsDataTableItem v-bind="$props"/>
+               </PsDataTable>
+            </div>   
+    `
+});
+export const Simple = Template.bind({});
+Simple.args = {
+    header: ['year', 'month', 'sale'],
+    data: [{ year: '1992', month: '12', sale: '1000.00' }, { year: '1989', month: '02', sale: '1200.00' }],
+    footer: ['Footer 1', 'Footer 2', 'Footer 3'],
+    type: 'simple',
+};
+export const Rich = RichTemplate.bind({});
+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 } }],
+    footer: ['Footer 1', 'Footer 2', 'Footer 3'],
+    type: 'rich'
+};
+//# sourceMappingURL=Datatable.stories.js.map

package/dist/stories/Datatable.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Datatable.stories.js","sourceRoot":"","sources":["../../src/stories/Datatable.stories.ts"],"names":[],"mappings":"AAAA,OAAO,WAAW,EAAE,EAAE,SAAS,EAAE,MAAM,yCAAyC,CAAA;AAChF,OAAO,eAAe,MAAM,6CAA6C,CAAA;AAEzE,eAAe;IACX,KAAK,EAAE,uBAAuB;IAC9B,SAAS,EAAE,WAAW;IACtB,aAAa,EAAE,EAAE,eAAe,EAAE;IAClC,QAAQ,EAAE;QACN,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE;KAC7D;CACJ,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAQ,EAAE,EAAE,QAAQ,EAAmB,EAAE,EAAE,CAAC,CAAC;IAC3D,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAG,EAAC,WAAW,EAAC;IAC1B,QAAQ,EAAE;;;;SAIL;CACR,CAAC,CAAA;AAEF,MAAM,YAAY,GAAG,CAAC,IAAQ,EAAE,EAAE,QAAQ,EAAmB,EAAG,EAAE,CAAC,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAE,EAAC,WAAW,EAAE,eAAe,EAAC;IAC1C,QAAQ,EAAE;;;;;;KAMT;CACJ,CAAC,CAAA;AAGF,MAAM,CAAC,MAAM,MAAM,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACvC,MAAM,CAAC,IAAI,GAAG;IACV,MAAM,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC;IACjC,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;IACtG,MAAM,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC;IAC5C,IAAI,EAAE,QAAQ;CACjB,CAAA;AAED,MAAM,CAAC,MAAM,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACzC,IAAI,CAAC,IAAI,GAAG;IACR,MAAM,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC;IAC5C,IAAI,EAAC,CAAC,CAAE,CAAE,EAAE,EAAE,CAAC,CAAC,CAAC,EAAG,CAAG,EAAE,EAAG,CAAC,CAAC,EAAE,CAAG,EAAE,EAAG,CAAC,CAAC,CAAE,EAAE,EAAE,OAAO,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAC,EAAE,OAAO,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAC,EAAE,OAAO,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAC,EAAE,CAAC;IACpJ,MAAM,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC;IAC5C,IAAI,EAAE,MAAM;CACf,CAAA"}

package/dist/stories/DateCardInfo.stories.js

@@ -0,0 +1,18 @@
+import PsDateCardInfo from '../components/badges-and-tags/PsDateCardInfo.vue';
+export default {
+    title: 'Components/DateCardInfo',
+    component: PsDateCardInfo,
+};
+const Template = (args, { argTypes }) => ({
+    props: Object.keys(argTypes),
+    components: { PsDateCardInfo },
+    template: `
+      <div style="width: 1000px; background:#DBE9F1; display:flex; gap: 7px; padding: 20px; height: 100%;">
+        <PsDateCardInfo v-bind="$props"/>
+        <PsDateCardInfo v-bind="$props"/>
+        <PsDateCardInfo v-bind="$props"/>
+      </div>
+    `
+});
+export const Default = Template.bind({});
+//# sourceMappingURL=DateCardInfo.stories.js.map

package/dist/stories/DateCardInfo.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateCardInfo.stories.js","sourceRoot":"","sources":["../../src/stories/DateCardInfo.stories.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,kDAAkD,CAAA;AAE7E,eAAe;IACX,KAAK,EAAE,yBAAyB;IAChC,SAAS,EAAE,cAAc;CAC1B,CAAA;AAED,MAAM,QAAQ,GAAG,CAAC,IAAQ,EAAE,EAAC,QAAQ,EAAgB,EAAE,EAAE,CAAC,CAAC;IACzD,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC;IAC5B,UAAU,EAAC,EAAC,cAAc,EAAC;IAC3B,QAAQ,EAAE;;;;;;KAMT;CACJ,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA"}