@luscii-healthtech/web-ui 28.11.1 → 28.11.2
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/components/Text/Text.d.ts +4 -4
- package/dist/index.development.js +14 -9
- package/dist/index.development.js.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/web-ui-tailwind.css +33 -0
- package/dist/web-ui.esm.js +1 -1
- package/dist/web-ui.esm.js.map +1 -1
- package/package.json +1 -1
|
@@ -8,10 +8,10 @@ import "./Text.css";
|
|
|
8
8
|
* https://v1.tailwindcss.com/docs/controlling-file-size
|
|
9
9
|
*/
|
|
10
10
|
export declare const allowedTextStyles: {
|
|
11
|
-
readonly sm:
|
|
12
|
-
readonly "sm-strong":
|
|
13
|
-
readonly base:
|
|
14
|
-
readonly strong:
|
|
11
|
+
readonly sm: `${string} ui-font-medium`;
|
|
12
|
+
readonly "sm-strong": `${string} ui-font-semibold ui-antialiased`;
|
|
13
|
+
readonly base: string;
|
|
14
|
+
readonly strong: `${string} ui-font-semibold ui-antialiased`;
|
|
15
15
|
readonly lg: "";
|
|
16
16
|
readonly "lg-strong": "ui-font-semibold ui-antialiased";
|
|
17
17
|
readonly xl: "ui-text-lg";
|
|
@@ -949,11 +949,15 @@ function styleInject(css, ref) {
|
|
|
949
949
|
var css_248z$j = "/* https://stackoverflow.com/a/13924997 */\n.ui-text-two-lines-max {\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n /* number of lines to show */\n -webkit-line-clamp: 2;\n line-clamp: 2;\n -webkit-box-orient: vertical;\n}\n";
|
|
950
950
|
styleInject(css_248z$j);
|
|
951
951
|
|
|
952
|
+
const responsiveTextSizeVariants = {
|
|
953
|
+
sm: "ui-text-sm sm:ui-text-xs",
|
|
954
|
+
base: "ui-text-base sm:ui-text-sm"
|
|
955
|
+
};
|
|
952
956
|
const allowedTextStyles = {
|
|
953
|
-
sm:
|
|
954
|
-
"sm-strong":
|
|
955
|
-
base:
|
|
956
|
-
strong:
|
|
957
|
+
sm: `${responsiveTextSizeVariants.sm} ui-font-medium`,
|
|
958
|
+
"sm-strong": `${responsiveTextSizeVariants.sm} ui-font-semibold ui-antialiased`,
|
|
959
|
+
base: responsiveTextSizeVariants.base,
|
|
960
|
+
strong: `${responsiveTextSizeVariants.base} ui-font-semibold ui-antialiased`,
|
|
957
961
|
lg: "",
|
|
958
962
|
"lg-strong": "ui-font-semibold ui-antialiased",
|
|
959
963
|
xl: "ui-text-lg",
|
|
@@ -994,6 +998,7 @@ const Text = (props) => {
|
|
|
994
998
|
allowedColors[color !== null && color !== void 0 ? color : "base"],
|
|
995
999
|
selectedHoverColor,
|
|
996
1000
|
selectedGroupHoverColor,
|
|
1001
|
+
"leading-6 sm:leading-5",
|
|
997
1002
|
{
|
|
998
1003
|
"ui-inline": inline,
|
|
999
1004
|
// FIXME: this class doesn't do anything without a ui-max-width
|
|
@@ -1738,7 +1743,7 @@ const ButtonV2 = React__namespace.default.forwardRef((_a, innerRef) => {
|
|
|
1738
1743
|
"ui-px-[calc(theme('spacing.m')-1px)]": true,
|
|
1739
1744
|
"ui-py-[calc(theme('spacing.xxs')-1px)]": size === "medium",
|
|
1740
1745
|
"ui-py-[calc(theme('spacing.s')-1px)]": size === "large"
|
|
1741
|
-
}, className);
|
|
1746
|
+
}, "ui-h-12 sm:ui-h-auto", className);
|
|
1742
1747
|
const textColorClass = allowedColors[textColor !== null && textColor !== void 0 ? textColor : "base"];
|
|
1743
1748
|
const tooltipAttrs = title ? {
|
|
1744
1749
|
"data-tip": true,
|
|
@@ -2536,7 +2541,7 @@ const Carousel = ({ slides, className, id }) => {
|
|
|
2536
2541
|
) : React__namespace.default.createElement(React__namespace.default.Fragment, null);
|
|
2537
2542
|
};
|
|
2538
2543
|
|
|
2539
|
-
var css_248z$c = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n.cweb-checkbox {\n outline: none;\n}\n.cweb-checkbox .cweb-checkbox-input {\n position: absolute;\n -webkit-appearance: none;\n height: 1px;\n opacity: 0;\n width: 1px;\n}\n.cweb-checkbox.type-regular .cweb-checkbox-icon-container {\n border-color: #cccccc;\n
|
|
2544
|
+
var css_248z$c = "/**\n * --- DEPRECATED ---\n * DON'T USE ANYTHING FROM THIS FILE IN FUTURE CHANGES. WE SHOULD BE\n * USING TAILWIND CLASSES DIRECTLY IN OUR COMPONENTS.\n */\n.cweb-checkbox {\n outline: none;\n}\n.cweb-checkbox .cweb-checkbox-input {\n position: absolute;\n -webkit-appearance: none;\n height: 1px;\n opacity: 0;\n width: 1px;\n}\n.cweb-checkbox.type-regular .cweb-checkbox-icon-container {\n border-color: #cccccc;\n display: flex;\n align-items: center;\n justify-content: center;\n flex: 0 0 auto;\n border-width: 1px;\n border-style: solid;\n border-radius: 4px;\n}\n.cweb-checkbox.type-regular.hasError .cweb-checkbox-icon-container {\n --tw-border-opacity: 1;\n border-color: rgb(155 44 44 / var(--tw-border-opacity));\n}\n.cweb-checkbox.type-regular.is-focused .cweb-checkbox-icon-container {\n border-color: #1e40af;\n}\n.cweb-checkbox.type-regular.is-checked .cweb-checkbox-icon {\n padding: 4px;\n background: url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2210%22 height%3D%228%22 viewBox%3D%220 0 10 8%22 fill%3D%22none%22%3E %3Cpath d%3D%22M9.207 0.792787C9.39447 0.980314 9.49979 1.23462 9.49979 1.49979C9.49979 1.76495 9.39447 2.01926 9.207 2.20679L4.207 7.20679C4.01947 7.39426 3.76516 7.49957 3.5 7.49957C3.23484 7.49957 2.98053 7.39426 2.793 7.20679L0.793 5.20679C0.610842 5.01818 0.510047 4.76558 0.512326 4.50339C0.514604 4.24119 0.619773 3.99038 0.805181 3.80497C0.990589 3.61956 1.2414 3.51439 1.5036 3.51211C1.7658 3.50983 2.0184 3.61063 2.207 3.79279L3.5 5.08579L7.793 0.792787C7.98053 0.605316 8.23484 0.5 8.5 0.5C8.76516 0.5 9.01947 0.605316 9.207 0.792787Z%22 fill%3D%22white%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n}\n.cweb-checkbox.type-regular.is-checked .cweb-checkbox-icon-container {\n border-color: #1e40af;\n}\n.cweb-checkbox.type-regular.is-checked.is-focused .cweb-checkbox-icon-container {\n border-color: #1d4ed8;\n}\n.cweb-checkbox.type-regular.is-indeterminate .cweb-checkbox-icon {\n width: 0.5rem;\n height: 0.5rem;\n padding: 4px;\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2210%22 height%3D%222%22 viewBox%3D%220 0 10 2%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M9 -4.37114e-08C9.55228 -1.95703e-08 10 0.447715 10 1C10 1.55228 9.55228 2 9 2L1 2C0.447716 2 -6.78525e-08 1.55228 -4.37114e-08 1C-1.95703e-08 0.447715 0.447715 -4.17544e-07 1 -3.93402e-07L9 -4.37114e-08Z%22 fill%3D%22white%22%2F%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n}\n.cweb-checkbox.type-regular.is-indeterminate .cweb-checkbox-icon-container {\n border-color: #1e40af;\n}\n.cweb-checkbox.type-regular.is-indeterminate.is-focused .cweb-checkbox-icon-container {\n border-color: #1d4ed8;\n}\n.cweb-checkbox.type-regular.is-disabled.show-cross-when-disabled .cweb-checkbox-icon {\n width: 10px;\n height: 10px;\n background: url(\"data:image/svg+xml,%3Csvg width%3D%2211px%22 height%3D%2211px%22 viewBox%3D%220 0 11 11%22 version%3D%221.1%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg stroke%3D%22none%22 stroke-width%3D%221%22 fill%3D%22none%22 fill-rule%3D%22evenodd%22 stroke-linecap%3D%22round%22%3E %3Cg transform%3D%22translate(-6.000000%2C -7.000000)%22 stroke%3D%22%232D2D2D%22 stroke-width%3D%222%22%3E %3Cpath d%3D%22M7%2C17 L16%2C8 M16%2C17 L7%2C8%22 %2F%3E %3C%2Fg%3E %3C%2Fg%3E%3C%2Fsvg%3E\") no-repeat center;\n background-size: contain;\n opacity: 0.6;\n}";
|
|
2540
2545
|
styleInject(css_248z$c);
|
|
2541
2546
|
|
|
2542
2547
|
const CheckboxInner = (props) => {
|
|
@@ -2589,18 +2594,18 @@ const CheckboxInner = (props) => {
|
|
|
2589
2594
|
{ className: "ui-flex" },
|
|
2590
2595
|
React__namespace.default.createElement(
|
|
2591
2596
|
"div",
|
|
2592
|
-
{ className: "ui-flex ui-h-[
|
|
2597
|
+
{ className: "ui-flex ui-h-[24px] ui-flex-col ui-justify-center sm:ui-h-[20px]" },
|
|
2593
2598
|
React__namespace.default.createElement("input", { id, ref: innerRef, "data-test-id": `checkbox-${name}`, className: "cweb-checkbox-input", name, type: "checkbox", checked, disabled: isDisabled, value, onBlur: handleBlur, onFocus: handleFocus, onChange: handleChange }),
|
|
2594
2599
|
React__namespace.default.createElement(
|
|
2595
2600
|
"span",
|
|
2596
|
-
{ className: classNames__default.default("cweb-checkbox-icon-container ui-transition-colors", {
|
|
2601
|
+
{ className: classNames__default.default("cweb-checkbox-icon-container ui-transition-colors", "ui-h-6 ui-w-6", "sm:ui-h-4 sm:ui-w-4", {
|
|
2597
2602
|
"ui-bg-primary": checked || indeterminate,
|
|
2598
2603
|
"ui-bg-white": !checked && !indeterminate,
|
|
2599
2604
|
"group-hover:ui-bg-blue-50": type === "regular" && !(checked || indeterminate),
|
|
2600
2605
|
"group-hover:ui-bg-primary-dark": checked || indeterminate,
|
|
2601
2606
|
"ui-outline-primary": isFocused
|
|
2602
2607
|
}), "data-test-id": "checkbox-span" },
|
|
2603
|
-
React__namespace.default.createElement("div", { className: "cweb-checkbox-icon" })
|
|
2608
|
+
React__namespace.default.createElement("div", { className: "cweb-checkbox-icon ui-h-3 ui-w-3 sm:ui-h-2 sm:ui-w-2" })
|
|
2604
2609
|
)
|
|
2605
2610
|
),
|
|
2606
2611
|
React__namespace.default.createElement(
|