@wener/ui
Version:
35 lines • 1.61 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.UnstatedCounter = void 0;
const react_1 = __importDefault(require("react"));
const unstated_1 = require("./unstated");
exports.default = {
title: 'hooks/unstated',
};
function useCounter(initialState = 0) {
const [count, setCount] = react_1.default.useState(initialState);
const decrement = () => setCount(count - 1);
const increment = () => setCount(count + 1);
return { count, decrement, increment };
}
const Counter = unstated_1.createContainer(useCounter);
function CounterDisplay() {
const counter = Counter.useContainer();
return (react_1.default.createElement("div", null,
react_1.default.createElement("button", { onClick: counter.decrement }, "-"),
react_1.default.createElement("span", null, counter.count),
react_1.default.createElement("button", { onClick: counter.increment }, "+")));
}
exports.UnstatedCounter = () => {
return (react_1.default.createElement(Counter.Provider, null,
react_1.default.createElement(CounterDisplay, null),
react_1.default.createElement(CounterDisplay, null),
react_1.default.createElement(Counter.Provider, { initialState: 2 },
react_1.default.createElement("div", null,
react_1.default.createElement("div", null,
react_1.default.createElement(CounterDisplay, null))))));
};
//# sourceMappingURL=unstated.stories.js.map