
        <script setup>
        import { IframePreview } from '@viteplay/vue/iframe'
        const code = decodeURI("%3Cscript%20setup%3E%0Aimport%20CDropdown%20from%20'../CDropdown.vue'%0Aimport%20%7B%20ref,%20watch,%20computed%20%7D%20from%20'vue'%0Aimport%20CInput%20from%20'../../CInput/CInput.vue'%0A%0Aconst%20testflg%20=%20ref(false)%0A%0Aconst%20options%20=%20computed(()%20=%3E%20%5B%0A%20%20%7B%20label:%20'test1',%20value:%20'value1'%20%7D,%0A%20%20%7B%0A%20%20%20%20label:%0A%20%20%20%20%20%20'test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2test2',%0A%20%20%20%20value:%20'value2',%0A%20%20%7D,%0A%20%20%7B%20label:%20'test1',%20value:%20'value1'%20%7D,%0A%20%20%7B%20label:%20'test1',%20value:%20'value1'%20%7D,%0A%20%20%7B%20label:%20'%E3%81%84%E3%81%AA%E3%81%84%E3%82%88',%20value:%20'value3',%20hideFlag:%20testflg.value%20%7D,%0A%20%20%7B%20label:%20'test1',%20value:%20'value1'%20%7D,%0A%20%20%7B%20label:%20'test1',%20value:%20'value1'%20%7D,%0A%5D)%0A%0Aconst%20model1%20=%20ref('%E3%83%86%E3%82%AD%E3%82%B9%E3%83%88%EF%BC%91')%0Aconst%20model2%20=%20ref('%E3%83%86%E3%82%AD%E3%82%B9%E3%83%88%EF%BC%92')%0Aconst%20model3%20=%20ref('%E3%83%86%E3%82%AD%E3%82%B9%E3%83%88%EF%BC%93')%0Aconst%20model%20=%20ref('value1')%0Awatch(model,%20()%20=%3E%20%7B%0A%20%20model.value%20!==%20'value3'%20?%20(testflg.value%20=%20false)%20:%20(testflg.value%20=%20true)%0A%7D)%0Aconst%20createOption%20=%20ref(%5B%0A%20%20%7B%20label:%20model1,%20value:%20model1%20%7D,%0A%20%20%7B%20label:%20model2,%20value:%20model2%20%7D,%0A%20%20%7B%20label:%20model3,%20value:%20model3%20%7D,%0A%5D)%0A/**%0A%20*%20!%20%E3%81%93%E3%81%93%E3%81%A7%E5%80%A4%E3%82%92%E6%8C%87%E5%AE%9A%E3%81%97%E3%81%AA%E3%81%84%E5%A0%B4%E5%90%88%E3%81%AFlabel%E3%81%8C0%E3%81%A8%E3%81%AA%E3%82%8B%E3%80%82%E3%81%9D%E3%81%86%E3%81%97%E3%81%9F%E3%81%8F%E3%81%AA%E3%81%84%E3%81%A8%E3%81%8D%E3%81%AF%E5%88%9D%E6%9C%9F%E5%80%A4''%E3%81%A8%E3%81%97%E3%81%A6%E3%81%8F%E3%81%A0%E3%81%95%E3%81%84%0A%20*/%0Aconst%20newModel%20=%20ref()%0A%0Awatch(%0A%20%20()%20=%3E%20model1,%0A%20%20(newValue)%20=%3E%20%7B%0A%20%20%20%20createOption.value%20=%20Array.of(model1.value,%20model2.value,%20model3.value).map((d)%20=%3E%20%7B%0A%20%20%20%20%20%20console.log(d)%0A%20%20%20%20%20%20return%20%7B%20label:%20d,%20value:%20d%20%7D%0A%20%20%20%20%7D)%0A%20%20%7D,%0A%20%20%7B%20deep:%20true%20%7D%0A)%0Awatch(%0A%20%20()%20=%3E%20model2,%0A%20%20(newValue)%20=%3E%20%7B%0A%20%20%20%20createOption.value%20=%20Array.of(model1.value,%20model2.value,%20model3.value).map((d)%20=%3E%20%7B%0A%20%20%20%20%20%20return%20%7B%20label:%20d,%20value:%20d%20%7D%0A%20%20%20%20%7D)%0A%20%20%20%20console.log(createOption.value)%0A%20%20%7D,%0A%20%20%7B%20deep:%20true%20%7D%0A)%0Awatch(%0A%20%20()%20=%3E%20model3,%0A%20%20(newValue)%20=%3E%20%7B%0A%20%20%20%20createOption.value%20=%20Array.of(model1.value,%20model2.value,%20model3.value).map((d)%20=%3E%20%7B%0A%20%20%20%20%20%20return%20%7B%20label:%20d,%20value:%20d%20%7D%0A%20%20%20%20%7D)%0A%20%20%7D,%0A%20%20%7B%20deep:%20true%20%7D%0A)%0A%3C/script%3E%0A%0A%3Ctemplate%3E%0A%20%20model:%7B%7B%20model%20%7D%7D%3Cbr%20/%3E%0A%20%20model:%7B%7B%20options%20%7D%7D%0A%20%20%3Cdiv%20class=%22test%22%3E%0A%20%20%20%20%3CCDropdown%20v-model=%22model%22%20:p_Options=%22options%22%20p_ParentElement=%22.playground-preview%22%20/%3E%0A%20%20%3C/div%3E%0A%20%20%3Cdiv%20class=%22test%22%3E%0A%20%20%20%20%3CCDropdown%20v-model=%22model%22%20:p_Options=%22options%22%20/%3E%0A%20%20%3C/div%3E%0A%20%20%3Cdiv%20class=%22test%22%3E%0A%20%20%20%20%3CCDropdown%20v-model=%22newModel%22%20:p_Options=%22createOption%22%20/%3E%0A%20%20%3C/div%3E%0A%3C/template%3E%0A%3Cstyle%3E%0A.test%20%7B%0A%20%20/*%20width:%2090px;%20*/%0A%20%20margin-left:%20300px;%0A%20%20margin-bottom:%2010px;%0A%7D%0A%3C/style%3E")

        const modules = {}
        import  module_0 from "/Users/nakashimakeiju/ghq/github.com/CodeLic/console/src/components/CDropdown/CDropdown.vue"
          modules["../CDropdown.vue"] = module_0
          
import * as  module_1 from "vue"
          modules["vue"] = module_1
          
import * as  module_2 from "vue"
          modules["vue"] = module_2
          
import * as  module_3 from "vue"
          modules["vue"] = module_3
          
import  module_4 from "/Users/nakashimakeiju/ghq/github.com/CodeLic/console/src/components/CInput/CInput.vue"
          modules["../../CInput/CInput.vue"] = module_4
          
        </script>

        <template>
          <IframePreview :code="code" :modules="modules" />
        </template>
        