xmlui 0.11.3 → 0.11.6

package/dist/scripts/src/components/Card/Card.spec.js

@@ -1,150 +0,0 @@
-"use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const component_test_helpers_1 = require("../../testing/component-test-helpers");
-const fixtures_1 = require("../../testing/fixtures");
-// =============================================================================
-// BASIC FUNCTIONALITY TESTS
-// =============================================================================
-fixtures_1.test.describe("Basic Functionality", () => {
-    (0, fixtures_1.test)("Card renders", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createCardDriver }) {
-        yield initTestBed(`<Card />`);
-        const driver = yield createCardDriver();
-        yield (0, fixtures_1.expect)(driver.component).toBeVisible();
-    }));
-    (0, fixtures_1.test)("Card renders with title", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createCardDriver }) {
-        yield initTestBed(`<Card title="Test Title" />`);
-        const title = (yield createCardDriver()).component.getByRole("heading");
-        yield (0, fixtures_1.expect)(title).toBeVisible();
-        yield (0, fixtures_1.expect)(title).toHaveText("Test Title");
-    }));
-    (0, fixtures_1.test)("Card renders with subtitle", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createCardDriver }) {
-        yield initTestBed(`<Card subtitle="Test Subtitle" />`);
-        const subtitle = (yield createCardDriver()).component.locator("div").first();
-        yield (0, fixtures_1.expect)(subtitle).toBeVisible();
-        yield (0, fixtures_1.expect)(subtitle).toHaveText("Test Subtitle");
-    }));
-    (0, fixtures_1.test)("Card renders with both title and subtitle", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createCardDriver }) {
-        yield initTestBed(`
-      <Card title="Test Title" subtitle="Test Subtitle">
-        <Text value="Card content" />
-      </Card>
-    `);
-        const driver = yield createCardDriver();
-        const title = driver.component.getByRole("heading");
-        const subtitle = driver.component.getByText("Test Subtitle");
-        yield (0, fixtures_1.expect)(title).toHaveText("Test Title");
-        yield (0, fixtures_1.expect)(subtitle).toBeVisible();
-    }));
-    (0, fixtures_1.test)("displays avatar when avatarUrl is provided", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createCardDriver }) {
-        yield initTestBed(`<Card avatarUrl="/resources/flower-640x480.jpg" />`);
-        const avatar = (yield createCardDriver()).avatar;
-        yield (0, fixtures_1.expect)(avatar).toBeVisible();
-        yield (0, fixtures_1.expect)(avatar).toHaveAttribute("src", "/resources/flower-640x480.jpg");
-    }));
-    (0, fixtures_1.test)("clicking linkTo title navigates", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed, createCardDriver }) {
-        yield initTestBed(`<Card title="Clickable Title" linkTo="/test-link" />`);
-        const titleLink = (yield createCardDriver()).component.getByRole("link", {
-            name: "Clickable Title",
-        });
-        yield titleLink.click();
-        yield (0, fixtures_1.expect)(page).toHaveURL(/\/test-link$/);
-    }));
-    (0, fixtures_1.test)("showAvatar=false hides avatar even when avatarUrl is provided", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createCardDriver, }) {
-        yield initTestBed(`
-      <Card avatarUrl="https://i.pravatar.cc/100" showAvatar="false" title="Test Title" />
-    `);
-        const driver = yield createCardDriver();
-        yield (0, fixtures_1.expect)(driver.avatar).not.toBeVisible();
-        yield (0, fixtures_1.expect)(driver.component.getByText("Test Title")).toBeVisible();
-    }));
-    (0, fixtures_1.test)("showAvatar displays initials with single word title", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createCardDriver, }) {
-        yield initTestBed(`<Card showAvatar="true" title="John" />`);
-        yield (0, fixtures_1.expect)((yield createCardDriver()).component.getByText("J", { exact: true })).toBeVisible();
-    }));
-    (0, fixtures_1.test)("showAvatar=true with empty title displays no initials", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createCardDriver, }) {
-        yield initTestBed(`<Card showAvatar="true" />`);
-        const avatar = (yield createCardDriver()).avatar;
-        yield (0, fixtures_1.expect)(avatar).toHaveText(/^$/);
-    }));
-    (0, fixtures_1.test)("linkTo without title does not create link", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createCardDriver }) {
-        yield initTestBed(`
-      <Card linkTo="/test-link">
-        <Text value="Content" />
-      </Card>
-    `);
-        const driver = yield createCardDriver();
-        yield (0, fixtures_1.expect)(driver.component.getByRole("link")).not.toBeVisible();
-        yield (0, fixtures_1.expect)(driver.component.getByText("Content")).toBeVisible();
-    }));
-    (0, fixtures_1.test)("orientation horizontal displays children in row", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createTextDriver, }) {
-        yield initTestBed(`
-      <Card orientation="horizontal">
-        <Text testId="text-1" value="Child 1" />
-        <Text testId="text-2" value="Child 2" />
-      </Card>
-    `);
-        const text1Driver = yield createTextDriver("text-1");
-        const text2Driver = yield createTextDriver("text-2");
-        const { right: text1Right } = yield (0, component_test_helpers_1.getBounds)(text1Driver);
-        const { right: text2Left } = yield (0, component_test_helpers_1.getBounds)(text2Driver);
-        (0, fixtures_1.expect)(text1Right).toBeLessThan(text2Left);
-    }));
-    (0, fixtures_1.test)("orientation vertical displays children in column", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createTextDriver, }) {
-        yield initTestBed(`
-      <Card orientation="vertical">
-        <Text testId="text-1" value="Child 1" />
-        <Text testId="text-2" value="Child 2" />
-      </Card>
-    `);
-        const text1Driver = yield createTextDriver("text-1");
-        const text2Driver = yield createTextDriver("text-2");
-        const { bottom: text1Bottom } = yield (0, component_test_helpers_1.getBounds)(text1Driver);
-        const { top: text2Top } = yield (0, component_test_helpers_1.getBounds)(text2Driver);
-        (0, fixtures_1.expect)(text1Bottom).toBeLessThan(text2Top);
-    }));
-});
-// =============================================================================
-// EVENT HANDLING TESTS
-// =============================================================================
-fixtures_1.test.describe("Event Handling", () => {
-    (0, fixtures_1.test)("click event is triggered when Card is clicked", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createCardDriver, }) {
-        const { testStateDriver } = yield initTestBed(`<Card onClick="testState = true" />`);
-        yield (yield createCardDriver()).click();
-        yield fixtures_1.expect.poll(testStateDriver.testState).toEqual(true);
-    }));
-    (0, fixtures_1.test)("Card click does not interfere with link click", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed, createCardDriver, createTextDriver, }) {
-        yield initTestBed(`
-      <Card title="Title" linkTo="/test-link" onClick="testState = true">
-        <Text testId="text-1" when="{testState}" value="visible" />
-      </Card>
-    `);
-        const cardDriver = yield createCardDriver();
-        const textDriver = yield createTextDriver("text-1");
-        yield cardDriver.click();
-        yield (0, fixtures_1.expect)(textDriver.component).toHaveText("visible");
-        yield (0, fixtures_1.expect)(page).not.toHaveURL(/\/test-link$/);
-    }));
-    (0, fixtures_1.test)("Link click does not interfere with Card click", (_a) => __awaiter(void 0, [_a], void 0, function* ({ page, initTestBed, createCardDriver, createTextDriver, }) {
-        const { testStateDriver } = yield initTestBed(`
-      <Card title="Title" linkTo="/test-link" onClick="testState = true">
-        <Text testId="text-1" when="{testState}" value="visible" />
-      </Card>
-    `);
-        const textDriver = yield createTextDriver("text-1");
-        const title = (yield createCardDriver()).component.getByRole("heading");
-        yield (0, fixtures_1.expect)(textDriver.component).not.toBeVisible();
-        yield title.click();
-        yield page.waitForTimeout(200);
-        yield (0, fixtures_1.expect)(page).toHaveURL(/\/test-link$/);
-        yield (0, fixtures_1.expect)(textDriver.component).toBeVisible();
-    }));
-});

