shoelace-react - npm Package Compare versions

Comparing version 1.4.0 to 1.5.0

components/carousel.d.ts

@@ -7,3 +7,6 @@ import type { ReactNode, HTMLAttributes, Ref } from "react";
 
-export type SlSlideChangeEventDetail = { index: number; slide: SlCarouselItem };
+export type SlCarouselSlideChangeEventDetail = {
+  index: number;
+  slide: SlCarouselItem;
+};
 export type SlCarouselSlideChangeEvent = SlSlideChangeEvent<
@@ -10,0 +13,0 @@ SlCarouselElement,

components/dialog.d.ts

@@ -19,3 +19,3 @@ import type { ReactNode, HTMLAttributes, Ref } from "react";
 export type SlDialogInitialFocusEvent = SlInitialFocusEvent<SlDialogElement>;
-export type SlRequestCloseEventDetail = {
+export type SlDialogRequestCloseEventDetail = {
   source: "close-button" | "keyboard" | "overlay";
@@ -22,0 +22,0 @@ };

components/drawer.d.ts

@@ -19,3 +19,3 @@ import type { ReactNode, HTMLAttributes, Ref } from "react";
 export type SlDrawerInitialFocusEvent = SlInitialFocusEvent<SlDrawerElement>;
-export type SlRequestCloseEventDetail = {
+export type SlDrawerRequestCloseEventDetail = {
   source: "close-button" | "keyboard" | "overlay";
@@ -22,0 +22,0 @@ };

components/include.d.ts

@@ -8,3 +8,3 @@ import type { ReactNode, HTMLAttributes, Ref } from "react";
 export type SlIncludeLoadEvent = SlLoadEvent<SlIncludeElement>;
-export type SlErrorEventDetail = { status: number };
+export type SlIncludeErrorEventDetail = { status: number };
 export type SlIncludeErrorEvent = SlErrorEvent<
@@ -11,0 +11,0 @@ SlIncludeElement,

components/menu.d.ts

@@ -7,3 +7,3 @@ import type { ReactNode, HTMLAttributes, Ref } from "react";
 
-export type SlSelectEventDetail = { item: SlMenuItem };
+export type SlMenuSelectEventDetail = { item: SlMenuItem };
 export type SlMenuSelectEvent = SlSelectEvent<
@@ -10,0 +10,0 @@ SlMenuElement,

components/mutation-observer.d.ts

@@ -7,3 +7,5 @@ import type { ReactNode, HTMLAttributes, Ref } from "react";
 
-export type SlMutationEventDetail = { mutationList: MutationRecord[] };
+export type SlMutationObserverMutationEventDetail = {
+  mutationList: MutationRecord[];
+};
 export type SlMutationObserverMutationEvent = SlMutationEvent<
@@ -10,0 +12,0 @@ SlMutationObserverElement,

components/rating.d.ts

@@ -8,3 +8,3 @@ import type { ReactNode, HTMLAttributes, Ref } from "react";
 export type SlRatingChangeEvent = SlChangeEvent<SlRatingElement>;
-export type SlHoverEventDetail = {
+export type SlRatingHoverEventDetail = {
   phase: "start" | "move" | "end";
@@ -11,0 +11,0 @@ value: number;

components/resize-observer.d.ts

@@ -7,3 +7,5 @@ import type { ReactNode, HTMLAttributes, Ref } from "react";
 
-export type SlResizeEventDetail = { entries: ResizeObserverEntry[] };
+export type SlResizeObserverResizeEventDetail = {
+  entries: ResizeObserverEntry[];
+};
 export type SlResizeObserverResizeEvent = SlResizeEvent<
@@ -10,0 +12,0 @@ SlResizeObserverElement,

components/tab-group.d.ts

@@ -7,3 +7,3 @@ import type { ReactNode, HTMLAttributes, Ref } from "react";
 
-export type SlTabShowEventDetail = { name: String };
+export type SlTabGroupTabShowEventDetail = { name: String };
 export type SlTabGroupTabShowEvent = SlTabShowEvent<
@@ -13,3 +13,3 @@ SlTabGroupElement,
 >;
-export type SlTabHideEventDetail = { name: String };
+export type SlTabGroupTabHideEventDetail = { name: String };
 export type SlTabGroupTabHideEvent = SlTabHideEvent<
@@ -16,0 +16,0 @@ SlTabGroupElement,

components/tree.d.ts

@@ -7,3 +7,3 @@ import type { ReactNode, HTMLAttributes, Ref } from "react";
 
-export type SlSelectionChangeEventDetail = { selection: SlTreeItem[] };
+export type SlTreeSelectionChangeEventDetail = { selection: SlTreeItem[] };
 export type SlTreeSelectionChangeEvent = SlSelectionChangeEvent<
@@ -10,0 +10,0 @@ SlTreeElement,

index.d.ts

 export * from "./events";
 
+import { SlAlertElement } from "./components/alert.js";
 export { default as SlAlert } from "./components/alert.js";
 export * from "./components/alert.js";
+import { SlAnimatedImageElement } from "./components/animated-image.js";
 export { default as SlAnimatedImage } from "./components/animated-image.js";
 export * from "./components/animated-image.js";
+import { SlAnimationElement } from "./components/animation.js";
 export { default as SlAnimation } from "./components/animation.js";
 export * from "./components/animation.js";
+import { SlBadgeElement } from "./components/badge.js";
 export { default as SlBadge } from "./components/badge.js";
 export * from "./components/badge.js";
+import { SlAvatarElement } from "./components/avatar.js";
 export { default as SlAvatar } from "./components/avatar.js";
 export * from "./components/avatar.js";
+import { SlBreadcrumbElement } from "./components/breadcrumb.js";
 export { default as SlBreadcrumb } from "./components/breadcrumb.js";
 export * from "./components/breadcrumb.js";
+import { SlBreadcrumbItemElement } from "./components/breadcrumb-item.js";
 export { default as SlBreadcrumbItem } from "./components/breadcrumb-item.js";
 export * from "./components/breadcrumb-item.js";
+import { SlButtonElement } from "./components/button.js";
 export { default as SlButton } from "./components/button.js";
 export * from "./components/button.js";
+import { SlButtonGroupElement } from "./components/button-group.js";
 export { default as SlButtonGroup } from "./components/button-group.js";
 export * from "./components/button-group.js";
+import { SlCardElement } from "./components/card.js";
 export { default as SlCard } from "./components/card.js";
 export * from "./components/card.js";
+import { SlCarouselElement } from "./components/carousel.js";
 export { default as SlCarousel } from "./components/carousel.js";
 export * from "./components/carousel.js";
+import { SlCarouselItemElement } from "./components/carousel-item.js";
 export { default as SlCarouselItem } from "./components/carousel-item.js";
 export * from "./components/carousel-item.js";
+import { SlCheckboxElement } from "./components/checkbox.js";
 export { default as SlCheckbox } from "./components/checkbox.js";
 export * from "./components/checkbox.js";
+import { SlColorPickerElement } from "./components/color-picker.js";
 export { default as SlColorPicker } from "./components/color-picker.js";
 export * from "./components/color-picker.js";
+import { SlCopyButtonElement } from "./components/copy-button.js";
 export { default as SlCopyButton } from "./components/copy-button.js";
 export * from "./components/copy-button.js";
+import { SlDetailsElement } from "./components/details.js";
 export { default as SlDetails } from "./components/details.js";
 export * from "./components/details.js";
+import { SlDialogElement } from "./components/dialog.js";
 export { default as SlDialog } from "./components/dialog.js";
 export * from "./components/dialog.js";
+import { SlDividerElement } from "./components/divider.js";
 export { default as SlDivider } from "./components/divider.js";
 export * from "./components/divider.js";
+import { SlDrawerElement } from "./components/drawer.js";
 export { default as SlDrawer } from "./components/drawer.js";
 export * from "./components/drawer.js";
+import { SlDropdownElement } from "./components/dropdown.js";
 export { default as SlDropdown } from "./components/dropdown.js";
 export * from "./components/dropdown.js";
+import { SlFormatBytesElement } from "./components/format-bytes.js";
 export { default as SlFormatBytes } from "./components/format-bytes.js";
 export * from "./components/format-bytes.js";
+import { SlFormatDateElement } from "./components/format-date.js";
 export { default as SlFormatDate } from "./components/format-date.js";
 export * from "./components/format-date.js";
+import { SlFormatNumberElement } from "./components/format-number.js";
 export { default as SlFormatNumber } from "./components/format-number.js";
 export * from "./components/format-number.js";
+import { SlIconElement } from "./components/icon.js";
 export { default as SlIcon } from "./components/icon.js";
 export * from "./components/icon.js";
+import { SlIconButtonElement } from "./components/icon-button.js";
 export { default as SlIconButton } from "./components/icon-button.js";
 export * from "./components/icon-button.js";
+import { SlImageComparerElement } from "./components/image-comparer.js";
 export { default as SlImageComparer } from "./components/image-comparer.js";
 export * from "./components/image-comparer.js";
+import { SlIncludeElement } from "./components/include.js";
 export { default as SlInclude } from "./components/include.js";
 export * from "./components/include.js";
+import { SlInputElement } from "./components/input.js";
 export { default as SlInput } from "./components/input.js";
 export * from "./components/input.js";
+import { SlMenuElement } from "./components/menu.js";
 export { default as SlMenu } from "./components/menu.js";
 export * from "./components/menu.js";
+import { SlMutationObserverElement } from "./components/mutation-observer.js";
 export { default as SlMutationObserver } from "./components/mutation-observer.js";
 export * from "./components/mutation-observer.js";
+import { SlOptionElement } from "./components/option.js";
 export { default as SlOption } from "./components/option.js";
 export * from "./components/option.js";
+import { SlMenuItemElement } from "./components/menu-item.js";
 export { default as SlMenuItem } from "./components/menu-item.js";
 export * from "./components/menu-item.js";
+import { SlMenuLabelElement } from "./components/menu-label.js";
 export { default as SlMenuLabel } from "./components/menu-label.js";
 export * from "./components/menu-label.js";
+import { SlPopupElement } from "./components/popup.js";
 export { default as SlPopup } from "./components/popup.js";
 export * from "./components/popup.js";
+import { SlProgressRingElement } from "./components/progress-ring.js";
 export { default as SlProgressRing } from "./components/progress-ring.js";
 export * from "./components/progress-ring.js";
+import { SlProgressBarElement } from "./components/progress-bar.js";
 export { default as SlProgressBar } from "./components/progress-bar.js";
 export * from "./components/progress-bar.js";
+import { SlQrCodeElement } from "./components/qr-code.js";
 export { default as SlQrCode } from "./components/qr-code.js";
 export * from "./components/qr-code.js";
+import { SlRadioElement } from "./components/radio.js";
 export { default as SlRadio } from "./components/radio.js";
 export * from "./components/radio.js";
+import { SlRadioButtonElement } from "./components/radio-button.js";
 export { default as SlRadioButton } from "./components/radio-button.js";
 export * from "./components/radio-button.js";
+import { SlRadioGroupElement } from "./components/radio-group.js";
 export { default as SlRadioGroup } from "./components/radio-group.js";
 export * from "./components/radio-group.js";
+import { SlRangeElement } from "./components/range.js";
 export { default as SlRange } from "./components/range.js";
 export * from "./components/range.js";
+import { SlRelativeTimeElement } from "./components/relative-time.js";
 export { default as SlRelativeTime } from "./components/relative-time.js";
 export * from "./components/relative-time.js";
+import { SlRatingElement } from "./components/rating.js";
 export { default as SlRating } from "./components/rating.js";
 export * from "./components/rating.js";
+import { SlResizeObserverElement } from "./components/resize-observer.js";
 export { default as SlResizeObserver } from "./components/resize-observer.js";
 export * from "./components/resize-observer.js";
+import { SlSelectElement } from "./components/select.js";
 export { default as SlSelect } from "./components/select.js";
 export * from "./components/select.js";
+import { SlSkeletonElement } from "./components/skeleton.js";
 export { default as SlSkeleton } from "./components/skeleton.js";
 export * from "./components/skeleton.js";
+import { SlSpinnerElement } from "./components/spinner.js";
 export { default as SlSpinner } from "./components/spinner.js";
 export * from "./components/spinner.js";
+import { SlSplitPanelElement } from "./components/split-panel.js";
 export { default as SlSplitPanel } from "./components/split-panel.js";
 export * from "./components/split-panel.js";
+import { SlSwitchElement } from "./components/switch.js";
 export { default as SlSwitch } from "./components/switch.js";
 export * from "./components/switch.js";
+import { SlTabElement } from "./components/tab.js";
 export { default as SlTab } from "./components/tab.js";
 export * from "./components/tab.js";
+import { SlTabGroupElement } from "./components/tab-group.js";
 export { default as SlTabGroup } from "./components/tab-group.js";
 export * from "./components/tab-group.js";
+import { SlTagElement } from "./components/tag.js";
 export { default as SlTag } from "./components/tag.js";
 export * from "./components/tag.js";
+import { SlTabPanelElement } from "./components/tab-panel.js";
 export { default as SlTabPanel } from "./components/tab-panel.js";
 export * from "./components/tab-panel.js";
+import { SlTextareaElement } from "./components/textarea.js";
 export { default as SlTextarea } from "./components/textarea.js";
 export * from "./components/textarea.js";
+import { SlTooltipElement } from "./components/tooltip.js";
 export { default as SlTooltip } from "./components/tooltip.js";
 export * from "./components/tooltip.js";
+import { SlTreeElement } from "./components/tree.js";
 export { default as SlTree } from "./components/tree.js";
 export * from "./components/tree.js";
+import { SlTreeItemElement } from "./components/tree-item.js";
 export { default as SlTreeItem } from "./components/tree-item.js";
 export * from "./components/tree-item.js";
+import { SlVisuallyHiddenElement } from "./components/visually-hidden.js";
 export { default as SlVisuallyHidden } from "./components/visually-hidden.js";
 export * from "./components/visually-hidden.js";
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "sl-alert": SlAlertElement;
+    "sl-animated-image": SlAnimatedImageElement;
+    "sl-animation": SlAnimationElement;
+    "sl-badge": SlBadgeElement;
+    "sl-avatar": SlAvatarElement;
+    "sl-breadcrumb": SlBreadcrumbElement;
+    "sl-breadcrumb-item": SlBreadcrumbItemElement;
+    "sl-button": SlButtonElement;
+    "sl-button-group": SlButtonGroupElement;
+    "sl-card": SlCardElement;
+    "sl-carousel": SlCarouselElement;
+    "sl-carousel-item": SlCarouselItemElement;
+    "sl-checkbox": SlCheckboxElement;
+    "sl-color-picker": SlColorPickerElement;
+    "sl-copy-button": SlCopyButtonElement;
+    "sl-details": SlDetailsElement;
+    "sl-dialog": SlDialogElement;
+    "sl-divider": SlDividerElement;
+    "sl-drawer": SlDrawerElement;
+    "sl-dropdown": SlDropdownElement;
+    "sl-format-bytes": SlFormatBytesElement;
+    "sl-format-date": SlFormatDateElement;
+    "sl-format-number": SlFormatNumberElement;
+    "sl-icon": SlIconElement;
+    "sl-icon-button": SlIconButtonElement;
+    "sl-image-comparer": SlImageComparerElement;
+    "sl-include": SlIncludeElement;
+    "sl-input": SlInputElement;
+    "sl-menu": SlMenuElement;
+    "sl-mutation-observer": SlMutationObserverElement;
+    "sl-option": SlOptionElement;
+    "sl-menu-item": SlMenuItemElement;
+    "sl-menu-label": SlMenuLabelElement;
+    "sl-popup": SlPopupElement;
+    "sl-progress-ring": SlProgressRingElement;
+    "sl-progress-bar": SlProgressBarElement;
+    "sl-qr-code": SlQrCodeElement;
+    "sl-radio": SlRadioElement;
+    "sl-radio-button": SlRadioButtonElement;
+    "sl-radio-group": SlRadioGroupElement;
+    "sl-range": SlRangeElement;
+    "sl-relative-time": SlRelativeTimeElement;
+    "sl-rating": SlRatingElement;
+    "sl-resize-observer": SlResizeObserverElement;
+    "sl-select": SlSelectElement;
+    "sl-skeleton": SlSkeletonElement;
+    "sl-spinner": SlSpinnerElement;
+    "sl-split-panel": SlSplitPanelElement;
+    "sl-switch": SlSwitchElement;
+    "sl-tab": SlTabElement;
+    "sl-tab-group": SlTabGroupElement;
+    "sl-tag": SlTagElement;
+    "sl-tab-panel": SlTabPanelElement;
+    "sl-textarea": SlTextareaElement;
+    "sl-tooltip": SlTooltipElement;
+    "sl-tree": SlTreeElement;
+    "sl-tree-item": SlTreeItemElement;
+    "sl-visually-hidden": SlVisuallyHiddenElement;
+  }
+}

package.json

 {
   "name": "shoelace-react",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "React wrappers around the shoelace web components.",
@@ -5,0 +5,0 @@ "main": "index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

214000

increased by2.92%

Lines of code

6323

increased by2.05%

No dependency changes