@dataloop-ai/components 0.19.56 → 0.19.57

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dataloop-ai/components",
3
- "version": "0.19.56",
3
+ "version": "0.19.57",
4
4
  "exports": {
5
5
  ".": "./index.ts",
6
6
  "./models": "./models.ts",
@@ -422,6 +422,9 @@ export default defineComponent({
422
422
  this.updateDateInterval(null)
423
423
  },
424
424
  deep: true
425
+ },
426
+ modelValue(value: DateInterval | null) {
427
+ this.dateInterval = value
425
428
  }
426
429
  },
427
430
  methods: {
@@ -101,6 +101,50 @@
101
101
  @change="handleModelValueUpdate"
102
102
  />
103
103
  </div>
104
+ <div style="width: 500px">
105
+ <div
106
+ v-if="date"
107
+ class="row"
108
+ style="
109
+ width: 100%;
110
+ align-items: center;
111
+ justify-content: center;
112
+ "
113
+ >
114
+ to
115
+ <input
116
+ type="date"
117
+ :disabled="!range"
118
+ :value="date.from"
119
+ class="dl-dtr--range-input"
120
+ placeholder="from"
121
+ @input="date.from = new Date($event.target.value)"
122
+ >
123
+
124
+ from
125
+ <input
126
+ type="date"
127
+ :disabled="!range"
128
+ :value="date.to"
129
+ class="dl-dtr--range-input"
130
+ placeholder="from"
131
+ @input="date.to = new Date($event.target.value)"
132
+ >
133
+ </div>
134
+
135
+ vmodel date: {{ date }}
136
+ <dl-date-time-range
137
+ v-model="date"
138
+ :type="type"
139
+ width="100%"
140
+ :available-range="range ? availableRange : null"
141
+ :mode="mode"
142
+ :show-time="showTime"
143
+ :auto-close="autoClose"
144
+ @set-type="handleSetType"
145
+ @change="handleModelValueUpdate"
146
+ />
147
+ </div>
104
148
  </div>
105
149
  </template>
106
150
  <script lang="ts">
@@ -13,6 +13,7 @@
13
13
  v-model="textVal"
14
14
  disabled
15
15
  />
16
+ <dl-input v-model="trimmedValue" />
16
17
  </div>
17
18
 
18
19
  <dl-input
@@ -238,7 +239,7 @@
238
239
  </template>
239
240
  <script lang="ts">
240
241
  import { v4 } from 'uuid'
241
- import { defineComponent, ref } from 'vue-demi'
242
+ import { computed, defineComponent, ref } from 'vue-demi'
242
243
  import { DlInput, DlButton, DlIcon } from '../components'
243
244
  import { DlInputFile } from '../components/compound/DlInput/types'
244
245
  export default defineComponent({
@@ -284,9 +285,20 @@ export default defineComponent({
284
285
 
285
286
  const textVal = ref<string>('test me')
286
287
 
288
+ const val = ref('')
289
+ const trimmedValue = computed<string>({
290
+ get: () => {
291
+ return val.value.trim()
292
+ },
293
+ set: (value: string) => {
294
+ val.value = value.trim()
295
+ }
296
+ })
297
+
287
298
  return {
288
299
  log: console.log,
289
300
  textVal,
301
+ trimmedValue,
290
302
  textInputValue,
291
303
  passFieldValue,
292
304
  warningFieldValue,