package/dist/scripts/src/components/Card/CardNative.js

@@ -1,41 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Card = exports.defaultProps = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const classnames_1 = __importDefault(require("classnames"));
-const Card_module_scss_1 = __importDefault(require("./Card.module.scss"));
-const AvatarNative_1 = require("../Avatar/AvatarNative");
-const LinkNative_1 = require("../Link/LinkNative");
-const HeadingNative_1 = require("../Heading/HeadingNative");
-const TextNative_1 = require("../Text/TextNative");
-exports.defaultProps = {
-    orientation: "vertical",
-    showAvatar: false,
-};
-exports.Card = (0, react_1.forwardRef)(function Card(_a, forwardedRef) {
-    var { children, orientation = exports.defaultProps.orientation, style, className, title, subtitle, linkTo, avatarUrl, showAvatar = !!avatarUrl || exports.defaultProps.showAvatar, avatarSize, onClick } = _a, rest = __rest(_a, ["children", "orientation", "style", "className", "title", "subtitle", "linkTo", "avatarUrl", "showAvatar", "avatarSize", "onClick"]);
-    const titleProps = {
-        level: "h2",
-        maxLines: 1,
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, rest, { ref: forwardedRef, className: (0, classnames_1.default)(Card_module_scss_1.default.wrapper, {
-            [Card_module_scss_1.default.isClickable]: !!onClick,
-            [Card_module_scss_1.default.vertical]: orientation === "vertical",
-            [Card_module_scss_1.default.horizontal]: orientation === "horizontal",
-        }, className), style: style, onClick: onClick, children: [[title, subtitle, avatarUrl, showAvatar].some(Boolean) && ((0, jsx_runtime_1.jsxs)("div", { className: Card_module_scss_1.default.avatarWrapper, children: [showAvatar && (0, jsx_runtime_1.jsx)(AvatarNative_1.Avatar, { url: avatarUrl, name: title, size: avatarSize }), (0, jsx_runtime_1.jsxs)("div", { className: Card_module_scss_1.default.titleWrapper, children: [linkTo ? (title ? ((0, jsx_runtime_1.jsx)(LinkNative_1.LinkNative, { to: linkTo + "", children: (0, jsx_runtime_1.jsx)(HeadingNative_1.Heading, Object.assign({}, titleProps, { children: title })) })) : null) : title ? ((0, jsx_runtime_1.jsx)(HeadingNative_1.Heading, Object.assign({}, titleProps, { children: title }))) : null, subtitle !== undefined && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(TextNative_1.Text, { variant: "secondary", children: subtitle }) }))] })] })), children] })));
-});

