scinote-web/app/views/design_elements/_modals.html.erb

32 lines
805 B
Text
Raw Normal View History

2024-01-20 03:33:34 +08:00
<div>
<h1>Modals</h1>
<div id="modals" class="flex items-center gap-4 flex-wrap mb-6">
<div ref="wizardModal">
<button @click="showWizard = true" class="btn btn-primary">Show Wizard Modal</button>
<wizard-modal
v-if="showWizard"
@close="showWizard = false"
@alert="fireAlert"
:params="wizardParams"
:config="wizardConfig"
/>
</div>
<div ref="infoModal">
<button @click="showInfo = true" class="btn btn-primary">Show Info Modal</button>
<info-modal
v-if="showInfo"
@close="showInfo = false"
:params="infoParams"
>
<div>I am a component that gets consumed by the slot</div>
</info-modal>
</div>
2024-01-20 03:33:34 +08:00
</div>
2024-01-20 03:33:34 +08:00
</div>
<%= javascript_include_tag 'vue_design_system_modals' %>