ui-ingredients 0.0.25 → 0.0.26
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +1 -1
- package/dist/accordion/item-content.svelte +14 -7
- package/dist/accordion/item-indicator.svelte +14 -7
- package/dist/accordion/item-trigger.svelte +13 -6
- package/dist/accordion/item.svelte +11 -6
- package/dist/accordion/root.svelte +12 -4
- package/dist/avatar/fallback.svelte +14 -7
- package/dist/avatar/image.svelte +11 -4
- package/dist/avatar/root.svelte +11 -13
- package/dist/carousel/indicator-group.svelte +14 -7
- package/dist/carousel/indicator.svelte +13 -6
- package/dist/carousel/item-group.svelte +14 -7
- package/dist/carousel/item.svelte +12 -8
- package/dist/carousel/next-trigger.svelte +13 -6
- package/dist/carousel/prev-trigger.svelte +13 -6
- package/dist/carousel/root.svelte +11 -5
- package/dist/carousel/viewport.svelte +14 -7
- package/dist/checkbox/control.svelte +14 -7
- package/dist/checkbox/hidden-input.svelte +1 -1
- package/dist/checkbox/indicator.svelte +14 -7
- package/dist/checkbox/label.svelte +14 -7
- package/dist/checkbox/root.svelte +12 -4
- package/dist/clipboard/control.svelte +14 -7
- package/dist/clipboard/indicator.svelte +14 -7
- package/dist/clipboard/input.svelte +11 -4
- package/dist/clipboard/label.svelte +14 -6
- package/dist/clipboard/root.svelte +13 -5
- package/dist/clipboard/trigger.svelte +13 -6
- package/dist/collapsible/content.svelte +14 -7
- package/dist/collapsible/root.svelte +14 -6
- package/dist/collapsible/trigger.svelte +13 -6
- package/dist/color-picker/area-background.svelte +21 -0
- package/dist/color-picker/area-background.svelte.d.ts +18 -0
- package/dist/color-picker/area-thumb.svelte +21 -0
- package/dist/color-picker/area-thumb.svelte.d.ts +18 -0
- package/dist/color-picker/area.svelte +27 -0
- package/dist/color-picker/area.svelte.d.ts +18 -0
- package/dist/color-picker/channel-input.svelte +28 -0
- package/dist/color-picker/channel-input.svelte.d.ts +18 -0
- package/dist/color-picker/channel-slider-label.svelte +25 -0
- package/dist/color-picker/channel-slider-label.svelte.d.ts +18 -0
- package/dist/color-picker/channel-slider-thumb.svelte +23 -0
- package/dist/color-picker/channel-slider-thumb.svelte.d.ts +18 -0
- package/dist/color-picker/channel-slider-track.svelte +23 -0
- package/dist/color-picker/channel-slider-track.svelte.d.ts +18 -0
- package/dist/color-picker/channel-slider-value-text.svelte +29 -0
- package/dist/color-picker/channel-slider-value-text.svelte.d.ts +18 -0
- package/dist/color-picker/channel-slider.svelte +29 -0
- package/dist/color-picker/channel-slider.svelte.d.ts +18 -0
- package/dist/color-picker/color-picker.d.ts +26 -0
- package/dist/color-picker/color-picker.js +26 -0
- package/dist/color-picker/content.svelte +20 -0
- package/dist/color-picker/content.svelte.d.ts +18 -0
- package/dist/color-picker/context.svelte.d.ts +8 -0
- package/dist/color-picker/context.svelte.js +6 -0
- package/dist/color-picker/control.svelte +20 -0
- package/dist/color-picker/control.svelte.d.ts +18 -0
- package/dist/color-picker/create-color-picker.svelte.d.ts +9 -0
- package/dist/color-picker/create-color-picker.svelte.js +20 -0
- package/dist/color-picker/eye-dropper-trigger.svelte +20 -0
- package/dist/color-picker/eye-dropper-trigger.svelte.d.ts +18 -0
- package/dist/color-picker/format-select.svelte +28 -0
- package/dist/color-picker/format-select.svelte.d.ts +18 -0
- package/dist/color-picker/format-trigger.svelte +20 -0
- package/dist/color-picker/format-trigger.svelte.d.ts +18 -0
- package/dist/color-picker/hidden-input.svelte +18 -0
- package/dist/color-picker/hidden-input.svelte.d.ts +18 -0
- package/dist/color-picker/index.d.ts +26 -0
- package/dist/color-picker/index.js +1 -0
- package/dist/color-picker/label.svelte +20 -0
- package/dist/color-picker/label.svelte.d.ts +18 -0
- package/dist/color-picker/positioner.svelte +20 -0
- package/dist/color-picker/positioner.svelte.d.ts +18 -0
- package/dist/color-picker/root.svelte +75 -0
- package/dist/color-picker/root.svelte.d.ts +18 -0
- package/dist/color-picker/swatch-group.svelte +20 -0
- package/dist/color-picker/swatch-group.svelte.d.ts +18 -0
- package/dist/color-picker/swatch-indicator.svelte +21 -0
- package/dist/color-picker/swatch-indicator.svelte.d.ts +18 -0
- package/dist/color-picker/swatch-trigger.svelte +31 -0
- package/dist/color-picker/swatch-trigger.svelte.d.ts +18 -0
- package/dist/color-picker/swatch.svelte +27 -0
- package/dist/color-picker/swatch.svelte.d.ts +18 -0
- package/dist/color-picker/transparency-grid.svelte +29 -0
- package/dist/color-picker/transparency-grid.svelte.d.ts +18 -0
- package/dist/color-picker/trigger.svelte +20 -0
- package/dist/color-picker/trigger.svelte.d.ts +18 -0
- package/dist/color-picker/value-text.svelte +24 -0
- package/dist/color-picker/value-text.svelte.d.ts +18 -0
- package/dist/combobox/clear-trigger.svelte +13 -6
- package/dist/combobox/content.svelte +14 -7
- package/dist/combobox/control.svelte +14 -7
- package/dist/combobox/input.svelte +11 -4
- package/dist/combobox/item-group-label.svelte +14 -7
- package/dist/combobox/item-group.svelte +14 -8
- package/dist/combobox/item-indicator.svelte +14 -7
- package/dist/combobox/item-text.svelte +18 -11
- package/dist/combobox/item.svelte +11 -6
- package/dist/combobox/label.svelte +13 -6
- package/dist/combobox/list.svelte +14 -7
- package/dist/combobox/positioner.svelte +14 -7
- package/dist/combobox/root.svelte +11 -5
- package/dist/combobox/trigger.svelte +13 -6
- package/dist/date-picker/clear-trigger.svelte +13 -6
- package/dist/date-picker/content.svelte +14 -7
- package/dist/date-picker/control.svelte +14 -7
- package/dist/date-picker/create-date-picker.svelte.d.ts +2 -0
- package/dist/date-picker/create-date-picker.svelte.js +11 -1
- package/dist/date-picker/day-table-cell-trigger.svelte +13 -6
- package/dist/date-picker/day-table-cell.svelte +12 -13
- package/dist/date-picker/input.svelte +11 -4
- package/dist/date-picker/label.svelte +13 -6
- package/dist/date-picker/month-select.svelte +19 -12
- package/dist/date-picker/month-table-cell-trigger.svelte +13 -6
- package/dist/date-picker/month-table-cell.svelte +12 -13
- package/dist/date-picker/next-trigger.svelte +13 -6
- package/dist/date-picker/positioner.svelte +14 -7
- package/dist/date-picker/preset-trigger.svelte +14 -6
- package/dist/date-picker/prev-trigger.svelte +13 -6
- package/dist/date-picker/range-text.svelte +18 -11
- package/dist/date-picker/root.svelte +13 -5
- package/dist/date-picker/table-body.svelte +14 -7
- package/dist/date-picker/table-head.svelte +14 -7
- package/dist/date-picker/table-header.svelte +14 -7
- package/dist/date-picker/table-row.svelte +14 -7
- package/dist/date-picker/table.svelte +14 -8
- package/dist/date-picker/trigger.svelte +13 -6
- package/dist/date-picker/view-control.svelte +14 -7
- package/dist/date-picker/view-trigger.svelte +13 -6
- package/dist/date-picker/view.svelte +22 -9
- package/dist/date-picker/year-select.svelte +19 -12
- package/dist/date-picker/year-table-cell-trigger.svelte +13 -6
- package/dist/date-picker/year-table-cell.svelte +12 -13
- package/dist/dialog/backdrop.svelte +14 -7
- package/dist/dialog/close-trigger.svelte +13 -6
- package/dist/dialog/content.svelte +14 -7
- package/dist/dialog/description.svelte +14 -7
- package/dist/dialog/positioner.svelte +14 -7
- package/dist/dialog/title.svelte +14 -7
- package/dist/dialog/trigger.svelte +13 -6
- package/dist/editable/area.svelte +14 -7
- package/dist/editable/cancel-trigger.svelte +13 -6
- package/dist/editable/control.svelte +14 -7
- package/dist/editable/edit-trigger.svelte +13 -6
- package/dist/editable/input.svelte +11 -4
- package/dist/editable/label.svelte +13 -6
- package/dist/editable/preview.svelte +18 -11
- package/dist/editable/submit-trigger.svelte +13 -6
- package/dist/file-upload/dropzone.svelte +14 -7
- package/dist/file-upload/hidden-input.svelte +1 -1
- package/dist/file-upload/item-delete-trigger.svelte +13 -6
- package/dist/file-upload/item-group.svelte +14 -7
- package/dist/file-upload/item-name.svelte +18 -11
- package/dist/file-upload/item-preview-image.svelte +11 -4
- package/dist/file-upload/item-preview.svelte +14 -7
- package/dist/file-upload/item-size-text.svelte +18 -11
- package/dist/file-upload/item.svelte +14 -7
- package/dist/file-upload/label.svelte +13 -6
- package/dist/file-upload/root.svelte +1 -1
- package/dist/file-upload/trigger.svelte +13 -6
- package/dist/hover-card/arrow-tip.svelte +14 -7
- package/dist/hover-card/arrow.svelte +14 -7
- package/dist/hover-card/content.svelte +14 -7
- package/dist/hover-card/positioner.svelte +14 -7
- package/dist/hover-card/trigger.svelte +14 -7
- package/dist/index.d.ts +2 -0
- package/dist/index.js +2 -0
- package/dist/menu/arrow-tip.svelte +14 -7
- package/dist/menu/arrow.svelte +14 -7
- package/dist/menu/content.svelte +14 -7
- package/dist/menu/context-trigger.svelte +13 -6
- package/dist/menu/indicator.svelte +14 -7
- package/dist/menu/item-group-label.svelte +14 -7
- package/dist/menu/item-group.svelte +15 -9
- package/dist/menu/item.svelte +1 -1
- package/dist/menu/option-item-indicator.svelte +14 -7
- package/dist/menu/option-item-text.svelte +18 -11
- package/dist/menu/option-item.svelte +11 -5
- package/dist/menu/positioner.svelte +14 -7
- package/dist/menu/separator.svelte +14 -7
- package/dist/menu/trigger-item.svelte +14 -7
- package/dist/menu/trigger.svelte +14 -7
- package/dist/number-input/control.svelte +14 -7
- package/dist/number-input/decrement-trigger.svelte +13 -6
- package/dist/number-input/increment-trigger.svelte +14 -7
- package/dist/number-input/input.svelte +11 -4
- package/dist/number-input/label.svelte +13 -6
- package/dist/number-input/root.svelte +13 -5
- package/dist/number-input/scrubber.svelte +14 -7
- package/dist/pagination/ellipsis.svelte +14 -7
- package/dist/pagination/item.svelte +13 -6
- package/dist/pagination/next-trigger.svelte +13 -6
- package/dist/pagination/prev-trigger.svelte +13 -6
- package/dist/pagination/root.svelte +13 -5
- package/dist/pin-input/anatomy.js +3 -0
- package/dist/pin-input/clear-trigger.svelte +18 -12
- package/dist/pin-input/create-pin-input.svelte.d.ts +2 -0
- package/dist/pin-input/create-pin-input.svelte.js +13 -1
- package/dist/pin-input/hidden-input.svelte +1 -1
- package/dist/pin-input/input.svelte +11 -4
- package/dist/pin-input/label.svelte +13 -6
- package/dist/pin-input/pin-input.d.ts +1 -1
- package/dist/pin-input/pin-input.js +1 -1
- package/dist/pin-input/root.svelte +11 -5
- package/dist/popover/arrow-tip.svelte +14 -7
- package/dist/popover/arrow.svelte +14 -7
- package/dist/popover/close-trigger.svelte +13 -6
- package/dist/popover/content.svelte +14 -7
- package/dist/popover/description.svelte +14 -7
- package/dist/popover/positioner.svelte +14 -7
- package/dist/popover/title.svelte +14 -7
- package/dist/popover/trigger.svelte +13 -6
- package/dist/presence/context.svelte.d.ts +3 -0
- package/dist/presence/context.svelte.js +2 -0
- package/dist/presence/create-presence.svelte.d.ts +11 -4
- package/dist/presence/create-presence.svelte.js +19 -3
- package/dist/presence/root.svelte +9 -9
- package/dist/presence/root.svelte.d.ts +1 -1
- package/dist/progress/circle-range.svelte +13 -6
- package/dist/progress/circle-track.svelte +13 -6
- package/dist/progress/circle.svelte +13 -6
- package/dist/progress/label.svelte +14 -7
- package/dist/progress/range.svelte +14 -7
- package/dist/progress/root.svelte +11 -5
- package/dist/progress/track.svelte +14 -7
- package/dist/progress/value-text.svelte +18 -11
- package/dist/progress/view.svelte +14 -7
- package/dist/qr-code/frame.svelte +13 -6
- package/dist/qr-code/overlay.svelte +14 -7
- package/dist/qr-code/pattern.svelte +13 -6
- package/dist/qr-code/root.svelte +11 -5
- package/dist/radio-group/indicator.svelte +14 -7
- package/dist/radio-group/item-control.svelte +14 -7
- package/dist/radio-group/item-hidden-input.svelte +1 -1
- package/dist/radio-group/item-text.svelte +14 -7
- package/dist/radio-group/item.svelte +10 -12
- package/dist/radio-group/label.svelte +14 -7
- package/dist/radio-group/root.svelte +13 -5
- package/dist/rating-group/control.svelte +16 -9
- package/dist/rating-group/hidden-input.svelte +1 -1
- package/dist/rating-group/item.svelte +14 -9
- package/dist/rating-group/label.svelte +15 -8
- package/dist/rating-group/root.svelte +17 -9
- package/dist/segment-group/indicator.svelte +14 -8
- package/dist/segment-group/item-control.svelte +15 -8
- package/dist/segment-group/item-hidden-input.svelte +1 -1
- package/dist/segment-group/item-text.svelte +14 -8
- package/dist/segment-group/item.svelte +10 -5
- package/dist/segment-group/label.svelte +14 -8
- package/dist/segment-group/root.svelte +13 -6
- package/dist/select/clear-trigger.svelte +13 -6
- package/dist/select/content.svelte +14 -7
- package/dist/select/control.svelte +14 -7
- package/dist/select/hidden-select.svelte +1 -1
- package/dist/select/indicator.svelte +14 -7
- package/dist/select/item-group-label.svelte +14 -7
- package/dist/select/item-group.svelte +14 -8
- package/dist/select/item-indicator.svelte +14 -7
- package/dist/select/item-text.svelte +18 -11
- package/dist/select/item.svelte +11 -6
- package/dist/select/label.svelte +13 -6
- package/dist/select/list.svelte +14 -7
- package/dist/select/positioner.svelte +14 -7
- package/dist/select/root.svelte +12 -6
- package/dist/select/trigger.svelte +13 -6
- package/dist/select/value-text.svelte +20 -13
- package/dist/signature-pad/clear-trigger.svelte +14 -7
- package/dist/signature-pad/control.svelte +14 -7
- package/dist/signature-pad/current-segment-path.svelte +13 -6
- package/dist/signature-pad/guide.svelte +14 -7
- package/dist/signature-pad/hidden-input.svelte +1 -1
- package/dist/signature-pad/label.svelte +13 -6
- package/dist/signature-pad/root.svelte +13 -5
- package/dist/signature-pad/segment-path.svelte +13 -6
- package/dist/signature-pad/segment.svelte +13 -6
- package/dist/slider/control.svelte +14 -7
- package/dist/slider/hidden-input.svelte +1 -1
- package/dist/slider/label.svelte +13 -6
- package/dist/slider/marker-group.svelte +14 -7
- package/dist/slider/marker.svelte +14 -7
- package/dist/slider/range.svelte +14 -7
- package/dist/slider/root.svelte +11 -5
- package/dist/slider/thumb.svelte +14 -7
- package/dist/slider/track.svelte +14 -7
- package/dist/slider/value-text.svelte +18 -11
- package/dist/splitter/panel.svelte +14 -7
- package/dist/splitter/resize-trigger.svelte +11 -6
- package/dist/splitter/root.svelte +11 -5
- package/dist/steps/completed-content.svelte +14 -7
- package/dist/steps/content.svelte +14 -7
- package/dist/steps/indicator.svelte +14 -7
- package/dist/steps/item.svelte +11 -6
- package/dist/steps/list.svelte +15 -7
- package/dist/steps/next-trigger.svelte +13 -6
- package/dist/steps/prev-trigger.svelte +13 -6
- package/dist/steps/progress.svelte +14 -7
- package/dist/steps/root.svelte +12 -6
- package/dist/steps/separator.svelte +14 -7
- package/dist/steps/trigger.svelte +13 -6
- package/dist/switch/control.svelte +14 -7
- package/dist/switch/hidden-input.svelte +1 -1
- package/dist/switch/label.svelte +14 -7
- package/dist/switch/root.svelte +10 -4
- package/dist/switch/thumb.svelte +14 -7
- package/dist/tabs/content.svelte +14 -7
- package/dist/tabs/list.svelte +14 -7
- package/dist/tabs/root.svelte +12 -6
- package/dist/tabs/trigger.svelte +13 -6
- package/dist/tags-input/clear-trigger.svelte +13 -6
- package/dist/tags-input/control.svelte +14 -7
- package/dist/tags-input/hidden-input.svelte +1 -1
- package/dist/tags-input/input.svelte +11 -4
- package/dist/tags-input/item-delete-trigger.svelte +13 -6
- package/dist/tags-input/item-input.svelte +12 -4
- package/dist/tags-input/item-preview.svelte +14 -7
- package/dist/tags-input/item-text.svelte +14 -7
- package/dist/tags-input/item.svelte +11 -13
- package/dist/tags-input/label.svelte +13 -6
- package/dist/tags-input/root.svelte +14 -6
- package/dist/time-picker/clear-trigger.svelte +13 -6
- package/dist/time-picker/column.svelte +14 -7
- package/dist/time-picker/content.svelte +14 -7
- package/dist/time-picker/control.svelte +14 -7
- package/dist/time-picker/hour-cell.svelte +14 -7
- package/dist/time-picker/input.svelte +11 -4
- package/dist/time-picker/label.svelte +13 -6
- package/dist/time-picker/minute-cell.svelte +14 -7
- package/dist/time-picker/period-cell.svelte +15 -7
- package/dist/time-picker/positioner.svelte +14 -7
- package/dist/time-picker/root.svelte +13 -5
- package/dist/time-picker/second-cell.svelte +14 -7
- package/dist/time-picker/spacer.svelte +14 -7
- package/dist/time-picker/trigger.svelte +13 -6
- package/dist/timer/action-trigger.svelte +13 -7
- package/dist/timer/item-label.svelte +14 -7
- package/dist/timer/item-value.svelte +18 -11
- package/dist/timer/item.svelte +14 -7
- package/dist/timer/root.svelte +11 -5
- package/dist/timer/separator.svelte +14 -7
- package/dist/toast/action-trigger.svelte +13 -6
- package/dist/toast/actor.svelte +6 -6
- package/dist/toast/actor.svelte.d.ts +3 -3
- package/dist/toast/close-trigger.svelte +13 -6
- package/dist/toast/description.svelte +18 -11
- package/dist/toast/root.svelte +16 -14
- package/dist/toast/title.svelte +18 -11
- package/dist/toast/toaster.svelte +3 -2
- package/dist/toggle-group/item.svelte +10 -5
- package/dist/toggle-group/root.svelte +14 -6
- package/dist/tooltip/arrow-tip.svelte +14 -7
- package/dist/tooltip/arrow.svelte +14 -7
- package/dist/tooltip/content.svelte +14 -7
- package/dist/tooltip/positioner.svelte +14 -7
- package/dist/tooltip/trigger.svelte +13 -6
- package/dist/tree-view/branch-content.svelte +14 -7
- package/dist/tree-view/branch-control.svelte +14 -7
- package/dist/tree-view/branch-indicator.svelte +14 -7
- package/dist/tree-view/branch-text.svelte +14 -7
- package/dist/tree-view/branch-trigger.svelte +14 -7
- package/dist/tree-view/branch.svelte +11 -13
- package/dist/tree-view/item-indicator.svelte +14 -7
- package/dist/tree-view/item-text.svelte +14 -7
- package/dist/tree-view/item.svelte +11 -13
- package/dist/tree-view/label.svelte +14 -7
- package/dist/tree-view/root.svelte +12 -6
- package/dist/tree-view/tree.svelte +14 -7
- package/dist/types.d.ts +2 -1
- package/dist/utils.svelte.d.ts +2 -5
- package/dist/utils.svelte.js +9 -9
- package/package.json +4 -3
- package/dist/color-picker/.gitkeep +0 -0
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const ChannelSliderLabel: $$__sveltets_2_IsomorphicComponent<ColorPickerChannelSliderLabelProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type ChannelSliderLabel = InstanceType<typeof ChannelSliderLabel>;
|
18
|
+
export default ChannelSliderLabel;
|
@@ -0,0 +1,23 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {HtmlProps} from '../types.js';
|
3
|
+
|
4
|
+
export interface ColorPickerChannelSliderThumbProps extends HtmlProps<'div'> {}
|
5
|
+
</script>
|
6
|
+
|
7
|
+
<script lang="ts">
|
8
|
+
import {mergeProps} from '../utils.svelte.js';
|
9
|
+
import {colorPickerChannelSliderPropsContext, colorPickerContext} from './context.svelte.js';
|
10
|
+
|
11
|
+
let {children, ...props}: ColorPickerChannelSliderThumbProps = $props();
|
12
|
+
|
13
|
+
let colorPicker = colorPickerContext.get();
|
14
|
+
let channelSliderProps = colorPickerChannelSliderPropsContext.get();
|
15
|
+
|
16
|
+
let attrs = $derived(
|
17
|
+
mergeProps(props, colorPicker.getChannelSliderThumbProps(channelSliderProps)),
|
18
|
+
);
|
19
|
+
</script>
|
20
|
+
|
21
|
+
<div {...attrs}>
|
22
|
+
{@render children?.()}
|
23
|
+
</div>
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const ChannelSliderThumb: $$__sveltets_2_IsomorphicComponent<ColorPickerChannelSliderThumbProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type ChannelSliderThumb = InstanceType<typeof ChannelSliderThumb>;
|
18
|
+
export default ChannelSliderThumb;
|
@@ -0,0 +1,23 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {HtmlProps} from '../types.js';
|
3
|
+
|
4
|
+
export interface ColorPickerChannelSliderTrackProps extends HtmlProps<'div'> {}
|
5
|
+
</script>
|
6
|
+
|
7
|
+
<script lang="ts">
|
8
|
+
import {mergeProps} from '../utils.svelte.js';
|
9
|
+
import {colorPickerChannelSliderPropsContext, colorPickerContext} from './context.svelte.js';
|
10
|
+
|
11
|
+
let {children, ...props}: ColorPickerChannelSliderTrackProps = $props();
|
12
|
+
|
13
|
+
let colorPicker = colorPickerContext.get();
|
14
|
+
let channelSliderProps = colorPickerChannelSliderPropsContext.get();
|
15
|
+
|
16
|
+
let attrs = $derived(
|
17
|
+
mergeProps(props, colorPicker.getChannelSliderTrackProps(channelSliderProps)),
|
18
|
+
);
|
19
|
+
</script>
|
20
|
+
|
21
|
+
<div {...attrs}>
|
22
|
+
{@render children?.()}
|
23
|
+
</div>
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const ChannelSliderTrack: $$__sveltets_2_IsomorphicComponent<ColorPickerChannelSliderTrackProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type ChannelSliderTrack = InstanceType<typeof ChannelSliderTrack>;
|
18
|
+
export default ChannelSliderTrack;
|
@@ -0,0 +1,29 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {HtmlProps} from '../types.js';
|
3
|
+
|
4
|
+
export interface ColorPickerChannelSliderValueTextProps extends HtmlProps<'div'> {}
|
5
|
+
</script>
|
6
|
+
|
7
|
+
<script lang="ts">
|
8
|
+
import {localeContext} from '../locale-provider/context.svelte.js';
|
9
|
+
import {mergeProps} from '../utils.svelte.js';
|
10
|
+
import {colorPickerChannelSliderPropsContext, colorPickerContext} from './context.svelte.js';
|
11
|
+
|
12
|
+
let {children, ...props}: ColorPickerChannelSliderValueTextProps = $props();
|
13
|
+
|
14
|
+
let locale = localeContext.get();
|
15
|
+
let colorPicker = colorPickerContext.get();
|
16
|
+
let channelSliderProps = colorPickerChannelSliderPropsContext.get();
|
17
|
+
|
18
|
+
let attrs = $derived(
|
19
|
+
mergeProps(props, colorPicker.getChannelSliderValueTextProps(channelSliderProps)),
|
20
|
+
);
|
21
|
+
</script>
|
22
|
+
|
23
|
+
<div {...attrs}>
|
24
|
+
{#if children}
|
25
|
+
{@render children()}
|
26
|
+
{:else}
|
27
|
+
{colorPicker.getChannelValueText(channelSliderProps.channel, locale.locale)}
|
28
|
+
{/if}
|
29
|
+
</div>
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const ChannelSliderValueText: $$__sveltets_2_IsomorphicComponent<ColorPickerChannelSliderValueTextProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type ChannelSliderValueText = InstanceType<typeof ChannelSliderValueText>;
|
18
|
+
export default ChannelSliderValueText;
|
@@ -0,0 +1,29 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {Assign, HtmlProps} from '../types.js';
|
3
|
+
import type {ChannelSliderProps} from '@zag-js/color-picker';
|
4
|
+
|
5
|
+
export interface ColorPickerChannelSliderProps
|
6
|
+
extends Assign<HtmlProps<'div'>, ChannelSliderProps> {}
|
7
|
+
</script>
|
8
|
+
|
9
|
+
<script lang="ts">
|
10
|
+
import {mergeProps} from '../utils.svelte.js';
|
11
|
+
import {colorPickerChannelSliderPropsContext, colorPickerContext} from './context.svelte.js';
|
12
|
+
|
13
|
+
let {format, channel, orientation, children, ...props}: ColorPickerChannelSliderProps = $props();
|
14
|
+
|
15
|
+
let colorPicker = colorPickerContext.get();
|
16
|
+
let channelSliderProps: ChannelSliderProps = $derived({
|
17
|
+
format,
|
18
|
+
channel,
|
19
|
+
orientation,
|
20
|
+
});
|
21
|
+
|
22
|
+
let attrs = $derived(mergeProps(props, colorPicker.getChannelSliderProps(channelSliderProps)));
|
23
|
+
|
24
|
+
colorPickerChannelSliderPropsContext.set(() => channelSliderProps);
|
25
|
+
</script>
|
26
|
+
|
27
|
+
<div {...attrs}>
|
28
|
+
{@render children?.()}
|
29
|
+
</div>
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const ChannelSlider: $$__sveltets_2_IsomorphicComponent<ColorPickerChannelSliderProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type ChannelSlider = InstanceType<typeof ChannelSlider>;
|
18
|
+
export default ChannelSlider;
|
@@ -0,0 +1,26 @@
|
|
1
|
+
export { anatomy, parse } from '@zag-js/color-picker';
|
2
|
+
export { default as AreaBackground } from './area-background.svelte';
|
3
|
+
export { default as AreaThumb } from './area-thumb.svelte';
|
4
|
+
export { default as Area } from './area.svelte';
|
5
|
+
export { default as ChannelInput } from './channel-input.svelte';
|
6
|
+
export { default as ChannelSliderLabel } from './channel-slider-label.svelte';
|
7
|
+
export { default as ChannelSliderThumb } from './channel-slider-thumb.svelte';
|
8
|
+
export { default as ChannelSliderTrack } from './channel-slider-track.svelte';
|
9
|
+
export { default as ChannelSliderValueText } from './channel-slider-value-text.svelte';
|
10
|
+
export { default as ChannelSlider } from './channel-slider.svelte';
|
11
|
+
export { default as Content } from './content.svelte';
|
12
|
+
export { default as Control } from './control.svelte';
|
13
|
+
export { default as EyeDropperTrigger } from './eye-dropper-trigger.svelte';
|
14
|
+
export { default as FormatSelect } from './format-select.svelte';
|
15
|
+
export { default as FormatTrigger } from './format-trigger.svelte';
|
16
|
+
export { default as HiddenInput } from './hidden-input.svelte';
|
17
|
+
export { default as Label } from './label.svelte';
|
18
|
+
export { default as Positioner } from './positioner.svelte';
|
19
|
+
export { default as Root } from './root.svelte';
|
20
|
+
export { default as SwatchGroup } from './swatch-group.svelte';
|
21
|
+
export { default as SwatchIndicator } from './swatch-indicator.svelte';
|
22
|
+
export { default as SwatchTrigger } from './swatch-trigger.svelte';
|
23
|
+
export { default as Swatch } from './swatch.svelte';
|
24
|
+
export { default as TransparencyGrid } from './transparency-grid.svelte';
|
25
|
+
export { default as Trigger } from './trigger.svelte';
|
26
|
+
export { default as ValueText } from './value-text.svelte';
|
@@ -0,0 +1,26 @@
|
|
1
|
+
export { anatomy, parse } from '@zag-js/color-picker';
|
2
|
+
export { default as AreaBackground } from './area-background.svelte';
|
3
|
+
export { default as AreaThumb } from './area-thumb.svelte';
|
4
|
+
export { default as Area } from './area.svelte';
|
5
|
+
export { default as ChannelInput } from './channel-input.svelte';
|
6
|
+
export { default as ChannelSliderLabel } from './channel-slider-label.svelte';
|
7
|
+
export { default as ChannelSliderThumb } from './channel-slider-thumb.svelte';
|
8
|
+
export { default as ChannelSliderTrack } from './channel-slider-track.svelte';
|
9
|
+
export { default as ChannelSliderValueText } from './channel-slider-value-text.svelte';
|
10
|
+
export { default as ChannelSlider } from './channel-slider.svelte';
|
11
|
+
export { default as Content } from './content.svelte';
|
12
|
+
export { default as Control } from './control.svelte';
|
13
|
+
export { default as EyeDropperTrigger } from './eye-dropper-trigger.svelte';
|
14
|
+
export { default as FormatSelect } from './format-select.svelte';
|
15
|
+
export { default as FormatTrigger } from './format-trigger.svelte';
|
16
|
+
export { default as HiddenInput } from './hidden-input.svelte';
|
17
|
+
export { default as Label } from './label.svelte';
|
18
|
+
export { default as Positioner } from './positioner.svelte';
|
19
|
+
export { default as Root } from './root.svelte';
|
20
|
+
export { default as SwatchGroup } from './swatch-group.svelte';
|
21
|
+
export { default as SwatchIndicator } from './swatch-indicator.svelte';
|
22
|
+
export { default as SwatchTrigger } from './swatch-trigger.svelte';
|
23
|
+
export { default as Swatch } from './swatch.svelte';
|
24
|
+
export { default as TransparencyGrid } from './transparency-grid.svelte';
|
25
|
+
export { default as Trigger } from './trigger.svelte';
|
26
|
+
export { default as ValueText } from './value-text.svelte';
|
@@ -0,0 +1,20 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {HtmlProps} from '../types.js';
|
3
|
+
|
4
|
+
export interface ColorPickerContentProps extends HtmlProps<'div'> {}
|
5
|
+
</script>
|
6
|
+
|
7
|
+
<script lang="ts">
|
8
|
+
import {mergeProps} from '../utils.svelte.js';
|
9
|
+
import {colorPickerContext} from './context.svelte.js';
|
10
|
+
|
11
|
+
let {children, ...props}: ColorPickerContentProps = $props();
|
12
|
+
|
13
|
+
let colorPicker = colorPickerContext.get();
|
14
|
+
|
15
|
+
let attrs = $derived(mergeProps(props, colorPicker.getContentProps()));
|
16
|
+
</script>
|
17
|
+
|
18
|
+
<div {...attrs}>
|
19
|
+
{@render children?.()}
|
20
|
+
</div>
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const Content: $$__sveltets_2_IsomorphicComponent<ColorPickerContentProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type Content = InstanceType<typeof Content>;
|
18
|
+
export default Content;
|
@@ -0,0 +1,8 @@
|
|
1
|
+
import { Context } from '../utils.svelte.js';
|
2
|
+
import type { AreaProps, ChannelProps, ChannelSliderProps, SwatchProps } from '@zag-js/color-picker';
|
3
|
+
import type { CreateColorPickerReturn } from './create-color-picker.svelte.js';
|
4
|
+
export declare const colorPickerContext: Context<CreateColorPickerReturn>;
|
5
|
+
export declare const colorPickerAreaPropsContext: Context<AreaProps>;
|
6
|
+
export declare const colorPickerSwatchPropsContext: Context<SwatchProps>;
|
7
|
+
export declare const colorPickerChannelPropsContext: Context<ChannelProps>;
|
8
|
+
export declare const colorPickerChannelSliderPropsContext: Context<ChannelSliderProps>;
|
@@ -0,0 +1,6 @@
|
|
1
|
+
import { Context } from '../utils.svelte.js';
|
2
|
+
export const colorPickerContext = new Context('ColorPicker');
|
3
|
+
export const colorPickerAreaPropsContext = new Context('ColorPickerArea');
|
4
|
+
export const colorPickerSwatchPropsContext = new Context('ColorPickerSwatch');
|
5
|
+
export const colorPickerChannelPropsContext = new Context('ColorPickerChannel');
|
6
|
+
export const colorPickerChannelSliderPropsContext = new Context('ColorPickerChannelSlider');
|
@@ -0,0 +1,20 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {HtmlProps} from '../types.js';
|
3
|
+
|
4
|
+
export interface ColorPickerControlProps extends HtmlProps<'div'> {}
|
5
|
+
</script>
|
6
|
+
|
7
|
+
<script lang="ts">
|
8
|
+
import {mergeProps} from '../utils.svelte.js';
|
9
|
+
import {colorPickerContext} from './context.svelte.js';
|
10
|
+
|
11
|
+
let {children, ...props}: ColorPickerControlProps = $props();
|
12
|
+
|
13
|
+
let colorPicker = colorPickerContext.get();
|
14
|
+
|
15
|
+
let attrs = $derived(mergeProps(props, colorPicker.getControlProps()));
|
16
|
+
</script>
|
17
|
+
|
18
|
+
<div {...attrs}>
|
19
|
+
{@render children?.()}
|
20
|
+
</div>
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const Control: $$__sveltets_2_IsomorphicComponent<ColorPickerControlProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type Control = InstanceType<typeof Control>;
|
18
|
+
export default Control;
|
@@ -0,0 +1,9 @@
|
|
1
|
+
import * as colorPicker from '@zag-js/color-picker';
|
2
|
+
export interface CreateColorPickerProps extends Omit<colorPicker.Context, 'id' | 'dir' | 'value' | 'getRootNode' | 'open.controlled'> {
|
3
|
+
id?: string | null;
|
4
|
+
value?: string;
|
5
|
+
defaultOpen?: boolean;
|
6
|
+
}
|
7
|
+
export interface CreateColorPickerReturn extends colorPicker.Api {
|
8
|
+
}
|
9
|
+
export declare function createColorPicker(props: CreateColorPickerProps): CreateColorPickerReturn;
|
@@ -0,0 +1,20 @@
|
|
1
|
+
import { getEnvironmentContext } from '../environment-provider/context.svelte.js';
|
2
|
+
import { getLocaleContext } from '../locale-provider/context.svelte.js';
|
3
|
+
import { createUniqueId } from '../utils.svelte.js';
|
4
|
+
import * as colorPicker from '@zag-js/color-picker';
|
5
|
+
import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
|
6
|
+
export function createColorPicker(props) {
|
7
|
+
const locale = getLocaleContext();
|
8
|
+
const environment = getEnvironmentContext();
|
9
|
+
const [state, send] = useMachine(colorPicker.machine({
|
10
|
+
...props,
|
11
|
+
id: props.id ?? createUniqueId(),
|
12
|
+
dir: locale?.dir,
|
13
|
+
open: props.defaultOpen,
|
14
|
+
value: props.value ? colorPicker.parse(props.value) : undefined,
|
15
|
+
getRootNode: environment?.getRootNode,
|
16
|
+
'open.controlled': props.open != null,
|
17
|
+
}));
|
18
|
+
const api = $derived(reflect(() => colorPicker.connect(state, send, normalizeProps)));
|
19
|
+
return api;
|
20
|
+
}
|
@@ -0,0 +1,20 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {HtmlProps} from '../types.js';
|
3
|
+
|
4
|
+
export interface ColorPickerEyeDropperTriggerProps extends HtmlProps<'button'> {}
|
5
|
+
</script>
|
6
|
+
|
7
|
+
<script lang="ts">
|
8
|
+
import {mergeProps} from '../utils.svelte.js';
|
9
|
+
import {colorPickerContext} from './context.svelte.js';
|
10
|
+
|
11
|
+
let {children, ...props}: ColorPickerEyeDropperTriggerProps = $props();
|
12
|
+
|
13
|
+
let colorPicker = colorPickerContext.get();
|
14
|
+
|
15
|
+
let attrs = $derived(mergeProps(props, colorPicker.getEyeDropperTriggerProps()));
|
16
|
+
</script>
|
17
|
+
|
18
|
+
<button type="button" {...attrs}>
|
19
|
+
{@render children?.()}
|
20
|
+
</button>
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const EyeDropperTrigger: $$__sveltets_2_IsomorphicComponent<ColorPickerEyeDropperTriggerProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type EyeDropperTrigger = InstanceType<typeof EyeDropperTrigger>;
|
18
|
+
export default EyeDropperTrigger;
|
@@ -0,0 +1,28 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {HtmlProps} from '../types.js';
|
3
|
+
|
4
|
+
export interface ColorPickerFormatSelectProps extends HtmlProps<'select'> {}
|
5
|
+
</script>
|
6
|
+
|
7
|
+
<script lang="ts">
|
8
|
+
import {mergeProps} from '../utils.svelte.js';
|
9
|
+
import {colorPickerContext} from './context.svelte.js';
|
10
|
+
|
11
|
+
let {children, ...props}: ColorPickerFormatSelectProps = $props();
|
12
|
+
|
13
|
+
let colorPicker = colorPickerContext.get();
|
14
|
+
|
15
|
+
let attrs = $derived(mergeProps(props, colorPicker.getFormatSelectProps()));
|
16
|
+
|
17
|
+
let formats = ['rgba', 'hsla', 'hsba'];
|
18
|
+
</script>
|
19
|
+
|
20
|
+
<select {...attrs}>
|
21
|
+
{#if children}
|
22
|
+
{@render children()}
|
23
|
+
{:else}
|
24
|
+
{#each formats as format}
|
25
|
+
<option value={format}>{format}</option>
|
26
|
+
{/each}
|
27
|
+
{/if}
|
28
|
+
</select>
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const FormatSelect: $$__sveltets_2_IsomorphicComponent<ColorPickerFormatSelectProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type FormatSelect = InstanceType<typeof FormatSelect>;
|
18
|
+
export default FormatSelect;
|
@@ -0,0 +1,20 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {HtmlProps} from '../types.js';
|
3
|
+
|
4
|
+
export interface ColorPickerFormatTriggerProps extends HtmlProps<'button'> {}
|
5
|
+
</script>
|
6
|
+
|
7
|
+
<script lang="ts">
|
8
|
+
import {mergeProps} from '../utils.svelte.js';
|
9
|
+
import {colorPickerContext} from './context.svelte.js';
|
10
|
+
|
11
|
+
let {children, ...props}: ColorPickerFormatTriggerProps = $props();
|
12
|
+
|
13
|
+
let colorPicker = colorPickerContext.get();
|
14
|
+
|
15
|
+
let attrs = $derived(mergeProps(props, colorPicker.getFormatTriggerProps()));
|
16
|
+
</script>
|
17
|
+
|
18
|
+
<button type="button" {...attrs}>
|
19
|
+
{@render children?.()}
|
20
|
+
</button>
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const FormatTrigger: $$__sveltets_2_IsomorphicComponent<ColorPickerFormatTriggerProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type FormatTrigger = InstanceType<typeof FormatTrigger>;
|
18
|
+
export default FormatTrigger;
|
@@ -0,0 +1,18 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {HtmlProps} from '../types.js';
|
3
|
+
|
4
|
+
export interface ColorPickerHiddenInputProps extends HtmlProps<'input'> {}
|
5
|
+
</script>
|
6
|
+
|
7
|
+
<script lang="ts">
|
8
|
+
import {mergeProps} from '../utils.svelte.js';
|
9
|
+
import {colorPickerContext} from './context.svelte.js';
|
10
|
+
|
11
|
+
let {...props}: ColorPickerHiddenInputProps = $props();
|
12
|
+
|
13
|
+
let colorPicker = colorPickerContext.get();
|
14
|
+
|
15
|
+
let attrs = $derived(mergeProps(props, colorPicker.getHiddenInputProps()));
|
16
|
+
</script>
|
17
|
+
|
18
|
+
<input {...attrs} />
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const HiddenInput: $$__sveltets_2_IsomorphicComponent<ColorPickerHiddenInputProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type HiddenInput = InstanceType<typeof HiddenInput>;
|
18
|
+
export default HiddenInput;
|
@@ -0,0 +1,26 @@
|
|
1
|
+
export * as ColorPicker from './color-picker.js';
|
2
|
+
export type { ColorPickerAreaBackgroundProps } from './area-background.svelte';
|
3
|
+
export type { ColorPickerAreaThumbProps } from './area-thumb.svelte';
|
4
|
+
export type { ColorPickerAreaProps } from './area.svelte';
|
5
|
+
export type { ColorPickerChannelInputProps } from './channel-input.svelte';
|
6
|
+
export type { ColorPickerChannelSliderLabelProps } from './channel-slider-label.svelte';
|
7
|
+
export type { ColorPickerChannelSliderThumbProps } from './channel-slider-thumb.svelte';
|
8
|
+
export type { ColorPickerChannelSliderTrackProps } from './channel-slider-track.svelte';
|
9
|
+
export type { ColorPickerChannelSliderValueTextProps } from './channel-slider-value-text.svelte';
|
10
|
+
export type { ColorPickerChannelSliderProps } from './channel-slider.svelte';
|
11
|
+
export type { ColorPickerContentProps } from './content.svelte';
|
12
|
+
export type { ColorPickerControlProps } from './control.svelte';
|
13
|
+
export type { ColorPickerEyeDropperTriggerProps } from './eye-dropper-trigger.svelte';
|
14
|
+
export type { ColorPickerFormatSelectProps } from './format-select.svelte';
|
15
|
+
export type { ColorPickerFormatTriggerProps } from './format-trigger.svelte';
|
16
|
+
export type { ColorPickerHiddenInputProps } from './hidden-input.svelte';
|
17
|
+
export type { ColorPickerLabelProps } from './label.svelte';
|
18
|
+
export type { ColorPickerPositionerProps } from './positioner.svelte';
|
19
|
+
export type { ColorPickerProps } from './root.svelte';
|
20
|
+
export type { ColorPickerSwatchGroupProps } from './swatch-group.svelte';
|
21
|
+
export type { ColorPickerSwatchIndicatorProps } from './swatch-indicator.svelte';
|
22
|
+
export type { ColorPickerSwatchTriggerProps } from './swatch-trigger.svelte';
|
23
|
+
export type { ColorPickerSwatchProps } from './swatch.svelte';
|
24
|
+
export type { ColorPickerTransparencyGridProps } from './transparency-grid.svelte';
|
25
|
+
export type { ColorPickerTriggerProps } from './trigger.svelte';
|
26
|
+
export type { ColorPickerValueTextProps } from './value-text.svelte';
|
@@ -0,0 +1 @@
|
|
1
|
+
export * as ColorPicker from './color-picker.js';
|
@@ -0,0 +1,20 @@
|
|
1
|
+
<script lang="ts" module>
|
2
|
+
import type {HtmlProps} from '../types.js';
|
3
|
+
|
4
|
+
export interface ColorPickerLabelProps extends HtmlProps<'label'> {}
|
5
|
+
</script>
|
6
|
+
|
7
|
+
<script lang="ts">
|
8
|
+
import {mergeProps} from '../utils.svelte.js';
|
9
|
+
import {colorPickerContext} from './context.svelte.js';
|
10
|
+
|
11
|
+
let {children, ...props}: ColorPickerLabelProps = $props();
|
12
|
+
|
13
|
+
let colorPicker = colorPickerContext.get();
|
14
|
+
|
15
|
+
let attrs = $derived(mergeProps(props, colorPicker.getLabelProps()));
|
16
|
+
</script>
|
17
|
+
|
18
|
+
<label {...attrs}>
|
19
|
+
{@render children?.()}
|
20
|
+
</label>
|
@@ -0,0 +1,18 @@
|
|
1
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
2
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
3
|
+
$$bindings?: Bindings;
|
4
|
+
} & Exports;
|
5
|
+
(internal: unknown, props: Props & {
|
6
|
+
$$events?: Events;
|
7
|
+
$$slots?: Slots;
|
8
|
+
}): Exports & {
|
9
|
+
$set?: any;
|
10
|
+
$on?: any;
|
11
|
+
};
|
12
|
+
z_$$bindings?: Bindings;
|
13
|
+
}
|
14
|
+
declare const Label: $$__sveltets_2_IsomorphicComponent<ColorPickerLabelProps, {
|
15
|
+
[evt: string]: CustomEvent<any>;
|
16
|
+
}, {}, {}, "">;
|
17
|
+
type Label = InstanceType<typeof Label>;
|
18
|
+
export default Label;
|