studio-variable/designtopack
3
0
Fork 0
Code Issues 7 Pull requests Projects Releases Packages Wiki Activity Actions

Add PrimeVue and Select component

Browse source
This commit is contained in:
Timothée Goguely 2024-09-10 16:23:09 +02:00
parent 70032e1b11
commit 2028955820
4 changed files with 82 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

66
package-lock.json generated
View file

@ -10,6 +10,7 @@
"dependencies": {
"dayjs": "^1.11.13",
"pinia": "^2.1.7",
"primevue": "^4.0.6",
"slugify": "^1.6.6",
"vue": "^3.5.1"
},
@ -434,6 +435,56 @@
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.0.tgz",
"integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ=="
},
"node_modules/@primeuix/styled": {
"version": "0.0.5",
"resolved": "https://registry.npmjs.org/@primeuix/styled/-/styled-0.0.5.tgz",
"integrity": "sha512-pVoGn/uPkVm/DyF3TR3EmH/pL/dP4nR42FcYbVduFq9VfO3KVeOEqvcCULHXos66RZO9MCbCFUoLy6ctf9GUGQ==",
"license": "MIT",
"dependencies": {
"@primeuix/utils": "^0.0.5"
},
"engines": {
"node": ">=12.11.0"
}
},
"node_modules/@primeuix/utils": {
"version": "0.0.5",
"resolved": "https://registry.npmjs.org/@primeuix/utils/-/utils-0.0.5.tgz",
"integrity": "sha512-ntUiUgtRtkF8KuaxHffzhYxQxoXk6LAPHm7CVlFjdqS8Rx8xRkLkZVyo84E+pO2hcNFkOGVP/GxHhQ2s94O8zA==",
"license": "MIT",
"engines": {
"node": ">=12.11.0"
}
},
"node_modules/@primevue/core": {
"version": "4.0.6",
"resolved": "https://registry.npmjs.org/@primevue/core/-/core-4.0.6.tgz",
"integrity": "sha512-IVIq2U++usVC8ghA/F6JTgWhsLTn8OQxqwKGBAdO20i8z9fjKOOzqITEemqwjguzZL5MOLDCh8KR4KADduZYgQ==",
"license": "MIT",
"dependencies": {
"@primeuix/styled": "^0.0.5",
"@primeuix/utils": "^0.0.5"
},
"engines": {
"node": ">=12.11.0"
},
"peerDependencies": {
"vue": "^3.0.0"
}
},
"node_modules/@primevue/icons": {
"version": "4.0.6",
"resolved": "https://registry.npmjs.org/@primevue/icons/-/icons-4.0.6.tgz",
"integrity": "sha512-ijGts+VpZcdMm+U/g3lC54b6TSCt6xfeOrUF1Ahq6px5jOvd0xrwXbJfQhT+4SNga1Iva1xOqDfuNtLPRo81zw==",
"license": "MIT",
"dependencies": {
"@primeuix/utils": "^0.0.5",
"@primevue/core": "4.0.6"
},
"engines": {
"node": ">=12.11.0"
}
},
"node_modules/@rollup/rollup-android-arm-eabi": {
"version": "4.21.2",
"resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.21.2.tgz",
@ -942,6 +993,21 @@
"node": "^10 || ^12 || >=14"
}
},
"node_modules/primevue": {
"version": "4.0.6",
"resolved": "https://registry.npmjs.org/primevue/-/primevue-4.0.6.tgz",
"integrity": "sha512-q7LhlHq1Hwda1uFxVq1GbDdwyinGZRP00uYtqYNVIBz7OnmH1C7cwY2+MINw5HfrnJTubiw08SdkErTnu+mRrg==",
"license": "MIT",
"dependencies": {
"@primeuix/styled": "^0.0.5",
"@primeuix/utils": "^0.0.5",
"@primevue/core": "4.0.6",
"@primevue/icons": "4.0.6"
},
"engines": {
"node": ">=12.11.0"
}
},
"node_modules/rollup": {
"version": "4.21.2",
"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.21.2.tgz",

1
package.json
View file

@ -11,6 +11,7 @@
"dependencies": {
"dayjs": "^1.11.13",
"pinia": "^2.1.7",
"primevue": "^4.0.6",
"slugify": "^1.6.6",
"vue": "^3.5.1"
},

18
src/components/inspirations/Selector.vue
View file

@ -8,18 +8,18 @@
"
>
<label for="inspirations">Choisir une inspiration</label>
<select id="inspirations">
<!-- TODO: dynamiser les options en bouclant sur les inspirations -->
<option value="shape-of-nature" selected>Shape of Nature</option>
<option value="inspiration-slug">Inspiration Title</option>
</select>
</div>
<Select id="inspirations" v-model="selectedInspiration" :options="inspirations" optionLabel="name" optionValue="value" class="" />
</div>
</template>
<script setup>
const { inspiration } = defineProps({
inspiration: Object,
});
import { ref } from "vue";
const selectedInspiration = ref();
const inspirations = ref([
{ name: 'Shape of Nature', value: 'shape-of-nature', selected: true },
{ name: 'Inspiration Title', value: 'inspiration-title' }
]);
</script>
<style scoped>

6
src/main.js
View file

@ -2,9 +2,15 @@ import { createApp } from "vue";
import "./assets/css/index.css";
import App from "./App.vue";
import { createPinia } from "pinia";
import PrimeVue from "primevue/config";
import Select from "primevue/select";
const app = createApp(App);
const pinia = createPinia();
app.use(pinia);
app.use(PrimeVue, {
unstyled: true
});
app.component('Select', Select);
app.mount("#app");