@timus-networks/theme 1.0.184 → 2.0.0

package/components-js/ThemeRadio.vue

@@ -1,164 +0,0 @@
-<template>
-  <div class="pt-8 pb-16 flex gap-12 flex-col">
-    <h1>Radio</h1>
-
-    <section>
-      <h2>Temel Kullanım</h2>
-      <p class="p-lg-c my-6">El Radio, çok fazla seçeneğe sahip olmamalıdır. Aksi takdirde, Select bileşenini kullanmalısınız.</p>
-      <div class="grid grid-flow-col auto-cols-max gap-4">
-        <el-radio v-model="radio" :label="0">Seçenek A</el-radio>
-        <el-radio v-model="radio" :label="1">Seçenek B</el-radio>
-        <el-radio v-model="radio" :label="2" disabled>Seçenek C (Devre Dışı)</el-radio>
-        <el-radio :value="false" disabled>Seçili Olmayan ve Devre Dışı</el-radio>
-      </div>
-      <div class="my-4 p-4 border-l-4 border-info-600 bg-info-100">
-        <p class="text-xs">
-          Örnek Kullanım:
-          <code> &lt;el-radio :value="true" disabled&gt;Seçili & Devre Dışı&lt;/el-radio&gt; </code>
-        </p>
-      </div>
-    </section>
-
-    <section>
-      <h2>Radio group</h2>
-      <p class="p-lg-c my-6">
-        `el-radio-group` ile `el-radio` bileşenini bir araya getirerek bir radyo grubu görüntüleyebilirsiniz. el-radio-group elementinin v-model ile
-        bağlı olduğu bir değişkeni belirleyin ve el-radio içindeki etiket değerini ayarlayın. Ayrıca, mevcut değeri parametre olarak alan bir
-        değişiklik olayı sağlar.
-      </p>
-      <div class="grid grid-flow-col auto-cols-max gap-4">
-        <el-radio-group v-model="radio">
-          <el-radio :label="3">Seçenek A</el-radio>
-          <el-radio :label="6">Seçenek B</el-radio>
-          <el-radio :label="9">Seçenek C</el-radio>
-        </el-radio-group>
-      </div>
-      <div class="my-4 p-4 border-l-4 border-info-600 bg-info-100">
-        <p class="text-xs">
-          Örnek Kullanım:
-          <code>
-            &lt;el-radio-group v-model="radio"&gt; &lt;el-radio :label="3"&gt;Seçenek A&lt;/el-radio&gt; &lt;el-radio :label="6"&gt;Seçenek
-            B&lt;/el-radio&gt; &lt;/el-radio-group&gt;
-          </code>
-        </p>
-      </div>
-    </section>
-
-    <section>
-      <div>
-        <el-radio-group v-model="radio1">
-          <el-radio-button label="New York" />
-          <el-radio-button label="Washington" />
-          <el-radio-button label="Los Angeles" />
-          <el-radio-button label="Chicago" />
-        </el-radio-group>
-      </div>
-      <div style="margin-top: 20px">
-        <el-radio-group v-model="radio2" size="medium">
-          <el-radio-button label="New York" />
-          <el-radio-button label="Washington" />
-          <el-radio-button label="Los Angeles" />
-          <el-radio-button label="Chicago" />
-        </el-radio-group>
-      </div>
-      <div style="margin-top: 20px">
-        <el-radio-group v-model="radio3" size="small">
-          <el-radio-button label="New York" />
-          <el-radio-button label="Washington" disabled />
-          <el-radio-button label="Los Angeles" />
-          <el-radio-button label="Chicago" />
-        </el-radio-group>
-      </div>
-      <div style="margin-top: 20px">
-        <el-radio-group v-model="radio4" disabled size="mini">
-          <el-radio-button label="New York" />
-          <el-radio-button label="Washington" />
-          <el-radio-button label="Los Angeles" />
-          <el-radio-button label="Chicago" />
-        </el-radio-group>
-      </div>
-    </section>
-  </div>
-</template>
-
-<script>import { defineComponent } from 'vue';
-const cityOptions = ['Shanghai', 'Beijing', 'Guangzhou', 'Shenzhen'];
-export default defineComponent({
-    data() {
-        return {
-            checked: true,
-            radio: 2,
-            radio1: 'New York',
-            radio2: 'New York',
-            radio3: 'New York',
-            radio4: 'New York',
-            checkboxGroup1: ['Shanghai'],
-            cities: cityOptions,
-            checkList: ['selected and disabled', 'Option A'],
-            checkAll: false,
-            checkedCities: ['Shanghai', 'Beijing'],
-            isIndeterminate: true,
-            time: '',
-            sizeForm: {
-                name: '',
-                region: '',
-                date1: '',
-                date2: '',
-                delivery: false,
-                type: [],
-                resource: '',
-                desc: '',
-            },
-            loading: false,
-            form: {
-                email: '',
-                password: '',
-                remember: false,
-                token: null,
-                correlation_id: null,
-                action: null,
-                platform: 'manager',
-                version: '1.0.10',
-            },
-            rules: {
-                email: [
-                    {
-                        validator: 'validateEmail',
-                        trigger: 'submit',
-                        message: this.$t('messages.please_provide_valid_email'),
-                    },
-                ],
-                password: [
-                    {
-                        required: true,
-                        trigger: 'submit',
-                        message: this.$t('messages.please_fill', {
-                            field: this.$t('login.password'),
-                        }),
-                    },
-                ],
-            },
-        };
-    },
-    methods: {
-        handleCheckAllChange(val) {
-            this.checkedCities = val ? cityOptions : [];
-            this.isIndeterminate = false;
-        },
-        handleCheckedCitiesChange(value) {
-            const checkedCount = value.length;
-            this.checkAll = checkedCount === this.cities.length;
-            this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
-        },
-        showAgreementDialog(type) {
-            console.log('agreement: ', type);
-        },
-        submit() {
-            this.$emit('submit', this.form);
-        },
-        onSubmit() {
-            console.log('submit!');
-        },
-    },
-});
-</script>

