@djcali570/component-lib 0.1.99 → 0.1.101
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/README.md +10 -0
- package/dist/ContextMenu5.svelte +13 -4
- package/dist/ContextMenu5.svelte.d.ts +2 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# Svelte Component library
|
|
2
2
|
|
|
3
|
+
0.1.101
|
|
4
|
+
|
|
5
|
+
- Added props to context menu:
|
|
6
|
+
- border radius
|
|
7
|
+
- hide overflow
|
|
8
|
+
|
|
9
|
+
0.1.100
|
|
10
|
+
|
|
11
|
+
- Removed padding from context menu content container.
|
|
12
|
+
|
|
3
13
|
0.1.99
|
|
4
14
|
|
|
5
15
|
- Updated Context Menu to use an on open change callback. (Useful for multiple menus using same open state)
|
package/dist/ContextMenu5.svelte
CHANGED
|
@@ -26,7 +26,9 @@
|
|
|
26
26
|
menuAlign = 'right',
|
|
27
27
|
open = $bindable(),
|
|
28
28
|
onOpenChange,
|
|
29
|
-
iconSize = '20px'
|
|
29
|
+
iconSize = '20px',
|
|
30
|
+
borderRadius = '0.5rem',
|
|
31
|
+
hideOverflow = true
|
|
30
32
|
}: {
|
|
31
33
|
icon?: Snippet;
|
|
32
34
|
content: Snippet;
|
|
@@ -36,6 +38,8 @@
|
|
|
36
38
|
open?: boolean;
|
|
37
39
|
onOpenChange?: (open: boolean) => void;
|
|
38
40
|
iconSize?: string;
|
|
41
|
+
borderRadius?: string;
|
|
42
|
+
hideOverflow?: boolean;
|
|
39
43
|
} = $props();
|
|
40
44
|
|
|
41
45
|
// Default colors
|
|
@@ -165,17 +169,19 @@
|
|
|
165
169
|
bind:this={menuEl}
|
|
166
170
|
role="menu"
|
|
167
171
|
class="context5__menu context5__portal"
|
|
172
|
+
class:overflow-hidden={hideOverflow}
|
|
168
173
|
style="
|
|
169
174
|
left:{menuAlign === 'right' ? position.x + position.width : position.x}px;
|
|
170
175
|
top:{position.y}px;
|
|
171
176
|
--context5__ContentBgColor: {colorScheme.contentBgColor};
|
|
172
177
|
--context5__ContentBorderColor: {colorScheme.contentBorderColor};
|
|
178
|
+
--context5__BorderRadius: {borderRadius};
|
|
173
179
|
"
|
|
174
180
|
class:right={menuAlign === 'right'}
|
|
175
181
|
class:left={menuAlign === 'left'}
|
|
176
182
|
transition:fly={{ y: 8 }}
|
|
177
183
|
>
|
|
178
|
-
<div class="context5__content">
|
|
184
|
+
<div class="context5__content" style="overflow: {hideOverflow ? 'hidden' : 'visible'}">
|
|
179
185
|
{@render content()}
|
|
180
186
|
</div>
|
|
181
187
|
</div>
|
|
@@ -235,8 +241,11 @@ top:{position.y}px;
|
|
|
235
241
|
|
|
236
242
|
.context5__content {
|
|
237
243
|
background-color: var(--context5__ContentBgColor);
|
|
238
|
-
border-radius:
|
|
239
|
-
padding: 0.5rem;
|
|
244
|
+
border-radius: var(--context5__BorderRadius);
|
|
240
245
|
border: 1px solid var(--context5__ContentBorderColor);
|
|
241
246
|
}
|
|
247
|
+
|
|
248
|
+
.context5__menu.overflow-hidden {
|
|
249
|
+
overflow: hidden;
|
|
250
|
+
}
|
|
242
251
|
</style>
|
|
@@ -9,6 +9,8 @@ type $$ComponentProps = {
|
|
|
9
9
|
open?: boolean;
|
|
10
10
|
onOpenChange?: (open: boolean) => void;
|
|
11
11
|
iconSize?: string;
|
|
12
|
+
borderRadius?: string;
|
|
13
|
+
hideOverflow?: boolean;
|
|
12
14
|
};
|
|
13
15
|
declare const ContextMenu5: import("svelte").Component<$$ComponentProps, {}, "open">;
|
|
14
16
|
type ContextMenu5 = ReturnType<typeof ContextMenu5>;
|