ur-ui-kit-tm/dist/stories/HouseMap.stories.js

unlimited robotics ui kit

var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
import { jsx as _jsx } from "react/jsx-runtime";
import { useState } from "react";
import { HouseMap } from "..";
var rooms = [
    {
        id: "1",
        name: "Dining Room",
        coordinates: {
            x1: 269,
            x2: 1366,
            y1: 0,
            y2: 1064,
        },
    },
    {
        id: "2",
        name: "Master Bedroom",
        coordinates: {
            x1: 1367,
            x2: 2563,
            y1: 0,
            y2: 754,
        },
    },
    {
        id: "3",
        name: "Kitchen",
        coordinates: {
            x1: 0,
            x2: 935,
            y1: 1353,
            y2: 2302,
        },
    },
    {
        id: "4",
        name: "Bath",
        coordinates: {
            x1: 936,
            x2: 1440,
            y1: 1051,
            y2: 1600,
        },
    },
    {
        id: "5",
        name: "Bedroom 1",
        coordinates: {
            x1: 1908,
            x2: 2562,
            y1: 1349,
            y2: 2302,
        },
    },
    {
        id: "6",
        name: "Bedroom 2",
        coordinates: {
            x1: 930,
            x2: 1734,
            y1: 1586,
            y2: 2302,
        },
    },
    {
        id: "7",
        name: "Library",
        coordinates: {
            x1: 1726,
            x2: 2116,
            y1: 754,
            y2: 1349,
        },
    },
    {
        id: "8",
        name: "Master Bedroom Bath",
        coordinates: {
            x1: 2117,
            x2: 1734,
            y1: 754,
            y2: 1349,
        },
    },
];
export default {
    title: "Example/HouseMap",
    component: HouseMap,
    argTypes: {
        mapUrl: { controls: "text" },
        hideMap: {
            controls: "boolean",
            default: false,
        },
        areaSelected: {
            controls: "text",
        },
        onAreaSelected: {
            type: "function",
            description: "A function that gets the id of clicked place",
        },
        onNavigate: {
            type: "function",
            description: "A function that gets the id of room to navigate",
        },
    },
};
var Template = function (args) {
    return _jsx(HouseMap, __assign({}, args), void 0);
};
export var Basic = Template.bind({});
Basic.args = {
    mapUrl: "https://www.theoaksatcanterbury.com/wp-content/uploads/2019/08/3-Bedroom-1.5-Bath-Empty-Level-2D-Floor-Plan.jpg",
    hideMap: false,
    areaSelected: "3",
    rooms: rooms,
};
var TemplateSelectable = function (args) {
    var _a = useState(), selected = _a[0], setSelected = _a[1];
    return _jsx(HouseMap, __assign({}, args, { onAreaSelected: function (id) { return setSelected(id); }, areaSelected: selected }), void 0);
};
export var Selectable = TemplateSelectable.bind({});
Selectable.args = {
    mapUrl: "https://www.theoaksatcanterbury.com/wp-content/uploads/2019/08/3-Bedroom-1.5-Bath-Empty-Level-2D-Floor-Plan.jpg",
    hideMap: false,
    rooms: rooms,
};