package/components-js/ThemeSelect.vue

@@ -1,237 +0,0 @@
-<template>
-  <div class="pt-8 pb-16 flex gap-12 flex-col">
-    <section>
-      <h1>Basic usage</h1>
-      <p class="p-lg my-6">v-model is the value of el-option that is currently selected.</p>
-      <div class="grid grid-flow-col auto-cols-max gap-4">
-        <el-select v-model="value" placeholder="Select">
-          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </div>
-      <div class="my-4 p-4 border-l-4 border-blue-600 bg-blue-100">
-        <p class="text-xs">
-          <code>&lt;el-button :type="'primary'"&gt;Primary&lt;/el-button&gt;</code>
-        </p>
-      </div>
-    </section>
-
-    <section>
-      <h1>Disabled option</h1>
-      <p class="p-lg my-6">Set the value of disabled in el-option to true to disable this option.</p>
-      <div class="grid grid-flow-col auto-cols-max gap-4">
-        <el-select v-model="value" placeholder="Select">
-          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" :disabled="item.disabled" />
-        </el-select>
-      </div>
-      <div class="my-4 p-4 border-l-4 border-info-600 bg-info-100">
-        <p class="text-xs">
-          Outline görünümü için, buton elementinize <code>class="outline"</code> ekleyin. Örnek:
-          <code>&lt;el-button class="outline"&gt;Button&lt;/el-button&gt;</code>
-        </p>
-      </div>
-    </section>
-
-    <section>
-      <h1>Disabled select</h1>
-      <p class="p-lg my-6">Set disabled of el-select to make it disabled.</p>
-      <div class="grid grid-flow-col auto-cols-max gap-4">
-        <el-select v-model="value" disabled placeholder="Select">
-          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </div>
-      <div class="my-4 p-4 border-l-4 border-info-600 bg-info-100">
-        <p class="text-xs">
-          Ghost görünümü için, buton elementinize <code>class="ghost"</code> ekleyin. Örnek:
-          <code>&lt;el-button class="ghost"&gt;Button&lt;/el-button&gt;</code>
-        </p>
-      </div>
-    </section>
-
-    <section>
-      <h1>Clearable single select</h1>
-      <p class="p-lg my-6">Farklı boyutlardaki butonlarımız, çeşitli arayüz ihtiyaçlarına yanıt vermek için tasarlanmıştır.</p>
-      <div class="grid grid-flow-col auto-cols-max items-center gap-4">
-        <el-select v-model="value" clearable placeholder="Select">
-          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </div>
-      <div class="my-4 p-4 border-l-4 border-info-600 bg-info-100">
-        <p class="text-xs">
-          Örnekler:
-          <code>&lt;el-button :size="'large'"&gt;Button&lt;/el-button&gt;</code>
-        </p>
-      </div>
-    </section>
-
-    <section>
-      <h1>Basic multiple select</h1>
-      <p class="p-lg my-6">Etkileşime kapalı 'disabled' butonlarımız, kullanılamaz durumları göstermek için kullanılır.</p>
-      <div class="grid grid-flow-col auto-cols-max gap-4 items-center">
-        {{ JSON.stringify(value1) }}
-        <el-select v-model="value1" multiple placeholder="Select" :disabled="false">
-          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-        <el-select v-model="value1" multiple placeholder="Select" :disabled="true">
-          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-        <el-select v-model="value2" multiple collapse-tags placeholder="Select" type="primary" :disabled="true">
-          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
-        </el-select>
-      </div>
-      <div class="my-4 p-4 border-l-4 border-red-600 bg-red-100">
-        <p class="text-xs">
-          Butonu devre dışı bırakmak için, <code>disabled</code> özelliğini ekleyin. Örnek:
-          <code>&lt;el-button disabled&gt;Button&lt;/el-button&gt;</code>
-        </p>
-      </div>
-    </section>
-
-    <section>
-      <h1>Custom template</h1>
-      <p class="p-lg my-6">
-        İkonlarla zenginleştirilmiş butonlarımız, görsel bir ipucu sunar ve kullanıcı deneyimini artırır. Tüm ikonlarımızın listesini görmek için
-        <nuxt-link to="/icons" class="text-blue-600 hover:underline">buraya tıklayın</nuxt-link>.
-      </p>
-      <div class="grid grid-flow-col auto-cols-max gap-4">
-        <el-select v-model="value" placeholder="Select">
-          <el-option v-for="item in cities" :key="item.value" :label="item.label" :value="item.value">
-            <span style="float: left">{{ item.label }}</span>
-            <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
-          </el-option>
-        </el-select>
-      </div>
-      <div class="my-4 p-4 border-l-4 border-info-600 bg-info-100">
-        <p class="text-xs">
-          Örnekler:
-          <code>&lt;el-button type="primary" class="isax-trash"&gt;&lt;/el-button&gt;</code>. Sağda ikon için <code>class="icon-right"</code> ekleyin.
-        </p>
-      </div>
-    </section>
-
-    <section>
-      <h1>Grouping</h1>
-      <p class="p-lg my-6">Display options in groups.</p>
-      <div class="grid grid-flow-col auto-cols-max gap-4">
-        <el-select v-model="value" placeholder="Select">
-          <el-option-group v-for="group in groups" :key="group.label" :label="group.label">
-            <el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value" />
-          </el-option-group>
-        </el-select>
-      </div>
-      <div class="my-4 p-4 border-l-4 border-info-600 bg-info-100">
-        <p class="text-xs">Buton grupları için <code>&lt;el-button-group&gt;</code> kullanın.</p>
-      </div>
-    </section>
-  </div>
-</template>
-<script>
-import { defineComponent } from 'vue';
-
-export default defineComponent({
-  name: 'TimusButtonSample',
-  data() {
-    return {
-      cities: [
-        {
-          value: 'Beijing',
-          label: 'Beijing',
-        },
-        {
-          value: 'Shanghai',
-          label: 'Shanghai',
-        },
-        {
-          value: 'Nanjing',
-          label: 'Nanjing',
-        },
-        {
-          value: 'Chengdu',
-          label: 'Chengdu',
-        },
-        {
-          value: 'Shenzhen',
-          label: 'Shenzhen',
-        },
-        {
-          value: 'Guangzhou',
-          label: 'Guangzhou',
-        },
-      ],
-      groups: [
-        {
-          label: 'Popular cities',
-          options: [
-            {
-              value: 'Shanghai',
-              label: 'Shanghai',
-            },
-            {
-              value: 'Beijing',
-              label: 'Beijing',
-            },
-          ],
-        },
-        {
-          label: 'City name',
-          options: [
-            {
-              value: 'Chengdu',
-              label: 'Chengdu',
-            },
-            {
-              value: 'Shenzhen',
-              label: 'Shenzhen',
-            },
-            {
-              value: 'Guangzhou',
-              label: 'Guangzhou',
-            },
-            {
-              value: 'Dalian',
-              label: 'Dalian',
-            },
-          ],
-        },
-      ],
-      options: [
-        {
-          value: 'Option1',
-          label: 'Option1',
-        },
-        {
-          value: 'Option2',
-          label: 'Option2',
-          disabled: true,
-        },
-        {
-          value: 'Option3',
-          label: 'Option3',
-        },
-        {
-          value: 'Option4',
-          label: 'Option4',
-        },
-        {
-          value: 'Option5',
-          label: 'Option5',
-        },
-      ],
-      value: '',
-      value1: ['Option2', 'Option4', 'Option5'],
-      value2: ['Option2', 'Option4', 'Option5'],
-    };
-  },
-  computed: {
-    gridSize() {
-      const grids = {
-        5: 'grid-cols-5',
-        6: 'grid-cols-6',
-        7: 'grid-cols-7',
-        8: 'grid-cols-8',
-      };
-
-      return grids;
-    },
-  },
-});
-</script>

package/components-js/ThemeSidebar.d.ts

@@ -1,2 +0,0 @@
-declare const _default: any;
-export default _default;