package/dist/scripts/src/components/Carousel/Carousel.js

@@ -1,133 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.carouselComponentRenderer = exports.CarouselMd = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Carousel_module_scss_1 = __importDefault(require("./Carousel.module.scss"));
-const renderers_1 = require("../../components-core/renderers");
-const themeVars_1 = require("../../components-core/theming/themeVars");
-const metadata_helpers_1 = require("../metadata-helpers");
-const CarouselNative_1 = require("./CarouselNative");
-const abstractions_1 = require("../abstractions");
-const COMP = "Carousel";
-exports.CarouselMd = (0, metadata_helpers_1.createMetadata)({
-    status: "stable",
-    description: `This component displays a slideshow by cycling through elements (images, text, or ` +
-        `custom slides) like a carousel.`,
-    props: {
-        orientation: {
-            description: "This property indicates the orientation of the carousel. The `horizontal` " +
-                "value indicates that the carousel moves horizontally, and the `vertical` " +
-                "value indicates that the carousel moves vertically.",
-            availableValues: abstractions_1.orientationOptionMd,
-            valueType: "string",
-            defaultValue: CarouselNative_1.defaultProps.orientation,
-        },
-        indicators: {
-            description: "Display the individual slides as buttons (`true`) or not (`false`).",
-            valueType: "boolean",
-            defaultValue: CarouselNative_1.defaultProps.indicators,
-        },
-        controls: {
-            description: "Display the previous/next controls (`true`) or not (`false`).",
-            valueType: "boolean",
-            defaultValue: CarouselNative_1.defaultProps.controls,
-        },
-        autoplay: {
-            description: "Start scrolling the carousel automatically (`true`) or not (`false`).",
-            valueType: "boolean",
-            defaultValue: CarouselNative_1.defaultProps.autoplay,
-        },
-        loop: {
-            description: "Sets whether the carousel should loop back to the start/end when it reaches the last/first slide.",
-            valueType: "boolean",
-            defaultValue: CarouselNative_1.defaultProps.loop,
-        },
-        startIndex: {
-            description: "The index of the first slide to display.",
-            valueType: "number",
-            defaultValue: CarouselNative_1.defaultProps.startIndex,
-        },
-        transitionDuration: {
-            description: "The duration of the transition between slides.",
-            valueType: "number",
-            defaultValue: CarouselNative_1.defaultProps.transitionDuration,
-        },
-        autoplayInterval: {
-            description: "Specifies the interval between autoplay transitions.",
-            valueType: "number",
-            defaultValue: CarouselNative_1.defaultProps.autoplayInterval,
-        },
-        stopAutoplayOnInteraction: {
-            description: "This property indicates whether autoplay stops on user interaction.",
-            valueType: "boolean",
-            defaultValue: CarouselNative_1.defaultProps.stopAutoplayOnInteraction,
-        },
-        prevIcon: {
-            description: "The icon to display for the previous control.",
-            valueType: "string",
-        },
-        nextIcon: {
-            description: "The icon to display for the next control.",
-            valueType: "string",
-        },
-    },
-    events: {
-        displayDidChange: (0, metadata_helpers_1.dDidChange)(COMP),
-    },
-    apis: {
-        canScrollPrev: {
-            description: `This method returns \`true\` if the carousel can scroll to the previous slide.`,
-            signature: "canScrollPrev(): boolean",
-        },
-        canScrollNext: {
-            description: `This method returns \`true\` if the carousel can scroll to the next slide.`,
-            signature: "canScrollNext(): boolean",
-        },
-        scrollTo: {
-            description: `This method scrolls the carousel to the specified slide index.`,
-            signature: "scrollTo(index: number): void",
-            parameters: {
-                index: "The index of the slide to scroll to.",
-            },
-        },
-        scrollPrev: {
-            signature: "scrollPrev(): void",
-            description: "This method scrolls the carousel to the previous slide.",
-        },
-        scrollNext: {
-            signature: "scrollNext(): void",
-            description: "This method scrolls the carousel to the next slide.",
-        },
-    },
-    themeVars: (0, themeVars_1.parseScssVar)(Carousel_module_scss_1.default.themeVars),
-    defaultThemeVars: {
-        [`backgroundColor-control-${COMP}`]: "$color-primary",
-        [`textColor-control-${COMP}`]: "$textColor",
-        [`backgroundColor-control-hover-${COMP}`]: "$color-primary",
-        [`textColor-control-hover-${COMP}`]: "$textColor",
-        [`backgroundColor-control-active-${COMP}`]: "$color-primary",
-        [`backgroundColor-control-disabled-${COMP}`]: "$color-surface-200",
-        [`textColor-control-disabled-${COMP}`]: "$textColor-disabled",
-        [`textColor-control-active-${COMP}`]: "$color-primary",
-        [`backgroundColor-indicator-${COMP}`]: "$color-surface-200",
-        [`backgroundColor-indicator-active-${COMP}`]: "$color-primary",
-        [`textColor-indicator-${COMP}`]: "$color-primary",
-        [`textColor-indicator-active-${COMP}`]: "$color-primary",
-        [`backgroundColor-indicator-hover-${COMP}`]: "$color-surface-200",
-        [`textColor-indicator-hover-${COMP}`]: "$color-primary",
-        [`width-indicator-${COMP}`]: "25px",
-        [`height-indicator-${COMP}`]: "6px",
-        [`height-control-${COMP}`]: "36px",
-        [`width-control-${COMP}`]: "36px",
-        [`borderRadius-control-${COMP}`]: "50%",
-        [`height-${COMP}`]: "100%",
-        [`width-${COMP}`]: "100%",
-    },
-});
-exports.carouselComponentRenderer = (0, renderers_1.createComponentRenderer)(COMP, exports.CarouselMd, ({ node, renderChild, className, extractValue, lookupEventHandler, registerComponentApi }) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-    return ((0, jsx_runtime_1.jsx)(CarouselNative_1.CarouselComponent, { className: className, stopAutoplayOnInteraction: extractValue.asOptionalBoolean((_a = node.props) === null || _a === void 0 ? void 0 : _a.stopAutoplayOnInteraction), autoplayInterval: extractValue.asOptionalNumber((_b = node.props) === null || _b === void 0 ? void 0 : _b.autoplayInterval), transitionDuration: extractValue.asOptionalNumber((_c = node.props) === null || _c === void 0 ? void 0 : _c.transitionDuration), indicators: extractValue.asOptionalBoolean((_d = node.props) === null || _d === void 0 ? void 0 : _d.indicators), controls: extractValue.asOptionalBoolean((_e = node.props) === null || _e === void 0 ? void 0 : _e.controls), orientation: extractValue((_f = node.props) === null || _f === void 0 ? void 0 : _f.orientation), onDisplayDidChange: lookupEventHandler("displayDidChange"), autoplay: extractValue.asOptionalBoolean((_g = node.props) === null || _g === void 0 ? void 0 : _g.autoplay), registerComponentApi: registerComponentApi, loop: extractValue.asOptionalBoolean((_h = node.props) === null || _h === void 0 ? void 0 : _h.loop), startIndex: extractValue.asOptionalNumber((_j = node.props) === null || _j === void 0 ? void 0 : _j.startIndex), prevIcon: extractValue((_k = node.props) === null || _k === void 0 ? void 0 : _k.prevIcon), nextIcon: extractValue((_l = node.props) === null || _l === void 0 ? void 0 : _l.nextIcon), children: renderChild(node.children) }));
-});