@onesy/style-react/StyleProvider/Style.js

Onesy CSS in JS styling solution for React

"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 });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = __importDefault(require("react"));
const is_1 = __importDefault(require("@onesy/utils/is"));
const style_1 = require("@onesy/style");
const Context_1 = __importDefault(require("./Context"));
function makeOnesyStyle(element) {
    const onesyStyle = new style_1.OnesyStyle({
        element
    });
    // Add all the plugins
    onesyStyle.plugins.add = [
        style_1.unit,
        style_1.makeClassName,
        style_1.prefix,
        style_1.sort,
        style_1.rtl,
        style_1.valueObject
    ];
    return onesyStyle;
}
const Style = react_1.default.forwardRef((props, ref) => {
    const { root = false, remove, value: value_, children } = props, other = __rest(props, ["root", "remove", "value", "children"]);
    const refs = {
        root: react_1.default.useRef(undefined)
    };
    const [value, setValue] = react_1.default.useState(() => {
        if (value_ === undefined || !(value_ instanceof style_1.OnesyStyle))
            return makeOnesyStyle();
        value_.remove = remove;
        return value_;
    });
    react_1.default.useEffect(() => {
        if (refs.root.current) {
            value.element = refs.root.current;
            value.remove = remove;
            // Init
            value.init();
            const valueNew = new style_1.OnesyStyle();
            // Copy over from value
            Object.keys(value).forEach((prop) => valueNew[prop] = value[prop]);
            setValue(valueNew);
        }
    }, []);
    const update = (updateValue) => {
        if (updateValue !== undefined) {
            const valueNew = new style_1.OnesyStyle();
            valueNew.remove = remove;
            Object.keys(value).forEach((prop) => valueNew[prop] = value[prop]);
            (0, is_1.default)('object', updateValue) && Object.keys(updateValue).forEach((prop) => valueNew[prop] = updateValue[prop]);
            setValue(valueNew);
            return valueNew;
        }
    };
    // Update method
    value.updateWithRerender = update;
    if (root)
        return ((0, jsx_runtime_1.jsx)(Context_1.default.Provider, Object.assign({ value: value }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ ref: (item) => {
                    refs.root.current = item;
                    if (ref === null || ref === void 0 ? void 0 : ref.current)
                        ref.current = item;
                } }, other, { children: children })) })));
    return ((0, jsx_runtime_1.jsx)(Context_1.default.Provider, Object.assign({ value: value }, { children: children })));
});
exports.default = Style;