CorentinTh/it-tools
1
1
Fork 0
mirror of https://github.com/CorentinTh/it-tools.git synced 2024-09-20 15:06:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(Case Converter): Add lowercase and uppercase (#534)

Browse source 
* feat(case converter): add uppercase and lowercase

* (case converter) correctly use stripRegexp

* style: lint fix

* 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

* feat(new tool): emoji picker (#551)

* chore(deps): update dependency @vitejs/plugin-vue to v4 (#496)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* chore(deps): update dependency @vitejs/plugin-vue-jsx to v3 (#497)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

* refactor(case converter): using nocase to convert to upper and lower case

* refactor(case converter): config based case changes

---------

Co-authored-by: Corentin THOMASSET <corentin.thomasset74@gmail.com>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
This commit is contained in:
Marvin 2023-08-09 23:45:21 +02:00 committed by GitHub
parent 56d74d07a8
commit 7b6232a151
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 79 additions and 52 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/InputCopyable.vue
View file

@ -11,7 +11,7 @@ const { copy } = useClipboard({ source: value });
function onCopyClicked() {
copy();
tooltipText.value = 'Copied !';
tooltipText.value = 'Copied!';
setTimeout(() => {
tooltipText.value = 'Copy to clipboard';

128
src/tools/case-converter/case-converter.vue
View file

@ -19,62 +19,88 @@ const baseConfig = {
};
const input = ref('lorem ipsum dolor sit amet');
const formats = computed(() => [
{
label: 'Lowercase:',
value: noCase(input.value, baseConfig).toLocaleLowerCase(),
},
{
label: 'Uppercase:',
value: noCase(input.value, baseConfig).toLocaleUpperCase(),
},
{
label: 'Camelcase:',
value: camelCase(input.value, baseConfig),
},
{
label: 'Capitalcase:',
value: capitalCase(input.value, baseConfig),
},
{
label: 'Constantcase:',
value: constantCase(input.value, baseConfig),
},
{
label: 'Dotcase:',
value: dotCase(input.value, baseConfig),
},
{
label: 'Headercase:',
value: headerCase(input.value, baseConfig),
},
{
label: 'Nocase:',
value: noCase(input.value, baseConfig),
},
{
label: 'Paramcase:',
value: paramCase(input.value, baseConfig),
},
{
label: 'Pascalcase:',
value: pascalCase(input.value, baseConfig),
},
{
label: 'Pathcase:',
value: pathCase(input.value, baseConfig),
},
{
label: 'Sentencecase:',
value: sentenceCase(input.value, baseConfig),
},
{
label: 'Snakecase:',
value: snakeCase(input.value, baseConfig),
},
]);
const inputLabelAlignmentConfig = {
labelPosition: 'left',
labelWidth: '120px',
labelAlign: 'right',
};
</script>
<template>
<c-card>
<n-form label-width="120" label-placement="left" :show-feedback="false">
<c-input-text
v-model:value="input"
label="Your string"
label-position="left"
label-width="120px"
label-align="right"
placeholder="Your string..."
raw-text
/>
<c-input-text
v-model:value="input"
label="Your string:"
placeholder="Your string..."
raw-text
v-bind="inputLabelAlignmentConfig"
/>
<n-divider />
<div divider my-16px />
<n-form-item label="Camelcase:">
<InputCopyable :value="camelCase(input, baseConfig)" />
</n-form-item>
<n-form-item label="Capitalcase:">
<InputCopyable :value="capitalCase(input, baseConfig)" />
</n-form-item>
<n-form-item label="Constantcase:">
<InputCopyable :value="constantCase(input, baseConfig)" />
</n-form-item>
<n-form-item label="Dotcase:">
<InputCopyable :value="dotCase(input, baseConfig)" />
</n-form-item>
<n-form-item label="Headercase:">
<InputCopyable :value="headerCase(input, baseConfig)" />
</n-form-item>
<n-form-item label="Nocase:">
<InputCopyable :value="noCase(input, baseConfig)" />
</n-form-item>
<n-form-item label="Paramcase:">
<InputCopyable :value="paramCase(input, baseConfig)" />
</n-form-item>
<n-form-item label="Pascalcase:">
<InputCopyable :value="pascalCase(input, baseConfig)" />
</n-form-item>
<n-form-item label="Pathcase:">
<InputCopyable :value="pathCase(input, baseConfig)" />
</n-form-item>
<n-form-item label="Sentencecase:">
<InputCopyable :value="sentenceCase(input, baseConfig)" />
</n-form-item>
<n-form-item label="Snakecase:">
<InputCopyable :value="snakeCase(input, baseConfig)" />
</n-form-item>
</n-form>
<InputCopyable
v-for="format in formats"
:key="format.label"
:value="format.value"
:label="format.label"
v-bind="inputLabelAlignmentConfig"
mb-1
/>
</c-card>
</template>
<style lang="less" scoped>
.n-form-item {
margin: 5px 0;
}
</style>

1
unocss.config.ts
View file

@ -19,5 +19,6 @@ export default defineConfig({
},
shortcuts: {
'pretty-scrollbar': 'scrollbar scrollbar-rounded scrollbar-thumb-color-gray-300 scrollbar-track-color-gray-100 dark:scrollbar-thumb-color-#424242 dark:scrollbar-track-color-#686868',
'divider': 'h-1px bg-current op-10',
},
});