@icij/murmur-next 4.0.0 → 4.0.1

package/stories/murmur/components/AccordionWrapper.stories.ts

@@ -1,69 +0,0 @@
-import { AccordionWrapper } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-import {BButton} from "bootstrap-vue-next";
-import {bgStripedDecorator} from "../decorators";
-
-export default {
-    title: 'Murmur/components/AccordionWrapper',
-    component: AccordionWrapper,
-    tags: ['autodocs'],
-    argTypes: {
-    }
-};
-
-type Story = StoryObj<typeof AccordionWrapper>;
-const stepsEnum = Object.freeze({
-    MAILVELOPE: Symbol("MAILVELOPE"),
-    EXPORT_PUBLIC_KEY: Symbol("EXPORT_PUBLIC_KEY"),
-    UPLOAD_PUBLIC_KEY: Symbol("UPLOAD_PGP"),
-})
-const data = {
-    step: stepsEnum.MAILVELOPE,
-    steps: Object.values(stepsEnum),
-    active: false,
-
-}
-const Template: Story = (args: any) => ({
-    components: { AccordionWrapper,BButton },
-    setup() {
-        return { stepsEnum,args };
-    },
-    template: `<AccordionWrapper v-bind="args" @step-change="args.step=$event">
-        <accordion-step
-          :step="stepsEnum.MAILVELOPE"
-          class="accordion-step__mailvelope"
-          title="Install Mailvelope"
-          content="Install Mailvelope and create your key"
-        />
-        <accordion-step
-          :step="stepsEnum.EXPORT_PUBLIC_KEY"
-          title="Export your public key"
-        >
-            <template #content>
-                <p>
-                    Export your public PGP key as a .asc file and download on your
-                    computer
-                </p>
-            </template>
-        </accordion-step>
-        <accordion-step
-          :step="stepsEnum.UPLOAD_PUBLIC_KEY"
-        >
-            <template #title>
-                Upload your publickey
-            </template>
-            <template #nextStepButton>
-                <b-button variant="info">The end!</b-button>
-            </template>
-        </accordion-step>
-    </AccordionWrapper>`,
-});
-
-
-export const Default = Template.bind({});
-Default.decorators=[bgStripedDecorator]
-Default.args = {
-    steps:data.steps,
-    step:data.step,
-    class:"p-2"
-};

package/stories/murmur/components/ActiveTextTruncate.stories.ts

@@ -1,32 +0,0 @@
-import { ActiveTextTruncate } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-import {bgStripedDecorator} from "../decorators";
-
-
-type Story = StoryObj<typeof ActiveTextTruncate>;
-const Template: Story = (args: any, {argTypes}: any) => ({
-    components: { ActiveTextTruncate },
-    props: Object.keys(argTypes),
-
-    setup() { return { args }; },
-    template: '<active-text-truncate v-bind="args">https://www.icij.org/investigations/luanda-leaks/banking-documents-reveal-consulting-giants-cash-windfall-under-angolan-billionaire-isabel-dos-santos/</active-text-truncate>',
-});
-
-export const Default = Template.bind({});
-Default.args = {direction:'ltr'};
-export const RightToLeft = Template.bind({});
-RightToLeft.args = {direction:'rtl'};
-
-
-export default {
-    title: 'Murmur/components/ActiveTextTruncate',
-    component: ActiveTextTruncate,
-    decorators: [bgStripedDecorator],
-    tags: ['autodocs'],
-    argTypes: {
-        direction: { control: 'inline-radio', options: ['ltr', 'rtl']},
-        ppms: { control: { type:'number', min:0}},
-        fadingMinWidth: { control: { type:'number', min:0}},
-        fadingMaxWidth: { control:{ type:'number', min:0}},
-    }
-};

package/stories/murmur/components/AdvancedLinkForm.stories.ts

