@finsweet/webflow-apps-utils 1.0.15 → 1.0.16
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/dist/ui/components/button/Button.svelte +1 -1
- package/dist/ui/components/controlled-buttons/ControlledButtons.svelte +3 -0
- package/dist/ui/components/section/Section.svelte +2 -1
- package/dist/ui/components/text/Text.stories.svelte +2 -1
- package/dist/ui/components/text/Text.svelte +1 -0
- package/dist/ui/components/tooltip/Tooltip.svelte +7 -0
- package/package.json +1 -1
|
@@ -23,6 +23,7 @@
|
|
|
23
23
|
listener={button.popupTrigger || 'click'}
|
|
24
24
|
listenerout={button.popupTrigger || 'click'}
|
|
25
25
|
width="210px"
|
|
26
|
+
stopPropagation={false}
|
|
26
27
|
>
|
|
27
28
|
{#snippet target()}
|
|
28
29
|
<Button
|
|
@@ -84,6 +85,7 @@
|
|
|
84
85
|
placement={button.tooltip?.placement || 'top'}
|
|
85
86
|
offsetVal={10}
|
|
86
87
|
showArrow={button.tooltip?.showArrow !== false}
|
|
88
|
+
stopPropagation={false}
|
|
87
89
|
>
|
|
88
90
|
{#snippet target()}
|
|
89
91
|
<Button
|
|
@@ -186,6 +188,7 @@
|
|
|
186
188
|
min-width: 150px;
|
|
187
189
|
background: var(--background);
|
|
188
190
|
border-radius: 4px;
|
|
191
|
+
width: 100%;
|
|
189
192
|
}
|
|
190
193
|
.popup-content-icon {
|
|
191
194
|
display: flex;
|
|
@@ -187,13 +187,14 @@
|
|
|
187
187
|
message={defaultDisabledMessage}
|
|
188
188
|
width={disabledTooltipWidth}
|
|
189
189
|
class="not-allowed"
|
|
190
|
+
stopPropagation={false}
|
|
190
191
|
>
|
|
191
192
|
{#snippet target()}
|
|
192
193
|
{@render sectionContent()}
|
|
193
194
|
{/snippet}
|
|
194
195
|
</Tooltip>
|
|
195
196
|
{:else if shouldShowTooltip}
|
|
196
|
-
<Tooltip {...tooltip}>
|
|
197
|
+
<Tooltip {...tooltip} stopPropagation={false}>
|
|
197
198
|
{#snippet target()}
|
|
198
199
|
{@render sectionContent()}
|
|
199
200
|
{/snippet}
|
|
@@ -227,7 +227,8 @@
|
|
|
227
227
|
active: true,
|
|
228
228
|
title: 'Remove',
|
|
229
229
|
subtitle: 'Alt + click',
|
|
230
|
-
description: 'This will remove the current selection.'
|
|
230
|
+
description: 'This will remove the current selection.',
|
|
231
|
+
onclick: () => console.log('Popup action clicked')
|
|
231
232
|
}
|
|
232
233
|
}}
|
|
233
234
|
/>
|
|
@@ -12,6 +12,8 @@
|
|
|
12
12
|
import { writable } from 'svelte/store';
|
|
13
13
|
import { v4 as uuidv4 } from 'uuid';
|
|
14
14
|
|
|
15
|
+
import { TooltipInfoCircleFilled } from '../../icons';
|
|
16
|
+
import ToolTipInfoCircleIcon from '../../icons/ToolTipInfoCircleIcon.svelte';
|
|
15
17
|
import { cleanupTooltipMessage } from '../../../utils';
|
|
16
18
|
|
|
17
19
|
import Text from '../text/Text.svelte';
|
|
@@ -303,6 +305,8 @@
|
|
|
303
305
|
}
|
|
304
306
|
});
|
|
305
307
|
|
|
308
|
+
let isClickTarget = $state(listener === 'click' && listenerout === 'click');
|
|
309
|
+
|
|
306
310
|
const formattedMessage = $derived(cleanupTooltipMessage(message));
|
|
307
311
|
|
|
308
312
|
onMount(async () => {
|
|
@@ -334,6 +338,9 @@
|
|
|
334
338
|
<div class="target" bind:this={targetElement} aria-describedby={tooltipId}>
|
|
335
339
|
{#if target}
|
|
336
340
|
{@render target()}
|
|
341
|
+
{:else}
|
|
342
|
+
<!-- Default target for Demo only -->
|
|
343
|
+
<Text link label={isClickTarget ? 'Click me' : 'Hover me'} />
|
|
337
344
|
{/if}
|
|
338
345
|
|
|
339
346
|
<div
|