@1001-digital/components 1.3.0 → 1.4.0

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": "@1001-digital/components",
3
- "version": "1.3.0",
3
+ "version": "1.4.0",
4
4
  "type": "module",
5
5
  "sideEffects": [
6
6
  "*.css"
@@ -14,7 +14,7 @@
14
14
  ],
15
15
  "peerDependencies": {
16
16
  "vue": "^3.5.0",
17
- "@1001-digital/styles": "^1.1.0"
17
+ "@1001-digital/styles": "^1.2.0"
18
18
  },
19
19
  "dependencies": {
20
20
  "@iconify/vue": "^5.0.0",
@@ -66,10 +66,7 @@
66
66
  </section>
67
67
  </ToastRoot>
68
68
 
69
- <ToastViewport
70
- class="toast-viewport"
71
- :class="[position]"
72
- />
69
+ <ToastViewport class="toast-viewport" />
73
70
  </ToastProvider>
74
71
 
75
72
  </template>
@@ -94,12 +91,10 @@ withDefaults(
94
91
  defineProps<{
95
92
  duration?: number
96
93
  swipeDirection?: 'right' | 'left' | 'up' | 'down'
97
- position?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left'
98
94
  }>(),
99
95
  {
100
96
  duration: 5_000,
101
97
  swipeDirection: 'right',
102
- position: 'bottom-right',
103
98
  },
104
99
  )
105
100
 
@@ -114,6 +109,7 @@ const onClose = (id: string) => {
114
109
  @layer components {
115
110
  :deep(.toast-viewport) {
116
111
  position: fixed;
112
+ inset: var(--toast-inset);
117
113
  z-index: var(--z-index-toast);
118
114
  display: flex;
119
115
  flex-direction: column;
@@ -123,26 +119,6 @@ const onClose = (id: string) => {
123
119
  list-style: none;
124
120
  max-width: 100vw;
125
121
  outline: none;
126
-
127
- &.bottom-right {
128
- bottom: 0;
129
- right: 0;
130
- }
131
-
132
- &.bottom-left {
133
- bottom: 0;
134
- left: 0;
135
- }
136
-
137
- &.top-right {
138
- top: 0;
139
- right: 0;
140
- }
141
-
142
- &.top-left {
143
- top: 0;
144
- left: 0;
145
- }
146
122
  }
147
123
 
148
124
  :deep(.toast) {