@i-cell/ids-styles 0.0.62 → 0.0.63

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.
Files changed (7) hide show
  1. package/dist/autocomplete/autocomplete.css +69 -20
  2. package/dist/autocomplete/autocomplete.min.css +1 -1
  3. package/dist/autocomplete/autocomplete.plugin.js +38 -20
  4. package/dist/components.css +69 -20
  5. package/dist/components.min.css +1 -1
  6. package/dist/components.plugin.js +41 -23
  7. package/package.json +2 -2
package/dist/components.plugin.js CHANGED
@@ -327,8 +327,6 @@ module.exports = function ComponentsPlugin() {
327
327
  borderStyle: 'none',
328
328
  borderColor: 'rgba(0,0,0,0)',
329
329
  lineHeight: 1.5,
330
- display: 'inline-flex',
331
- alignItems: 'center',
332
330
  },
333
331
  '.ids-autocomplete::before,.ids-autocomplete::after,.ids-autocomplete *,.ids-autocomplete ::before,.ids-autocomplete ::after': {
334
332
  boxSizing: 'border-box',
@@ -336,27 +334,47 @@ module.exports = function ComponentsPlugin() {
336
334
  borderStyle: 'none',
337
335
  borderColor: 'rgba(0,0,0,0)',
338
336
  },
339
- '.ids-autocomplete>input': { textOverflow: 'ellipsis' },
340
- '.ids-autocomplete>ids-overlay-panel': { display: 'none' },
341
- '.ids-autocomplete.ids-autocomplete-compact': {
342
- gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-gap-compact)',
343
- },
344
- '.ids-autocomplete.ids-autocomplete-comfortable': {
345
- gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-gap-comfortable)',
346
- },
347
- '.ids-autocomplete.ids-autocomplete-spacious': {
348
- gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-gap-spacious)',
349
- },
350
- '.ids-autocomplete.ids-autocomplete-dense': {
351
- gap: 'var(--ids-comp-forms-form-field-standard-field-wrapper-container-size-gap-dense)',
352
- },
353
- '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix:has(.ids-autocomplete)':
354
- { overflowX: 'visible' },
355
- '.ids-overlay-panel__autocomplete-panel': { width: '100%' },
356
- '.ids-overlay-panel__autocomplete-panel .ids-overlay-panel__autocomplete-message>.ids-option': { width: '100%' },
357
- '.ids-overlay-panel__autocomplete-panel .ids-overlay-panel__autocomplete-message>.ids-option:is([disabled])': {
358
- outlineStyle: 'none',
359
- },
337
+ '.ids-autocomplete-panel': { overflow: 'auto', width: '100%', padding: '8px', scrollbarWidth: 'thin' },
338
+ '.ids-autocomplete-overlay-panel': { width: '100%' },
339
+ '.ids-autocomplete-suffix': { display: 'flex', alignItems: 'center' },
340
+ '.ids-autocomplete-chip-list': { display: 'flex', flexWrap: 'wrap', gap: '4px', marginBottom: '4px' },
341
+ '.ids-autocomplete-chip-list:not(:has(button:first-child))': { display: 'none' },
342
+ '.ids-autocomplete-chip-list button[idsChip].ids-chip': { borderStyle: 'solid !important' },
343
+ '.ids-autocomplete-chip-list button[idsChip].ids-chip>div.ids-chip__label': {
344
+ textAlign: 'left',
345
+ wordBreak: 'break-all',
346
+ overflow: 'hidden',
347
+ display: '-webkit-box',
348
+ lineClamp: 1,
349
+ WebkitBoxOrient: 'vertical',
350
+ WebkitLineClamp: '1',
351
+ },
352
+ '.ids-autocomplete-hint__wrapper': { padding: '8px 12px' },
353
+ '.ids-autocomplete.ids-autocomplete-compact>.ids-autocomplete-suffix': { gap: 'var(--ids-comp-forms-input-size-icons-gap-compact)' },
354
+ '.ids-autocomplete.ids-autocomplete-comfortable>.ids-autocomplete-suffix': {
355
+ gap: 'var(--ids-comp-forms-input-size-icons-gap-comfortable)',
356
+ },
357
+ '.ids-autocomplete.ids-autocomplete-spacious>.ids-autocomplete-suffix': {
358
+ gap: 'var(--ids-comp-forms-input-size-icons-gap-spacious)',
359
+ },
360
+ '.ids-autocomplete.ids-autocomplete-dense>.ids-autocomplete-suffix': { gap: 'var(--ids-comp-forms-input-size-icons-gap-dense)' },
361
+ 'input[autocomplete]': { width: '100%', textOverflow: 'ellipsis' },
362
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix:has(>input[autocomplete])':
363
+ { width: '100%', display: 'inline-flex', alignItems: 'center' },
364
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix:has(>input[autocomplete]):has(.ids-autocomplete-chip-list>button:first-child)':
365
+ { display: 'grid', gridTemplateColumns: '1fr auto' },
366
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix:has(>input[autocomplete]):has(.ids-autocomplete-chip-list>button:first-child)>input[autocomplete]':
367
+ { order: 3 },
368
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix:has(>input[autocomplete]):has(.ids-autocomplete-chip-list>button:first-child)>.ids-autocomplete':
369
+ { order: 2, gridRow: 'span 2/span 1' },
370
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix:has(>input[autocomplete]~.ids-autocomplete-compact)':
371
+ { columnGap: 'var(--ids-comp-forms-input-size-gap-compact)' },
372
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix:has(>input[autocomplete]~.ids-autocomplete-comfortable)':
373
+ { columnGap: 'var(--ids-comp-forms-input-size-gap-comfortable)' },
374
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix:has(>input[autocomplete]~.ids-autocomplete-spacious)':
375
+ { columnGap: 'var(--ids-comp-forms-input-size-gap-spacious)' },
376
+ '.ids-form-field>.ids-form-field__field-wrapper>.ids-form-field__field-wrapper__container>.ids-form-field__infix:has(>input[autocomplete]~.ids-autocomplete-dense)':
377
+ { columnGap: 'var(--ids-comp-forms-input-size-gap-dense)' },
360
378
  '.ids-avatar': {
361
379
  boxSizing: 'border-box',
362
380
  borderWidth: '0',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@i-cell/ids-styles",
3
- "version": "0.0.62",
3
+ "version": "0.0.63",
4
4
  "private": false,
5
5
  "description": "Stylesheets for i-Cell Design System UI Kit components (currently Vue and Angular)",
6
6
  "scripts": {
@@ -36,7 +36,7 @@
36
36
  },
37
37
  "homepage": "https://github.com/i-Cell-Mobilsoft-Open-Source/ids-styles#readme",
38
38
  "devDependencies": {
39
- "@i-cell/ids-tokens": "0.0.37",
39
+ "@i-cell/ids-tokens": "0.0.39",
40
40
  "commander": "^12.1.0",
41
41
  "gulp": "^5.0.0",
42
42
  "gulp-prettier": "^6.0.0",