@elmethis/react 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Ikuma Yamashita
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,75 @@
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## React Compiler
+
+The React Compiler is enabled on this template. See [this documentation](https://react.dev/learn/react-compiler) for more information.
+
+Note: This will impact Vite dev & build performances.
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
+
+```js
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+
+      // Remove tseslint.configs.recommended and replace with this
+      tseslint.configs.recommendedTypeChecked,
+      // Alternatively, use this for stricter rules
+      tseslint.configs.strictTypeChecked,
+      // Optionally, add this for stylistic rules
+      tseslint.configs.stylisticTypeChecked,
+
+      // Other configs...
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
+```
+
+You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
+
+```js
+// eslint.config.js
+import reactX from 'eslint-plugin-react-x'
+import reactDom from 'eslint-plugin-react-dom'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+      // Enable lint rules for React
+      reactX.configs['recommended-typescript'],
+      // Enable lint rules for React DOM
+      reactDom.configs.recommended,
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
+```

package/dist/App.d.ts

@@ -0,0 +1,2 @@
+declare function App(): import("react/jsx-runtime").JSX.Element;
+export default App;

package/dist/_virtual/compiler-runtime.mjs

@@ -0,0 +1,5 @@
+import { __require as requireCompilerRuntime } from "../node_modules/.pnpm/react@19.2.0/node_modules/react/compiler-runtime.mjs";
+var compilerRuntimeExports = requireCompilerRuntime();
+export {
+  compilerRuntimeExports as c
+};

package/dist/_virtual/compiler-runtime2.mjs

@@ -0,0 +1,4 @@
+var compilerRuntime = { exports: {} };
+export {
+  compilerRuntime as __module
+};

package/dist/_virtual/jsx-runtime.mjs

@@ -0,0 +1,5 @@
+import { __require as requireJsxRuntime } from "../node_modules/.pnpm/react@19.2.0/node_modules/react/jsx-runtime.mjs";
+var jsxRuntimeExports = requireJsxRuntime();
+export {
+  jsxRuntimeExports as j
+};

package/dist/_virtual/jsx-runtime2.mjs

@@ -0,0 +1,4 @@
+var jsxRuntime = { exports: {} };
+export {
+  jsxRuntime as __module
+};

package/dist/_virtual/react-compiler-runtime.development.mjs

@@ -0,0 +1,4 @@
+var reactCompilerRuntime_development = {};
+export {
+  reactCompilerRuntime_development as __exports
+};

package/dist/_virtual/react-compiler-runtime.production.mjs

@@ -0,0 +1,4 @@
+var reactCompilerRuntime_production = {};
+export {
+  reactCompilerRuntime_production as __exports
+};

package/dist/_virtual/react-jsx-runtime.development.mjs

@@ -0,0 +1,4 @@
+var reactJsxRuntime_development = {};
+export {
+  reactJsxRuntime_development as __exports
+};

package/dist/_virtual/react-jsx-runtime.production.mjs

@@ -0,0 +1,4 @@
+var reactJsxRuntime_production = {};
+export {
+  reactJsxRuntime_production as __exports
+};

package/dist/components/icon/ElmInlineIcon.d.ts

@@ -0,0 +1,3 @@
+import { ComponentProps } from 'react';
+export type ElmInlineIconProps = ComponentProps<"img">;
+export declare const ElmInlineIcon: (props: ElmInlineIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/icon/ElmInlineIcon.mjs

@@ -0,0 +1,19 @@
+import { j as jsxRuntimeExports } from "../../_virtual/jsx-runtime.mjs";
+import { c as compilerRuntimeExports } from "../../_virtual/compiler-runtime.mjs";
+import "react";
+import style from "./ElmInlineIcon.module.scss.mjs";
+const ElmInlineIcon = (props) => {
+  const $ = compilerRuntimeExports.c(2);
+  let t0;
+  if ($[0] !== props) {
+    t0 = /* @__PURE__ */ jsxRuntimeExports.jsx("img", { ...props, className: style.icon });
+    $[0] = props;
+    $[1] = t0;
+  } else {
+    t0 = $[1];
+  }
+  return t0;
+};
+export {
+  ElmInlineIcon
+};

package/dist/components/icon/ElmInlineIcon.module.scss.mjs

@@ -0,0 +1,20 @@
+(function() {
+  "use strict";
+  try {
+    if (typeof document != "undefined") {
+      var elementStyle = document.createElement("style");
+      elementStyle.appendChild(document.createTextNode("._icon_19g82_1{margin:0;padding:0;display:inline-block;vertical-align:middle;height:1em}._icon_19g82_1::-moz-selection{filter:brightness(1000%);background-color:#00000040;background-color:var(--color, rgba(0, 0, 0, .25))}._icon_19g82_1::selection{filter:brightness(1000%);background-color:#00000040;background-color:var(--color, rgba(0, 0, 0, .25))}[data-theme=dark] ._icon_19g82_1{color:#ffffffb3;color:var(--color, rgba(255, 255, 255, .7))}[data-theme=dark] ._icon_19g82_1::-moz-selection{color:#000000b3;background-color:#ffffff40;background-color:var(--color, rgba(255, 255, 255, .25))}[data-theme=dark] ._icon_19g82_1::selection{color:#000000b3;background-color:#ffffff40;background-color:var(--color, rgba(255, 255, 255, .25))}"));
+      document.head.appendChild(elementStyle);
+    }
+  } catch (e) {
+    console.error("vite-plugin-css-injected-by-js", e);
+  }
+})();
+const icon = "_icon_19g82_1";
+const style = {
+  icon
+};
+export {
+  style as default,
+  icon
+};

package/dist/components/icon/ElmInlineIcon.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { ElmInlineIcon } from './ElmInlineIcon';
+declare const meta: Meta<typeof ElmInlineIcon>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;

package/dist/components/template/ElmTemplate.d.ts

@@ -0,0 +1,5 @@
+type ElmTemplateProps = {
+    message: string;
+};
+declare const ElmTemplate: ({ message }: ElmTemplateProps) => import("react/jsx-runtime").JSX.Element;
+export default ElmTemplate;

package/dist/components/template/ElmTemplate.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { default as ElmTemplate } from './ElmTemplate';
+declare const meta: Meta<typeof ElmTemplate>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;

package/dist/components/typography/ElmInlineText.d.ts

@@ -0,0 +1,54 @@
+import { ComponentProps, CSSProperties } from 'react';
+export interface ElmInlineTextProps extends ComponentProps<"span"> {
+    /**
+     * The text to display.
+     */
+    text?: string;
+    /**
+     * Specifies the color of the text.
+     *
+     * e.g.) `'red'`, `'#ff0000'`, `'rgba(255, 0, 0, 0.5)'`
+     */
+    color?: CSSProperties["color"];
+    /**
+     * Specifies the font size of the text.
+     */
+    size?: CSSProperties["fontSize"];
+    /**
+     * Specifies whether the text should be bold.
+     */
+    bold?: boolean;
+    /**
+     * Specifies whether the text should be italic.
+     */
+    italic?: boolean;
+    /**
+     * Specifies whether the text should be underlined.
+     */
+    underline?: boolean;
+    /**
+     * Specifies whether the text should be strikethrough.
+     */
+    strikethrough?: boolean;
+    /**
+     * Specifies whether the text should be displayed as code.
+     */
+    code?: boolean;
+    kbd?: boolean;
+    /**
+     * Specifies the background color of the text.
+     */
+    backgroundColor?: CSSProperties["backgroundColor"];
+    /**
+     * The ruby text to display.
+     */
+    ruby?: string;
+    /**
+     * The URL to navigate to.
+     *
+     * e.g. `https://example.com`
+     */
+    href?: string;
+    favicon?: string;
+}
+export declare const ElmInlineText: (props: ElmInlineTextProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/typography/ElmInlineText.mjs

@@ -0,0 +1,41 @@
+import { j as jsxRuntimeExports } from "../../_virtual/jsx-runtime.mjs";
+import "react";
+import textStyle from "../../styles/text.module.scss.mjs";
+import style from "./ElmInlineText.module.scss.mjs";
+import { clsx } from "../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs";
+import { ElmInlineIcon } from "../icon/ElmInlineIcon.mjs";
+import { getLuminance } from "polished";
+const ElmInlineText = (props) => {
+  const render = () => {
+    const color = props.backgroundColor != null ? getLuminance(props.backgroundColor) < 0.5 ? "rgba(255, 255, 255, 0.7)" : "rgba(0, 0, 0, 0.7)" : void 0;
+    if (props.href) {
+      return /* @__PURE__ */ jsxRuntimeExports.jsxs("a", { className: style.link, href: props.href, target: "blank", rel: "noopener noreferrer", children: [
+        props.favicon && /* @__PURE__ */ jsxRuntimeExports.jsx(ElmInlineIcon, { src: props.favicon }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: props.text || props.children })
+      ] });
+    } else if (props.kbd) {
+      return /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", { className: clsx([textStyle.text, style.kbd]), children: props.text || props.children });
+    } else {
+      const classes = [];
+      if (props.underline) classes.push(style.underline);
+      let component = /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: clsx([textStyle.text, style.base].concat(classes)), style: {
+        "--color": props.color ?? color,
+        "--font-size": props.size,
+        "--background-color": props.backgroundColor
+      }, children: props.text || props.children });
+      if (props.bold) component = /* @__PURE__ */ jsxRuntimeExports.jsx("strong", { children: component });
+      if (props.italic) component = /* @__PURE__ */ jsxRuntimeExports.jsx("em", { children: component });
+      if (props.strikethrough) component = /* @__PURE__ */ jsxRuntimeExports.jsx("del", { children: component });
+      if (props.code) component = /* @__PURE__ */ jsxRuntimeExports.jsx("code", { className: style.code, children: component });
+      if (props.ruby) component = /* @__PURE__ */ jsxRuntimeExports.jsxs("ruby", { className: textStyle.text, children: [
+        component,
+        /* @__PURE__ */ jsxRuntimeExports.jsx("rt", { children: props.ruby })
+      ] });
+      return component;
+    }
+  };
+  return render();
+};
+export {
+  ElmInlineText
+};

