pg-components/src/lib/components/TopBar/TopBar.story.svelte at 0aa6ef38f4f25b9bb7ade47287e593c458bf2120 · encryption4all/pg-components · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<script lang="ts">
    import TopBar from '$lib/components/TopBar/TopBar.svelte'
    import type Policy from '$lib/components/AttributeForm/AttributeForm.svelte'

    export let Hst

    const initialPolicy = {
        'alice@example.com': [{ t: 'pbdf.sidn-pbdf.mobilenumber.mobilenumber', v: '+31612345678' }],
        'bob@example.com': [
            { t: 'pbdf.sidn-pbdf.mobilenumber.mobilenumber', v: '+31612345678' },
            { t: 'pbdf.gemeente.personalData.surname', v: 'Bob' }
        ]
    }

    const initialPolicySign = {
        'alice@example.com': [{ t: 'pbdf.sidn-pbdf.email.email'}]
    }

    const onSubmit = async (policy: Policy) => {
        console.log('Yay, we finished: ', policy)
    }

    const onPolicyChange = async (policy: Policy) => {
        console.log('The encryption policy has changed: ', policy)
    }

    const onSigningPolicyChanged = async (policy: Policy) => {
        console.log('The signing policy has changed: ', policy)
    }

    let enabled = false
</script>

<Hst.Story title="TopBar">
    <Hst.Variant title="en">
        <TopBar
            lang="en"
            bind:enabled
            formProps={{
                initialPolicy,
                onPolicyChange,
                onSubmit
            }}
            formPropsSign={{
                initialPolicy: initialPolicySign,
                onPolicyChange: onSigningPolicyChanged,
                onSubmit
            }}
        />
    </Hst.Variant>
    <Hst.Variant title="nl">
        <TopBar
            lang="nl"
            bind:enabled
            formProps={{
                initialPolicy,
                onPolicyChange,
                onSubmit
            }}
            formPropsSign={{
                initialPolicy: initialPolicySign,
                onPolicyChange: onSigningPolicyChanged,
                onSubmit
            }}
        />
    </Hst.Variant>
</Hst.Story>