utils_react-nexacro_index.js

/**
 * 넥사크로 환경에서 React 기반 렌더링을 지원하는 네임스페이스.
 * 전역 객체 `$react`를 통해 접근할 수 있습니다.
 *
 * @example
 * // 1. 기본 사용법 (전역 객체 활용)
 * const { React, createNexacroRoot, NxDiv, NxButton, NxStatic } = $react;
 *
 * function MyApp() {
 *     const [count, setCount] = React.useState(0);
 *     return React.createElement(
 *         NxDiv,
 *         { left: 0, top: 0, width: 400, height: 300 },
 *         React.createElement(NxStatic, {
 *             left: 10,
 *             top: 10,
 *             width: 200,
 *             height: 30,
 *             text: `count: ${count}`,
 *         }),
 *         React.createElement(NxButton, {
 *             left: 10,
 *             top: 50,
 *             width: 100,
 *             height: 30,
 *             text: "증가",
 *             onClick: () => setCount((c) => c + 1),
 *         }),
 *     );
 * }
 *
 * // 넥사크로 Form의 onload 이벤트 등에서 호출
 * const root = createNexacroRoot(this.div_container);
 * root.render(React.createElement(MyApp));
 *
 * // 2. 데이터셋 연동 예시
 * const { useNexacroDataset, NxGrid } = $react;
 *
 * function MyGrid() {
 *     // 데이터셋 변경 감지 및 리렌더링 구독
 *     const ds = useNexacroDataset(this.ds_list);
 *
 *     return React.createElement(NxGrid, {
 *         left: 0,
 *         top: 0,
 *         right: 0,
 *         bottom: 0,
 *         binddataset: ds.name,
 *     });
 * }
 *
 * @namespace $react
 */

export { createNexacroRoot } from "./root";
export {
    NxDiv,
    NxStatic,
    NxButton,
    NxEdit,
    NxTextArea,
    NxCheckBox,
    NxCombo,
    NxCalendar,
    NxSpin,
    NxGrid,
    NxTab,
    NxImage,
    NxProgressBar,
    NxListBox,
    NxPanel,
} from "./components";

export { NxStack, NxVBox, NxHBox } from "./layouts";

export { useNexacroDataset } from "./hooks";