package/dist/components/typography/ElmInlineText.module.scss.mjs

@@ -0,0 +1,32 @@
+(function() {
+  "use strict";
+  try {
+    if (typeof document != "undefined") {
+      var elementStyle = document.createElement("style");
+      elementStyle.appendChild(document.createTextNode('._base_ctq5w_1{background-color:var(--background-color)}._underline_ctq5w_5{text-decoration:underline}._link_ctq5w_9{all:unset;box-sizing:border-box;padding:0 .25rem;font-size:var(--font-size);display:inline-flex;align-items:center;gap:.25rem;cursor:pointer;color:#6987b8;border-radius:.125rem;transition:background-color .2s,color .2s,opacity .2s}._link_ctq5w_9:hover{background-color:#6987b833}._link_ctq5w_9:active{opacity:.5}._link_ctq5w_9:visited{color:#9771bd;border-bottom:dashed 1px #9771bd}._link_ctq5w_9:visited:hover{background-color:#9771bd33}._code_ctq5w_36{margin-inline:.25rem;padding:2px .5em;font-size:calc(1em - 2px);border-radius:.125rem;background-color:#00000013;font-family:"Source Code Pro" monospace}._kbd_ctq5w_45{padding:.125rem .25rem;position:relative;border-radius:.125rem;background-color:#e6e6e6}[data-theme=dark] ._kbd_ctq5w_45{background-color:#404040}._kbd_ctq5w_45:before{z-index:-1;position:absolute;content:"";bottom:-.25em;left:0;height:100%;width:100%;background-color:#ccc;border-radius:0 0 .125rem .125rem;box-shadow:0 0 .125em #00000080}[data-theme=dark] ._kbd_ctq5w_45:before{background-color:#595959;box-shadow:0 0 .125em #ffffff80}'));
+      document.head.appendChild(elementStyle);
+    }
+  } catch (e) {
+    console.error("vite-plugin-css-injected-by-js", e);
+  }
+})();
+const base = "_base_ctq5w_1";
+const underline = "_underline_ctq5w_5";
+const link = "_link_ctq5w_9";
+const code = "_code_ctq5w_36";
+const kbd = "_kbd_ctq5w_45";
+const style = {
+  base,
+  underline,
+  link,
+  code,
+  kbd
+};
+export {
+  base,
+  code,
+  style as default,
+  kbd,
+  link,
+  underline
+};

