@wistia/ui 0.18.14-beta.3d78b4cc.f1b5721 → 0.18.14-beta.68be1bd5.aa62ddb
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/index.cjs +13 -21
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.mjs +12 -20
- package/dist/index.mjs.map +1 -1
- package/package.json +9 -9
package/dist/index.d.mts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as react from 'react';
|
|
3
|
-
import { ReactNode, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, AnchorHTMLAttributes,
|
|
3
|
+
import { ReactNode, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, AnchorHTMLAttributes, MouseEvent, ReactElement, ElementType, ChangeEvent, PropsWithChildren, InputHTMLAttributes, Ref, SyntheticEvent, HTMLAttributes, ForwardRefExoticComponent, RefAttributes, TdHTMLAttributes, ThHTMLAttributes, ComponentProps } from 'react';
|
|
4
4
|
import { UseFilePickerConfig, FilePickerReturnTypes, ExtractContentTypeFromConfig, useImperativeFilePickerConfig, ImperativeFilePickerReturnTypes } from 'use-file-picker/types';
|
|
5
5
|
export * from 'use-file-picker/types';
|
|
6
6
|
import { CollapsibleContentProps as CollapsibleContentProps$1 } from '@radix-ui/react-collapsible';
|
|
@@ -268,7 +268,7 @@ type LinkProps = LinkAsButtonProps | LinkAsLinkProps;
|
|
|
268
268
|
* This means in addition to its own props, `Link` can use props from `react-router`'s `Link` component. View their documentation [here](https://reactrouter.com/en/main/components/link).
|
|
269
269
|
* The one prop we ignore from react-router is `to`. We use `href` instead and map it under the hood.
|
|
270
270
|
*/
|
|
271
|
-
declare const Link: ForwardRefExoticComponent<(Omit<LinkAsLinkProps, "ref"> | Omit<LinkAsButtonProps, "ref">) & RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
|
|
271
|
+
declare const Link: react.ForwardRefExoticComponent<(Omit<LinkAsLinkProps, "ref"> | Omit<LinkAsButtonProps, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
|
|
272
272
|
|
|
273
273
|
type Breakpoints = 'isLgAndDown' | 'isLgAndUp' | 'isMdAndDown' | 'isMdAndUp' | 'isSmAndDown' | 'isSmAndUp' | 'isXlAndDown' | 'isXlAndUp' | 'isXsAndDown' | 'isXsAndUp';
|
|
274
274
|
type AtLeastOneBreakpoint<T, U = {
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as react from 'react';
|
|
3
|
-
import { ReactNode, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, AnchorHTMLAttributes,
|
|
3
|
+
import { ReactNode, LegacyRef, MutableRefObject, RefCallback, Dispatch, SetStateAction, RefObject, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, AnchorHTMLAttributes, MouseEvent, ReactElement, ElementType, ChangeEvent, PropsWithChildren, InputHTMLAttributes, Ref, SyntheticEvent, HTMLAttributes, ForwardRefExoticComponent, RefAttributes, TdHTMLAttributes, ThHTMLAttributes, ComponentProps } from 'react';
|
|
4
4
|
import { UseFilePickerConfig, FilePickerReturnTypes, ExtractContentTypeFromConfig, useImperativeFilePickerConfig, ImperativeFilePickerReturnTypes } from 'use-file-picker/types';
|
|
5
5
|
export * from 'use-file-picker/types';
|
|
6
6
|
import { CollapsibleContentProps as CollapsibleContentProps$1 } from '@radix-ui/react-collapsible';
|
|
@@ -268,7 +268,7 @@ type LinkProps = LinkAsButtonProps | LinkAsLinkProps;
|
|
|
268
268
|
* This means in addition to its own props, `Link` can use props from `react-router`'s `Link` component. View their documentation [here](https://reactrouter.com/en/main/components/link).
|
|
269
269
|
* The one prop we ignore from react-router is `to`. We use `href` instead and map it under the hood.
|
|
270
270
|
*/
|
|
271
|
-
declare const Link: ForwardRefExoticComponent<(Omit<LinkAsLinkProps, "ref"> | Omit<LinkAsButtonProps, "ref">) & RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
|
|
271
|
+
declare const Link: react.ForwardRefExoticComponent<(Omit<LinkAsLinkProps, "ref"> | Omit<LinkAsButtonProps, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
|
|
272
272
|
|
|
273
273
|
type Breakpoints = 'isLgAndDown' | 'isLgAndUp' | 'isMdAndDown' | 'isMdAndUp' | 'isSmAndDown' | 'isSmAndUp' | 'isXlAndDown' | 'isXlAndUp' | 'isXsAndDown' | 'isXsAndUp';
|
|
274
274
|
type AtLeastOneBreakpoint<T, U = {
|
package/dist/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.18.14-beta.
|
|
3
|
+
* @license @wistia/ui v0.18.14-beta.68be1bd5.aa62ddb
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -18,8 +18,6 @@ import { createGlobalStyle } from "styled-components";
|
|
|
18
18
|
// src/css/globalStyleAdjustmentsCss.tsx
|
|
19
19
|
import { css } from "styled-components";
|
|
20
20
|
var globalStyleAdjustmentsCss = css`
|
|
21
|
-
/* stylelint-disable property-no-vendor-prefix */
|
|
22
|
-
|
|
23
21
|
/**
|
|
24
22
|
* 1. Change from 'content-box' so that 'width' calculations are unaffected by 'padding' or 'border'
|
|
25
23
|
See: https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/
|
|
@@ -7762,19 +7760,9 @@ Icon.displayName = "Icon_UI";
|
|
|
7762
7760
|
// src/components/Link/Link.tsx
|
|
7763
7761
|
import { forwardRef } from "react";
|
|
7764
7762
|
import { styled as styled5 } from "styled-components";
|
|
7763
|
+
import { Link as RouterLink, useInRouterContext } from "react-router";
|
|
7765
7764
|
import { isFunction as isFunction2, isNil as isNil6, isNotNil as isNotNil5, isNotUndefined as isNotUndefined3, isUndefined as isUndefined2 } from "@wistia/type-guards";
|
|
7766
7765
|
import { jsx as jsx207, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
7767
|
-
var RouterLink = null;
|
|
7768
|
-
var useInRouterContext = () => false;
|
|
7769
|
-
var isRouterEnabled = false;
|
|
7770
|
-
import("react-router").then((module) => {
|
|
7771
|
-
RouterLink = module.Link;
|
|
7772
|
-
useInRouterContext = module.useInRouterContext;
|
|
7773
|
-
isRouterEnabled = true;
|
|
7774
|
-
return module;
|
|
7775
|
-
}).catch(() => {
|
|
7776
|
-
isRouterEnabled = false;
|
|
7777
|
-
});
|
|
7778
7766
|
var generateHref = (href, type, disabled) => {
|
|
7779
7767
|
if (disabled || isNil6(href)) {
|
|
7780
7768
|
return void 0;
|
|
@@ -7833,9 +7821,9 @@ var Link = forwardRef(
|
|
|
7833
7821
|
role,
|
|
7834
7822
|
...props
|
|
7835
7823
|
}, ref) => {
|
|
7836
|
-
const
|
|
7824
|
+
const inRouterContext = useInRouterContext();
|
|
7837
7825
|
const to = generateHref(props.href, type, disabled);
|
|
7838
|
-
const shouldUseReactRouterLink =
|
|
7826
|
+
const shouldUseReactRouterLink = inRouterContext && type !== "external" && !to?.startsWith("http");
|
|
7839
7827
|
const handleClick = async (event) => {
|
|
7840
7828
|
if (disabled) {
|
|
7841
7829
|
event.preventDefault();
|
|
@@ -7884,6 +7872,7 @@ var Link = forwardRef(
|
|
|
7884
7872
|
const externalLinkProps = type === "external" ? { target: "_blank", rel: "noopener noreferrer" } : null;
|
|
7885
7873
|
const routerSpecificProps = shouldUseReactRouterLink ? {
|
|
7886
7874
|
// TODO: Using 'any' here due to styled-components typing limitations with RouterLink
|
|
7875
|
+
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-explicit-any
|
|
7887
7876
|
as: RouterLink,
|
|
7888
7877
|
to: to ?? ""
|
|
7889
7878
|
} : {
|
|
@@ -8070,7 +8059,7 @@ var StyledActionButton = styled7(Button)`
|
|
|
8070
8059
|
min-width: 96px;
|
|
8071
8060
|
padding: var(--wui-space-03);
|
|
8072
8061
|
background: var(--wui-color-bg-surface-secondary);
|
|
8073
|
-
|
|
8062
|
+
row-gap: var(--wui-space-02);
|
|
8074
8063
|
border-radius: var(--wui-border-radius-03);
|
|
8075
8064
|
flex: 0 0 auto;
|
|
8076
8065
|
transition: background-color var(--wui-motion-duration-02) var(--wui-motion-ease);
|
|
@@ -10193,9 +10182,9 @@ var isClickableElement = (element) => {
|
|
|
10193
10182
|
};
|
|
10194
10183
|
var ClickRegion = ({ children, targetRef }) => {
|
|
10195
10184
|
useEffect9(() => {
|
|
10196
|
-
if (targetRef.current
|
|
10185
|
+
if (targetRef.current?.tagName === "A") {
|
|
10197
10186
|
targetRef.current.setAttribute("data-click-region-target-link", "");
|
|
10198
|
-
} else if (targetRef.current
|
|
10187
|
+
} else if (targetRef.current?.tagName === "BUTTON") {
|
|
10199
10188
|
targetRef.current.setAttribute("data-click-region-target-button", "");
|
|
10200
10189
|
} else {
|
|
10201
10190
|
}
|
|
@@ -14674,7 +14663,10 @@ var StyledEditableTextDisplay = styled66.div`
|
|
|
14674
14663
|
${({ $minLines }) => isNotNil26($minLines) && css35`
|
|
14675
14664
|
min-height: calc(${$minLines}lh + calc(var(--wui-editable-text-padding) * 2));
|
|
14676
14665
|
`}
|
|
14677
|
-
|
|
14666
|
+
/* overflow-wrap: break-word;
|
|
14667
|
+
word-break: break-word; */
|
|
14668
|
+
word-break: normal;
|
|
14669
|
+
overflow-wrap: anywhere;
|
|
14678
14670
|
|
|
14679
14671
|
&[data-wui-editable-text-display='placeholder'] {
|
|
14680
14672
|
color: var(--wui-color-text-secondary);
|