@indico-data/design-system 3.6.3 → 3.6.4
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/lib/components/truncate/Truncate.d.ts +1 -1
- package/lib/components/truncate/types.d.ts +2 -3
- package/lib/index.d.ts +3 -4
- package/lib/index.esm.js +2 -2
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +2 -2
- package/lib/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/truncate/Truncate.stories.tsx +7 -7
- package/src/components/truncate/Truncate.tsx +4 -4
- package/src/components/truncate/__tests__/Truncate.test.tsx +2 -2
- package/src/components/truncate/types.ts +2 -3
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { TruncateProps } from './types';
|
|
2
|
-
export declare const Truncate: ({ numLines,
|
|
2
|
+
export declare const Truncate: ({ numLines, tooltipOptions, children, ...rest }: TruncateProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -2,11 +2,10 @@ import { TooltipProps } from '../tooltip/Tooltip';
|
|
|
2
2
|
export interface TruncateProps {
|
|
3
3
|
/** The number of lines to truncate the text to. If left blank, it will default to 1 line. */
|
|
4
4
|
numLines?: number;
|
|
5
|
-
/** The string to truncate. This value will also be displayed in the tooltip when the text is truncated. */
|
|
6
|
-
truncateString: string;
|
|
7
5
|
/** The options for the tooltip. If `disabled` is `true`, the tooltip will not be shown. If left blank, the tooltip will be shown by default. This is particularly useful if you want to set the width of the tooltip to something other than the default `max-content`. */
|
|
8
6
|
tooltipOptions?: Partial<TooltipProps> & {
|
|
9
7
|
disabled?: boolean;
|
|
10
8
|
};
|
|
11
|
-
|
|
9
|
+
/** The children to display. This will be displayed in the truncate component. */
|
|
10
|
+
children: React.ReactNode;
|
|
12
11
|
}
|
package/lib/index.d.ts
CHANGED
|
@@ -1025,15 +1025,14 @@ declare const Stepper: ({ currentStep: externalCurrentStep, legendHeader, legend
|
|
|
1025
1025
|
interface TruncateProps {
|
|
1026
1026
|
/** The number of lines to truncate the text to. If left blank, it will default to 1 line. */
|
|
1027
1027
|
numLines?: number;
|
|
1028
|
-
/** The string to truncate. This value will also be displayed in the tooltip when the text is truncated. */
|
|
1029
|
-
truncateString: string;
|
|
1030
1028
|
/** The options for the tooltip. If `disabled` is `true`, the tooltip will not be shown. If left blank, the tooltip will be shown by default. This is particularly useful if you want to set the width of the tooltip to something other than the default `max-content`. */
|
|
1031
1029
|
tooltipOptions?: Partial<TooltipProps> & {
|
|
1032
1030
|
disabled?: boolean;
|
|
1033
1031
|
};
|
|
1034
|
-
|
|
1032
|
+
/** The children to display. This will be displayed in the truncate component. */
|
|
1033
|
+
children: React.ReactNode;
|
|
1035
1034
|
}
|
|
1036
1035
|
|
|
1037
|
-
declare const Truncate: ({ numLines,
|
|
1036
|
+
declare const Truncate: ({ numLines, tooltipOptions, children, ...rest }: TruncateProps) => react_jsx_runtime.JSX.Element;
|
|
1038
1037
|
|
|
1039
1038
|
export { Badge, BarSpinner, Button, Card, Checkbox, CirclePulse, Col, ConfirmationModal, Container, DatePicker, FloatUI, Form, Icon, IconTriggerDatePicker, LabeledInput as Input, InputDateRangePicker, Menu, Modal, Pagination, LabeledPasswordInput as PasswordInput, Pill, Radio as RadioInput, Row, LabeledSelect as SelectInput, type SelectOption, SingleInputDatePicker, SingleInputDateTimePicker, Skeleton, Stepper, Table, TanstackTable, LabeledTextarea as Textarea, TimePicker, Toggle as ToggleInput, Tooltip, Truncate, registerFontAwesomeIcons };
|
package/lib/index.esm.js
CHANGED
|
@@ -43238,7 +43238,7 @@ function v4(options, buf, offset) {
|
|
|
43238
43238
|
}
|
|
43239
43239
|
|
|
43240
43240
|
const Truncate = (_a) => {
|
|
43241
|
-
var { numLines = 1,
|
|
43241
|
+
var { numLines = 1, tooltipOptions = {}, children } = _a, rest = __rest(_a, ["numLines", "tooltipOptions", "children"]);
|
|
43242
43242
|
const [isTruncated, setIsTruncated] = useState(false);
|
|
43243
43243
|
const id = useMemo(() => v4().replace(/[^a-zA-Z0-9-_]/g, '_'), []);
|
|
43244
43244
|
const ref = useRef(null);
|
|
@@ -43264,7 +43264,7 @@ const Truncate = (_a) => {
|
|
|
43264
43264
|
return (jsxs("div", { className: "truncate-wrapper", style: truncateStyle, children: [jsx("span", Object.assign({ ref: ref, "data-testid": `truncate-${id}-${isTruncated ? 'truncated' : 'not-truncated'}`, "data-tooltip-id": id, className: classNames('truncate', {
|
|
43265
43265
|
'truncate--multi-line': numLines > 1,
|
|
43266
43266
|
'truncate--single-line': numLines === 1,
|
|
43267
|
-
}) }, rest, { children:
|
|
43267
|
+
}) }, rest, { children: children })), isTruncated && children && !tooltipOptions.disabled && (jsx(Tooltip, Object.assign({}, tooltipOptions, { id: id, children: children })))] }));
|
|
43268
43268
|
};
|
|
43269
43269
|
|
|
43270
43270
|
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
|