package/dist/components/typography/ElmInlineText.stories.d.ts

@@ -0,0 +1,11 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { ElmInlineText } from './ElmInlineText';
+declare const meta: Meta<typeof ElmInlineText>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;
+export declare const Colored: Story;
+export declare const Kbd: Story;
+export declare const Background: Story;
+export declare const Ruby: Story;
+export declare const Link: Story;

package/dist/components/typography/ElmParagraph.d.ts

@@ -0,0 +1,3 @@
+import { ComponentProps } from 'react';
+export type ElmParagraphProps = ComponentProps<"p">;
+export declare const ElmParagraph: (props: ElmParagraphProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/typography/ElmParagraph.mjs

@@ -0,0 +1,18 @@
+import { j as jsxRuntimeExports } from "../../_virtual/jsx-runtime.mjs";
+import { c as compilerRuntimeExports } from "../../_virtual/compiler-runtime.mjs";
+import textStyle from "../../styles/text.module.scss.mjs";
+const ElmParagraph = (props) => {
+  const $ = compilerRuntimeExports.c(2);
+  let t0;
+  if ($[0] !== props.children) {
+    t0 = /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: textStyle.text, children: props.children });
+    $[0] = props.children;
+    $[1] = t0;
+  } else {
+    t0 = $[1];
+  }
+  return t0;
+};
+export {
+  ElmParagraph
+};