@@ -1,77 +0,0 @@
-import {AdvancedLinkForm} from "@/components";
-import {BCard, BModal} from "bootstrap-vue-next";
-import {StoryObj} from "@storybook/vue3";
-import {Size} from "@/enums";
-import {modalDecorator, popoverDecorator} from "../decorators";
-
-export default {
-    components: {AdvancedLinkForm},
-    title: 'Murmur/components/AdvancedLinkForm',
-    component: AdvancedLinkForm,
-    tags: ['autodocs'],
-    argTypes: {
-    }
-};
-
-type Story = StoryObj<typeof AdvancedLinkForm>;
-const Template: Story = (args: any) => ({
-    components: { AdvancedLinkForm },
-    setup() {
-        return {args};
-    },
-    template: '<AdvancedLinkForm v-bind="args" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-    title:"Medtronic spends millions each year on lobbying in the US",
-    link:"https://projects.icij.org/the-implant-files/graphics/#/medtronic-lobbying",
-    card:true
-};
-
-export const InsideModal = Template.bind({});
-InsideModal.decorators= [modalDecorator.bind(this,"Click to see the form","Advanced Link",Size.md)]
-InsideModal.args = {
-    title:"Medtronic spends millions each year on lobbying in the US",
-    link:"https://projects.icij.org/the-implant-files/graphics/#/medtronic-lobbying",
-    card:true
-};
-
-
-
-export const InsidePopover = Template.bind({});
-InsidePopover.decorators= [popoverDecorator]
-InsidePopover.args = {
-    title:"Medtronic spends millions each year on lobbying in the US",
-    link:"https://projects.icij.org/the-implant-files/graphics/#/medtronic-lobbying",
-    card:true,
-    small:true,
-    noFade:true,
-    forms:['raw', 'markdown']
-};
-
-const tabPillsDecorator = () => ({
-    components: { BCard },
-    template:`<div class="text-center p-4">
-        <b-card no-body>
-            <story/>
-        </b-card>
-    </div>`
-})
-export const WithTabPills = Template.bind({});
-WithTabPills.decorators= [tabPillsDecorator]
-WithTabPills.args = {
-    title:"Medtronic spends millions each year on lobbying in the US",
-    link:"https://projects.icij.org/the-implant-files/graphics/#/medtronic-lobbying",
-    card:true,
-    pills:true,
-};
-export const WithTabPillsActiveClass = Template.bind({});
-WithTabPillsActiveClass.decorators= [tabPillsDecorator]
-WithTabPillsActiveClass.args = {
-    title:"Medtronic spends millions each year on lobbying in the US",
-    link:"https://projects.icij.org/the-implant-files/graphics/#/medtronic-lobbying",
-    card:true,
-    pills:true,
-    activeNavItemClass:"bg-primary fw-bold"
-};

package/stories/murmur/components/Brand.stories.ts

@@ -1,30 +0,0 @@
-import { Brand } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-
-export default {
-    title: 'Murmur/components/Brand',
-    component: Brand,
-    tags: ['autodocs'],
-    argTypes : {
-        color: { control: {type: 'color' }},
-        background: { control: {type: 'color' }},
-        size: {control: {type: 'number' }}
-}
-};
-
-type Story = StoryObj<typeof Brand>;
-const Template: Story = (args: any, argTypes:any) => ({
-    components: { Brand },
-    props:Object.keys(argTypes),
-    setup() {
-        return { args };
-    },
-    template: '<Brand v-bind="args" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {};
-export const Animated = Template.bind({});
-Animated.args = {animated:true,background: '#cacaca'};
-export const Square = Template.bind({});
-Square.args = {square:true, background: '#cacaca'};

package/stories/murmur/components/BrandExpansion.stories.ts

@@ -1,41 +0,0 @@
-import { BrandExpansion } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-
-export default {
-    title: 'Murmur/components/BrandExpansion',
-    component: BrandExpansion,
-    tags: ['autodocs'],
-    argTypes: {
-        mode: { control: 'select', options: ['short', 'medium','long']},
-        animated: { control: 'boolean'},
-        dark: { control: 'boolean'},
-        color: { control: {type: 'color' }},
-        background: { control: {type: 'color' }},
-
-    }
-};
-
-type Story = StoryObj<typeof BrandExpansion>;
-const Template: Story = (args: any) => ({
-    components: { BrandExpansion },
-    setup() {
-        return { args };
-    },
-    template: '<BrandExpansion v-bind="args" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {mode:"short"};
-export const Medium = Template.bind({});
-Medium.args = {mode:"medium"};
-
-export const Long = Template.bind({});
-Long.args = {mode:"long"};
-export const Animated = Template.bind({});
-Animated.args = {animated:true};
-export const WhiteBackground = Template.bind({});
-WhiteBackground.args = {background:"#FFF", color:"#000"};
-export const BlackBackground = Template.bind({});
-BlackBackground.args = {background:"#000", color:"#FFF"};
-export const Dark = Template.bind({});
-Dark.args = {background:"#DDD", dark:true};

package/stories/murmur/components/ConfirmButton.stories.ts

@@ -1,40 +0,0 @@
-import { ConfirmButton } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-
-export default {
-    title: 'Murmur/components/ConfirmButton',
-    component: ConfirmButton,
-    tags: ['autodocs'],
-    argTypes: {}
-};
-
-type Story = StoryObj<typeof ConfirmButton>;
-const Template: Story = (args: any) => ({
-    components: { ConfirmButton },
-    setup() {
-        return { args };
-    },
-    template: `<ConfirmButton v-bind="args" >Click to confirm</ConfirmButton>`,
-});
-
-function confirmedFn(){
-    alert('Confirmed !')
-}
-export const Default = Template.bind({});
-Default.args = {
-    class:"btn btn-info",
-    confirmed:confirmedFn,
-    noCloseButton:true
-};
-export const WithDescription = Template.bind({});
-WithDescription.args = {
-    class:"btn btn-info" ,
-    description:"Do, or do not. There is no try."
-};
-export const WithLabel = Template.bind({});
-WithLabel.args = {
-    class:"btn btn-info" ,
-    label:"Will you bilge Matey?",
-    yes:"Aye",
-    no:"Abandon ship!"
-};

package/stories/murmur/components/ContentPlaceholder.stories.ts

@@ -1,41 +0,0 @@
-import { ContentPlaceholder } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-import {ContentPlaceholderRows} from "@/utils/placeholderTypes";
-
-export default {
-    title: 'Murmur/components/ContentPlaceholder',
-    component: ContentPlaceholder,
-    tags: ['autodocs'],
-    argTypes: {
-    }
-};
-
-type Story = StoryObj<typeof ContentPlaceholder>;
-const Template: Story = (args: any) => ({
-    components: { ContentPlaceholder },
-    setup() {
-        return { args };
-    },
-    template: '<ContentPlaceholder v-bind="args" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {};
-
-export const Columns = Template.bind({});
-const rows : ContentPlaceholderRows = [{height:"1em",boxes:[[0,"40%"],["5%","30%"],["5%","10%"]]}]
-Columns.args = {rows};
-export const FourRows = Template.bind({});
-const fourRowsDecorator = () => ({
-    components: { ContentPlaceholder },
-    template:`
-        <div class="card card-xs py-2 px-3 mx-auto m-4">
-            <story/>
-            <story/>
-            <story/>
-            <story/>
-        </div>
-    `
-})
-FourRows.decorators = [fourRowsDecorator]
-FourRows.args={class:"my-1"}

package/stories/murmur/components/CustomPagination.stories.ts

@@ -1,42 +0,0 @@
-import { CustomPagination } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-import {Size} from "../../../lib/enums";
-
-export default {
-    title: 'Murmur/components/CustomPagination',
-    component: CustomPagination,
-    tags: ['autodocs'],
-    argTypes: {
-        modelValue:{ type:"number", min:0 },
-        perPage:{ type:"number", min:0 },
-        totalRows:{ type:"number", min:0 },
-        pages:{ type:"number", min:0 },
-        size:{ type:"select", options:["sm","md","lg"] }
-    }
-};
-
-type Story = StoryObj<typeof CustomPagination>;
-const Template: Story = (args: any) => ({
-    components: { CustomPagination },
-    setup() {
-        return { args };
-    },
-    template: '<CustomPagination v-bind="args" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {modelValue:1, perPage:10,totalRows:200};
-export const Small = Template.bind({});
-Small.args = {modelValue:1, perPage:10,totalRows:200, size:Size.sm};
-export const Medium = Template.bind({});
-Medium.args = {modelValue:1, perPage:10,totalRows:200, size:Size.md};
-export const Large = Template.bind({});
-Large.args = {modelValue:1, perPage:10,totalRows:200, size:Size.lg};
-export const Compact = Template.bind({});
-Compact.args = {modelValue:1, perPage:10,totalRows:200, compact:true}
-export const Pills = Template.bind({});
-Pills.args = {modelValue:1, perPage:10,totalRows:200, pills:true}
-export const PillsSmall = Template.bind({});
-PillsSmall.args = {modelValue:1, perPage:10,totalRows:200, pills:true, size:Size.sm}
-export const PillsCompact = Template.bind({});
-PillsCompact.args = {modelValue:1, perPage:10,totalRows:200, pills:true, compact:true}

package/stories/murmur/components/DigitsInput.stories.ts

@@ -1,29 +0,0 @@
-import { DigitsInput } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-
-export default {
-    title: 'Murmur/components/DigitsInput',
-    component: DigitsInput,
-    tags: ['autodocs'],
-    argTypes: {
-        length:{type:'number',min:0}
-    }
-};
-
-type Story = StoryObj<typeof DigitsInput>;
-const Template: Story = (args: any) => ({
-    components: { DigitsInput },
-    setup() {
-        return { args };
-    },
-    template: '<DigitsInput v-bind="args" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {};
-export const FourDigits = Template.bind({});
-FourDigits.args = {
-    length:4,
-    modelValue:2017
-};
-

package/stories/murmur/components/DonateForm.stories.ts

@@ -1,29 +0,0 @@
-import {DonateForm} from "@/components";
-import {StoryObj} from "@storybook/vue3";
-import {Size} from "@/enums";
-import {modalDecorator} from "../decorators";
-
-export default {
-  title: 'Murmur/components/DonateForm',
-  component: DonateForm,
-  tags: ['autodocs'],
-  argTypes: {}
-};
-
-type Story = StoryObj<typeof DonateForm>;
-const Template: Story = (args: any) => ({
-  components: {DonateForm},
-  setup() {
-    return {args};
-  },
-  template: '<DonateForm v-bind="args" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {};
-
-export const InModal = Template.bind({})
-InModal.decorators = [modalDecorator.bind(this,"Click to see the form","Support ICIJ",Size.lg)]
-InModal.args = {
-  noTitle:true
-}

package/stories/murmur/components/EmbedForm.stories.ts

@@ -1,35 +0,0 @@
-import { EmbedForm } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-import {modalDecorator} from "../decorators";
-import { Size } from "@/enums";
-
-export default {
-    title: 'Murmur/components/EmbedForm',
-    component: EmbedForm,
-    tags: ['autodocs'],
-    argTypes: {
-    }
-};
-
-type Story = StoryObj<typeof EmbedForm>;
-const Template: Story = (args: any) => ({
-    components: { EmbedForm },
-    setup() {
-        return { args };
-    },
-    template: '<EmbedForm v-bind="args" class="card card-sm mx-auto my-4 pt-2"/>',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-    noPreview:true,
-    height:330,
-    url:"https://projects.icij.org/the-implant-files/graphics/#/device-related-incidents-in-europe"
-};
-export const InModal = Template.bind({});
-InModal.decorators=[modalDecorator.bind(this,"Click to see the form with preview","Embed form with a preview",Size.lg)]
-InModal.args = {
-    noTitle:true,
-    height:550,
-    url:"https://projects.icij.org/the-implant-files/graphics/#/device-related-incidents-in-europe"
-};

package/stories/murmur/components/EmbeddableFooter.stories.ts

@@ -1,59 +0,0 @@
-import { EmbeddableFooter } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-import {BButton} from "bootstrap-vue-next";
-
-export default {
-    title: 'Murmur/components/EmbeddableFooter',
-    decorators:[()=>({template:`<div style='margin-top:200px;'><story/></div>`})],
-    component: EmbeddableFooter,
-    tags: ['autodocs'],
-    argTypes: {
-    }
-};
-
-type Story = StoryObj<typeof EmbeddableFooter>;
-const Template: Story = (args: any) => ({
-    components: { EmbeddableFooter },
-    setup() {
-        return { args };
-    },
-    template: '<EmbeddableFooter v-bind="args" ></EmbeddableFooter>',
-});
-
-export const Default = Template.bind({});
-Default.args = { class:"position-relative card"};
-export const LeadText = Template.bind({});
-LeadText.args = {lead:"Secret project", class:"position-relative card"};
-export const Title = Template.bind({});
-Title.args = {title:"Secret project", class:"position-relative card"};
-export const TitleSlot : Story = (args: any) => ({
-    components: { EmbeddableFooter },
-    setup() {
-        return { args };
-    },
-    template: `<EmbeddableFooter v-bind="args" >
-        <template #title>
-            <span class="small">Demo<br />Project</span>
-        </template>
-    </EmbeddableFooter>`,
-});
-
-TitleSlot.args = { class:"position-relative card"};
-export const MainSlot : Story = (args: any) => ({
-    components: { EmbeddableFooter , BButton},
-    setup() {
-        return { args };
-    },
-    template: `<EmbeddableFooter v-bind="args" >
-        <div class="d-flex align-items-center">
-            <div class="flex-grow-1 me-2">
-                This is an helpful text.
-            </div>
-            <b-button variant="info" pill size="sm" class="ms-auto me-2">
-                Help
-            </b-button>
-        </div>
-    </EmbeddableFooter>`
-});
-
-MainSlot.args = { class:"position-relative card"};

package/stories/murmur/components/FollowUsPopover.stories.ts

@@ -1,24 +0,0 @@
-import { FollowUsPopover } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-
-export default {
-    title: 'Murmur/components/FollowUsPopover',
-    component: FollowUsPopover,
-    tags: ['autodocs'],
-    argTypes: {
-    }
-};
-
-type Story = StoryObj<typeof FollowUsPopover>;
-const Template: Story = (args: any) => ({
-    components: { FollowUsPopover },
-    setup() {
-        return { args };
-    },
-    template: '<FollowUsPopover v-bind="args" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {
-    class:"card card-xs my-4 mx-auto border border-primary"
-};

package/stories/murmur/components/GenericFooter.stories.ts

@@ -1,27 +0,0 @@
-import { GenericFooter } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-
-export default {
-    title: 'Murmur/components/GenericFooter',
-    component: GenericFooter,
-    tags: ['autodocs'],
-    argTypes: {
-    }
-};
-
-type Story = StoryObj<typeof GenericFooter>;
-const Template: Story = (args: any) => ({
-    components: { GenericFooter },
-    setup() {
-        return { args };
-    },
-    template: '<GenericFooter v-bind="args" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {class:"card m-4"};
-export const AboutUs = Template.bind({});
-AboutUs.args = {showAboutUs:true};
-
-export const Version = Template.bind({});
-Version.args = {version:"alpha-10.2"};

package/stories/murmur/components/GenericHeader.stories.ts

@@ -1,27 +0,0 @@
-import { GenericHeader } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-
-export default {
-    title: 'Murmur/components/GenericHeader',
-    component: GenericHeader,
-    tags: ['autodocs'],
-    argTypes: {
-        brandOptions:{type:"select",}
-    }
-};
-
-type Story = StoryObj<typeof GenericHeader>;
-const Template: Story = (args: any) => ({
-    components: { GenericHeader },
-    setup() {
-        return { args };
-    },
-    template: '<GenericHeader v-bind="args" ></GenericHeader>',
-});
-
-export const Default = Template.bind({});
-Default.args = {};
-Default.decorators= [() => ({ template: '<div style="height: 1800px"><story/></div>' })]
-Default.parameters = { layout: 'fullscreen' }
-export const NoHeadroom = Template.bind({});
-NoHeadroom.args = {noHeadroom:true, position:"relative"};

package/stories/murmur/components/HapticCopy.stories.ts

@@ -1,40 +0,0 @@
-import {HapticCopy} from "@/components";
-import {StoryObj} from "@storybook/vue3";
-import {ref, watch} from "vue";
-type Story = StoryObj<typeof HapticCopy>
-
-const Template:Story = (args: any, {argTypes}: any) => ({
-    components: { HapticCopy },
-    props: Object.keys(argTypes),
-    setup(){ return {args}  },
-    template: `<HapticCopy v-bind="args" />`,
-})
-
-export const Default = Template.bind({});
-Default.args = {
-    text:"Lorem info sit amet",
-    class:"btn-info"
-}
-
-export const Feedback = Template.bind({});
-Feedback.template = `<HapticCopy  v-bind="args" /></button>`
-Feedback.args = {
-    hideLabel: true,
-    tooltipPlacement: "right",
-    text: "Lorem info sit amet",
-    class: "btn-secondary"
-}
-
-export default {
-    title: 'Murmur/Components/HapticCopy',
-    component: HapticCopy,
-    tags: ['autodocs'],
-    decorators:[()=>({template:"<div class='p-2 text-center'><story/></div>"})],
-    argTypes: {
-        hideLabel: { control: 'boolean' },
-        tooltipPlacement: { control: 'text' },
-        title: { control: 'text' }
-
-    }
-
-};

package/stories/murmur/components/ImddbHeader.stories.ts

@@ -1,27 +0,0 @@
-import { ImddbHeader } from "@/components";
-import { StoryObj } from "@storybook/vue3";
-
-export default {
-    title: 'Murmur/components/ImddbHeader',
-    component: ImddbHeader,
-    tags: ['autodocs'],
-    argTypes: {
-    }
-};
-
-type Story = StoryObj<typeof ImddbHeader>;
-const Template: Story = (args: any) => ({
-    components: { ImddbHeader },
-    setup() {
-        return { args };
-    },
-    template: '<ImddbHeader v-bind="args" />',
-});
-
-export const Default = Template.bind({});
-Default.args = {};
-Default.decorators= [() => ({ template: '<div style="height: 1800px"><story/></div>' })]
-Default.parameters = { layout: 'fullscreen' }
-
-export const NoHeadroom = Template.bind({});
-NoHeadroom.args = {noHeadroom:true, position:"relative"};