feat(ui): added c-select in the ui lib (#550)

* feat(ui): added c-select in the ui lib

* refactor(ui): switched n-select to c-select
This commit is contained in:
Corentin THOMASSET 2023-08-07 17:30:00 +02:00 committed by Corentin Thomasset
parent e06e8fae50
commit 792a17d2ac
No known key found for this signature in database
GPG key ID: DBD997E935996158
29 changed files with 666 additions and 199 deletions

View file

@ -51,37 +51,35 @@ const { copy } = useCopy({ source: hmac });
<c-input-text v-model:value="secret" raw-text placeholder="Enter the secret key..." label="Secret key" clearable />
<div flex gap-2>
<n-form-item label="Hashing function" flex-1>
<n-select
v-model:value="hashFunction"
placeholder="Select an hashing function..."
:options="Object.keys(algos).map((label) => ({ label, value: label }))"
/>
</n-form-item>
<n-form-item label="Output encoding" flex-1>
<n-select
v-model:value="encoding"
placeholder="Select the result encoding..."
:options="[
{
label: 'Binary (base 2)',
value: 'Bin',
},
{
label: 'Hexadecimal (base 16)',
value: 'Hex',
},
{
label: 'Base64 (base 64)',
value: 'Base64',
},
{
label: 'Base64-url (base 64 with url safe chars)',
value: 'Base64url',
},
]"
/>
</n-form-item>
<c-select
v-model:value="hashFunction" label="Hashing function"
flex-1
placeholder="Select an hashing function..."
:options="Object.keys(algos).map((label) => ({ label, value: label }))"
/>
<c-select
v-model:value="encoding" label="Output encoding"
flex-1
placeholder="Select the result encoding..."
:options="[
{
label: 'Binary (base 2)',
value: 'Bin',
},
{
label: 'Hexadecimal (base 16)',
value: 'Hex',
},
{
label: 'Base64 (base 64)',
value: 'Base64',
},
{
label: 'Base64-url (base 64 with url safe chars)',
value: 'Base64url',
},
]"
/>
</div>
<input-copyable v-model:value="hmac" type="textarea" placeholder="The result of the HMAC..." label="HMAC of your text" />
<div flex justify-center>