package/dist/components/typography/ElmParagraph.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react-vite';
+import { ElmParagraph } from './ElmParagraph';
+declare const meta: Meta<typeof ElmParagraph>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Primary: Story;

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export { ElmInlineIcon, type ElmInlineIconProps, } from './components/icon/ElmInlineIcon';
+export { ElmInlineText, type ElmInlineTextProps, } from './components/typography/ElmInlineText';
+export { ElmParagraph, type ElmParagraphProps, } from './components/typography/ElmParagraph';

package/dist/index.mjs

@@ -0,0 +1,8 @@
+import { ElmInlineIcon } from "./components/icon/ElmInlineIcon.mjs";
+import { ElmInlineText } from "./components/typography/ElmInlineText.mjs";
+import { ElmParagraph } from "./components/typography/ElmParagraph.mjs";
+export {
+  ElmInlineIcon,
+  ElmInlineText,
+  ElmParagraph
+};

package/dist/node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs

@@ -0,0 +1,17 @@
+function r(e) {
+  var t, f, n = "";
+  if ("string" == typeof e || "number" == typeof e) n += e;
+  else if ("object" == typeof e) if (Array.isArray(e)) {
+    var o = e.length;
+    for (t = 0; t < o; t++) e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+  } else for (f in e) e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length; f < o; f++) (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+export {
+  clsx,
+  clsx as default
+};

package/dist/node_modules/.pnpm/react@19.2.0/node_modules/react/cjs/react-compiler-runtime.development.mjs

@@ -0,0 +1,30 @@
+import { __exports as reactCompilerRuntime_development } from "../../../../../../_virtual/react-compiler-runtime.development.mjs";
+import require$$0 from "react";
+/**
+ * @license React
+ * react-compiler-runtime.development.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var hasRequiredReactCompilerRuntime_development;
+function requireReactCompilerRuntime_development() {
+  if (hasRequiredReactCompilerRuntime_development) return reactCompilerRuntime_development;
+  hasRequiredReactCompilerRuntime_development = 1;
+  "production" !== process.env.NODE_ENV && (function() {
+    var ReactSharedInternals = require$$0.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
+    reactCompilerRuntime_development.c = function(size) {
+      var dispatcher = ReactSharedInternals.H;
+      null === dispatcher && console.error(
+        "Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:\n1. You might have mismatching versions of React and the renderer (such as React DOM)\n2. You might be breaking the Rules of Hooks\n3. You might have more than one copy of React in the same app\nSee https://react.dev/link/invalid-hook-call for tips about how to debug and fix this problem."
+      );
+      return dispatcher.useMemoCache(size);
+    };
+  })();
+  return reactCompilerRuntime_development;
+}
+export {
+  requireReactCompilerRuntime_development as __require
+};

package/dist/node_modules/.pnpm/react@19.2.0/node_modules/react/cjs/react-compiler-runtime.production.mjs

@@ -0,0 +1,24 @@
+import { __exports as reactCompilerRuntime_production } from "../../../../../../_virtual/react-compiler-runtime.production.mjs";
+import require$$0 from "react";
+/**
+ * @license React
+ * react-compiler-runtime.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var hasRequiredReactCompilerRuntime_production;
+function requireReactCompilerRuntime_production() {
+  if (hasRequiredReactCompilerRuntime_production) return reactCompilerRuntime_production;
+  hasRequiredReactCompilerRuntime_production = 1;
+  var ReactSharedInternals = require$$0.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
+  reactCompilerRuntime_production.c = function(size) {
+    return ReactSharedInternals.H.useMemoCache(size);
+  };
+  return reactCompilerRuntime_production;
+}
+export {
+  requireReactCompilerRuntime_production as __require
+};

package/dist/node_modules/.pnpm/react@19.2.0/node_modules/react/cjs/react-jsx-runtime.development.mjs

@@ -0,0 +1,270 @@
+import { __exports as reactJsxRuntime_development } from "../../../../../../_virtual/react-jsx-runtime.development.mjs";
+import require$$0 from "react";
+/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var hasRequiredReactJsxRuntime_development;
+function requireReactJsxRuntime_development() {
+  if (hasRequiredReactJsxRuntime_development) return reactJsxRuntime_development;
+  hasRequiredReactJsxRuntime_development = 1;
+  "production" !== process.env.NODE_ENV && (function() {
+    function getComponentNameFromType(type) {
+      if (null == type) return null;
+      if ("function" === typeof type)
+        return type.$$typeof === REACT_CLIENT_REFERENCE ? null : type.displayName || type.name || null;
+      if ("string" === typeof type) return type;
+      switch (type) {
+        case REACT_FRAGMENT_TYPE:
+          return "Fragment";
+        case REACT_PROFILER_TYPE:
+          return "Profiler";
+        case REACT_STRICT_MODE_TYPE:
+          return "StrictMode";
+        case REACT_SUSPENSE_TYPE:
+          return "Suspense";
+        case REACT_SUSPENSE_LIST_TYPE:
+          return "SuspenseList";
+        case REACT_ACTIVITY_TYPE:
+          return "Activity";
+      }
+      if ("object" === typeof type)
+        switch ("number" === typeof type.tag && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), type.$$typeof) {
+          case REACT_PORTAL_TYPE:
+            return "Portal";
+          case REACT_CONTEXT_TYPE:
+            return type.displayName || "Context";
+          case REACT_CONSUMER_TYPE:
+            return (type._context.displayName || "Context") + ".Consumer";
+          case REACT_FORWARD_REF_TYPE:
+            var innerType = type.render;
+            type = type.displayName;
+            type || (type = innerType.displayName || innerType.name || "", type = "" !== type ? "ForwardRef(" + type + ")" : "ForwardRef");
+            return type;
+          case REACT_MEMO_TYPE:
+            return innerType = type.displayName || null, null !== innerType ? innerType : getComponentNameFromType(type.type) || "Memo";
+          case REACT_LAZY_TYPE:
+            innerType = type._payload;
+            type = type._init;
+            try {
+              return getComponentNameFromType(type(innerType));
+            } catch (x) {
+            }
+        }
+      return null;
+    }
+    function testStringCoercion(value) {
+      return "" + value;
+    }
+    function checkKeyStringCoercion(value) {
+      try {
+        testStringCoercion(value);
+        var JSCompiler_inline_result = false;
+      } catch (e) {
+        JSCompiler_inline_result = true;
+      }
+      if (JSCompiler_inline_result) {
+        JSCompiler_inline_result = console;
+        var JSCompiler_temp_const = JSCompiler_inline_result.error;
+        var JSCompiler_inline_result$jscomp$0 = "function" === typeof Symbol && Symbol.toStringTag && value[Symbol.toStringTag] || value.constructor.name || "Object";
+        JSCompiler_temp_const.call(
+          JSCompiler_inline_result,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          JSCompiler_inline_result$jscomp$0
+        );
+        return testStringCoercion(value);
+      }
+    }
+    function getTaskName(type) {
+      if (type === REACT_FRAGMENT_TYPE) return "<>";
+      if ("object" === typeof type && null !== type && type.$$typeof === REACT_LAZY_TYPE)
+        return "<...>";
+      try {
+        var name = getComponentNameFromType(type);
+        return name ? "<" + name + ">" : "<...>";
+      } catch (x) {
+        return "<...>";
+      }
+    }
+    function getOwner() {
+      var dispatcher = ReactSharedInternals.A;
+      return null === dispatcher ? null : dispatcher.getOwner();
+    }
+    function UnknownOwner() {
+      return Error("react-stack-top-frame");
+    }
+    function hasValidKey(config) {
+      if (hasOwnProperty.call(config, "key")) {
+        var getter = Object.getOwnPropertyDescriptor(config, "key").get;
+        if (getter && getter.isReactWarning) return false;
+      }
+      return void 0 !== config.key;
+    }
+    function defineKeyPropWarningGetter(props, displayName) {
+      function warnAboutAccessingKey() {
+        specialPropKeyWarningShown || (specialPropKeyWarningShown = true, console.error(
+          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
+          displayName
+        ));
+      }
+      warnAboutAccessingKey.isReactWarning = true;
+      Object.defineProperty(props, "key", {
+        get: warnAboutAccessingKey,
+        configurable: true
+      });
+    }
+    function elementRefGetterWithDeprecationWarning() {
+      var componentName = getComponentNameFromType(this.type);
+      didWarnAboutElementRef[componentName] || (didWarnAboutElementRef[componentName] = true, console.error(
+        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
+      ));
+      componentName = this.props.ref;
+      return void 0 !== componentName ? componentName : null;
+    }
+    function ReactElement(type, key, props, owner, debugStack, debugTask) {
+      var refProp = props.ref;
+      type = {
+        $$typeof: REACT_ELEMENT_TYPE,
+        type,
+        key,
+        props,
+        _owner: owner
+      };
+      null !== (void 0 !== refProp ? refProp : null) ? Object.defineProperty(type, "ref", {
+        enumerable: false,
+        get: elementRefGetterWithDeprecationWarning
+      }) : Object.defineProperty(type, "ref", { enumerable: false, value: null });
+      type._store = {};
+      Object.defineProperty(type._store, "validated", {
+        configurable: false,
+        enumerable: false,
+        writable: true,
+        value: 0
+      });
+      Object.defineProperty(type, "_debugInfo", {
+        configurable: false,
+        enumerable: false,
+        writable: true,
+        value: null
+      });
+      Object.defineProperty(type, "_debugStack", {
+        configurable: false,
+        enumerable: false,
+        writable: true,
+        value: debugStack
+      });
+      Object.defineProperty(type, "_debugTask", {
+        configurable: false,
+        enumerable: false,
+        writable: true,
+        value: debugTask
+      });
+      Object.freeze && (Object.freeze(type.props), Object.freeze(type));
+      return type;
+    }
+    function jsxDEVImpl(type, config, maybeKey, isStaticChildren, debugStack, debugTask) {
+      var children = config.children;
+      if (void 0 !== children)
+        if (isStaticChildren)
+          if (isArrayImpl(children)) {
+            for (isStaticChildren = 0; isStaticChildren < children.length; isStaticChildren++)
+              validateChildKeys(children[isStaticChildren]);
+            Object.freeze && Object.freeze(children);
+          } else
+            console.error(
+              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
+            );
+        else validateChildKeys(children);
+      if (hasOwnProperty.call(config, "key")) {
+        children = getComponentNameFromType(type);
+        var keys = Object.keys(config).filter(function(k) {
+          return "key" !== k;
+        });
+        isStaticChildren = 0 < keys.length ? "{key: someKey, " + keys.join(": ..., ") + ": ...}" : "{key: someKey}";
+        didWarnAboutKeySpread[children + isStaticChildren] || (keys = 0 < keys.length ? "{" + keys.join(": ..., ") + ": ...}" : "{}", console.error(
+          'A props object containing a "key" prop is being spread into JSX:\n  let props = %s;\n  <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n  let props = %s;\n  <%s key={someKey} {...props} />',
+          isStaticChildren,
+          children,
+          keys,
+          children
+        ), didWarnAboutKeySpread[children + isStaticChildren] = true);
+      }
+      children = null;
+      void 0 !== maybeKey && (checkKeyStringCoercion(maybeKey), children = "" + maybeKey);
+      hasValidKey(config) && (checkKeyStringCoercion(config.key), children = "" + config.key);
+      if ("key" in config) {
+        maybeKey = {};
+        for (var propName in config)
+          "key" !== propName && (maybeKey[propName] = config[propName]);
+      } else maybeKey = config;
+      children && defineKeyPropWarningGetter(
+        maybeKey,
+        "function" === typeof type ? type.displayName || type.name || "Unknown" : type
+      );
+      return ReactElement(
+        type,
+        children,
+        maybeKey,
+        getOwner(),
+        debugStack,
+        debugTask
+      );
+    }
+    function validateChildKeys(node) {
+      isValidElement(node) ? node._store && (node._store.validated = 1) : "object" === typeof node && null !== node && node.$$typeof === REACT_LAZY_TYPE && ("fulfilled" === node._payload.status ? isValidElement(node._payload.value) && node._payload.value._store && (node._payload.value._store.validated = 1) : node._store && (node._store.validated = 1));
+    }
+    function isValidElement(object) {
+      return "object" === typeof object && null !== object && object.$$typeof === REACT_ELEMENT_TYPE;
+    }
+    var React = require$$0, REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"), REACT_PORTAL_TYPE = Symbol.for("react.portal"), REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"), REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"), REACT_PROFILER_TYPE = Symbol.for("react.profiler"), REACT_CONSUMER_TYPE = Symbol.for("react.consumer"), REACT_CONTEXT_TYPE = Symbol.for("react.context"), REACT_FORWARD_REF_TYPE = Symbol.for("react.forward_ref"), REACT_SUSPENSE_TYPE = Symbol.for("react.suspense"), REACT_SUSPENSE_LIST_TYPE = Symbol.for("react.suspense_list"), REACT_MEMO_TYPE = Symbol.for("react.memo"), REACT_LAZY_TYPE = Symbol.for("react.lazy"), REACT_ACTIVITY_TYPE = Symbol.for("react.activity"), REACT_CLIENT_REFERENCE = Symbol.for("react.client.reference"), ReactSharedInternals = React.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, hasOwnProperty = Object.prototype.hasOwnProperty, isArrayImpl = Array.isArray, createTask = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    React = {
+      react_stack_bottom_frame: function(callStackForError) {
+        return callStackForError();
+      }
+    };
+    var specialPropKeyWarningShown;
+    var didWarnAboutElementRef = {};
+    var unknownOwnerDebugStack = React.react_stack_bottom_frame.bind(
+      React,
+      UnknownOwner
+    )();
+    var unknownOwnerDebugTask = createTask(getTaskName(UnknownOwner));
+    var didWarnAboutKeySpread = {};
+    reactJsxRuntime_development.Fragment = REACT_FRAGMENT_TYPE;
+    reactJsxRuntime_development.jsx = function(type, config, maybeKey) {
+      var trackActualOwner = 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
+      return jsxDEVImpl(
+        type,
+        config,
+        maybeKey,
+        false,
+        trackActualOwner ? Error("react-stack-top-frame") : unknownOwnerDebugStack,
+        trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
+      );
+    };
+    reactJsxRuntime_development.jsxs = function(type, config, maybeKey) {
+      var trackActualOwner = 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
+      return jsxDEVImpl(
+        type,
+        config,
+        maybeKey,
+        true,
+        trackActualOwner ? Error("react-stack-top-frame") : unknownOwnerDebugStack,
+        trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
+      );
+    };
+  })();
+  return reactJsxRuntime_development;
+}
+export {
+  requireReactJsxRuntime_development as __require
+};

package/dist/node_modules/.pnpm/react@19.2.0/node_modules/react/cjs/react-jsx-runtime.production.mjs

@@ -0,0 +1,41 @@
+import { __exports as reactJsxRuntime_production } from "../../../../../../_virtual/react-jsx-runtime.production.mjs";
+/**
+ * @license React
+ * react-jsx-runtime.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var hasRequiredReactJsxRuntime_production;
+function requireReactJsxRuntime_production() {
+  if (hasRequiredReactJsxRuntime_production) return reactJsxRuntime_production;
+  hasRequiredReactJsxRuntime_production = 1;
+  var REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"), REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
+  function jsxProd(type, config, maybeKey) {
+    var key = null;
+    void 0 !== maybeKey && (key = "" + maybeKey);
+    void 0 !== config.key && (key = "" + config.key);
+    if ("key" in config) {
+      maybeKey = {};
+      for (var propName in config)
+        "key" !== propName && (maybeKey[propName] = config[propName]);
+    } else maybeKey = config;
+    config = maybeKey.ref;
+    return {
+      $$typeof: REACT_ELEMENT_TYPE,
+      type,
+      key,
+      ref: void 0 !== config ? config : null,
+      props: maybeKey
+    };
+  }
+  reactJsxRuntime_production.Fragment = REACT_FRAGMENT_TYPE;
+  reactJsxRuntime_production.jsx = jsxProd;
+  reactJsxRuntime_production.jsxs = jsxProd;
+  return reactJsxRuntime_production;
+}
+export {
+  requireReactJsxRuntime_production as __require
+};

package/dist/node_modules/.pnpm/react@19.2.0/node_modules/react/compiler-runtime.mjs

@@ -0,0 +1,17 @@
+import { __module as compilerRuntime } from "../../../../../_virtual/compiler-runtime2.mjs";
+import { __require as requireReactCompilerRuntime_production } from "./cjs/react-compiler-runtime.production.mjs";
+import { __require as requireReactCompilerRuntime_development } from "./cjs/react-compiler-runtime.development.mjs";
+var hasRequiredCompilerRuntime;
+function requireCompilerRuntime() {
+  if (hasRequiredCompilerRuntime) return compilerRuntime.exports;
+  hasRequiredCompilerRuntime = 1;
+  if (process.env.NODE_ENV === "production") {
+    compilerRuntime.exports = requireReactCompilerRuntime_production();
+  } else {
+    compilerRuntime.exports = requireReactCompilerRuntime_development();
+  }
+  return compilerRuntime.exports;
+}
+export {
+  requireCompilerRuntime as __require
+};

package/dist/node_modules/.pnpm/react@19.2.0/node_modules/react/jsx-runtime.mjs

@@ -0,0 +1,17 @@
+import { __module as jsxRuntime } from "../../../../../_virtual/jsx-runtime2.mjs";
+import { __require as requireReactJsxRuntime_production } from "./cjs/react-jsx-runtime.production.mjs";
+import { __require as requireReactJsxRuntime_development } from "./cjs/react-jsx-runtime.development.mjs";
+var hasRequiredJsxRuntime;
+function requireJsxRuntime() {
+  if (hasRequiredJsxRuntime) return jsxRuntime.exports;
+  hasRequiredJsxRuntime = 1;
+  if (process.env.NODE_ENV === "production") {
+    jsxRuntime.exports = requireReactJsxRuntime_production();
+  } else {
+    jsxRuntime.exports = requireReactJsxRuntime_development();
+  }
+  return jsxRuntime.exports;
+}
+export {
+  requireJsxRuntime as __require
+};

package/dist/styles/text.module.scss.mjs

@@ -0,0 +1,20 @@
+(function() {
+  "use strict";
+  try {
+    if (typeof document != "undefined") {
+      var elementStyle = document.createElement("style");
+      elementStyle.appendChild(document.createTextNode("._text_2fuj1_1{color:#606875;color:var(--color, #606875);font-size:normal;font-size:var(--font-size, normal)}._text_2fuj1_1::-moz-selection{color:#cccfd5;background-color:#3e434b;background-color:var(--color, #3e434b)}._text_2fuj1_1::selection{color:#cccfd5;background-color:#3e434b;background-color:var(--color, #3e434b)}[data-theme=dark] ._text_2fuj1_1{color:#b0b5be;color:var(--color, #b0b5be)}[data-theme=dark] ._text_2fuj1_1::-moz-selection{color:#3e434b;background-color:#cccfd5;background-color:var(--color, #cccfd5)}[data-theme=dark] ._text_2fuj1_1::selection{color:#3e434b;background-color:#cccfd5;background-color:var(--color, #cccfd5)}"));
+      document.head.appendChild(elementStyle);
+    }
+  } catch (e) {
+    console.error("vite-plugin-css-injected-by-js", e);
+  }
+})();
+const text = "_text_2fuj1_1";
+const textStyle = {
+  text
+};
+export {
+  textStyle as default,
+  text
+};

package/dist/vite.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>

package/package.json

@@ -0,0 +1,54 @@
+{
+  "name": "@elmethis/react",
+  "version": "0.1.0",
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "author": "Ikuma Yamashita",
+  "repository": {
+    "type": "git",
+    "url": "git@github.com:46ki75/elmethis.git"
+  },
+  "homepage": "https://46ki75.github.io/elmethis",
+  "files": [
+    "dist"
+  ],
+  "types": "./dist/index.d.ts",
+  "module": "./dist/index.mjs",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.mjs"
+    }
+  },
+  "dependencies": {
+    "clsx": "^2.1.1",
+    "polished": "^4.3.1",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.36.0",
+    "@storybook/react-vite": "^9.1.13",
+    "@types/node": "^24.6.0",
+    "@types/react": "^19.1.16",
+    "@types/react-dom": "^19.1.9",
+    "@vitejs/plugin-react": "^5.0.4",
+    "babel-plugin-react-compiler": "^19.1.0-rc.3",
+    "eslint": "^9.36.0",
+    "eslint-plugin-react-hooks": "^5.2.0",
+    "eslint-plugin-react-refresh": "^0.4.22",
+    "globals": "^16.4.0",
+    "postcss": "^8.5.6",
+    "postcss-preset-env": "^10.4.0",
+    "typescript": "~5.9.3",
+    "typescript-eslint": "^8.45.0",
+    "vite": "^7.1.7",
+    "vite-plugin-css-injected-by-js": "^3.5.2",
+    "vite-plugin-dts": "^4.5.4"
+  },
+  "scripts": {
+    "build": "tsc -b && vite build"
+  }
+}