@kitsuyui/react-binary 0.2.0 → 0.2.2

package/README.md

@@ -4,6 +4,11 @@
 
 This is a React component representing a binary value.
 
+## Design role
+
+This package provides binary/text visualization primitives.
+`Bits` is the structural primitive, and `SimpleBitString` / `DetailedBitString` are concrete visualizations built on top of it.
+
 ## Demo
 
 Storybook: https://react-playground.docs.kitsuyui.com/storybook/
@@ -28,6 +33,19 @@ yarn add @kitsuyui/react-binary
 pnpm add @kitsuyui/react-binary
 ```
 
+## Usage
+
+```tsx
+import {
+  Bits,
+  DetailedBitString,
+  SimpleBitString,
+  type BitsProps,
+  type DetailedBitStringProps,
+  type SimpleBitStringProps,
+} from '@kitsuyui/react-binary'
+```
+
 ## License
 
 MIT

package/dist/Binary.cjs

@@ -1,66 +1,2 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Binary.tsx
-var Binary_exports = {};
-__export(Binary_exports, {
-  Bits: () => Bits
-});
-module.exports = __toCommonJS(Binary_exports);
-var import_react = __toESM(require("react"), 1);
-var import_jsx_runtime = require("react/jsx-runtime");
-var Bits = (props) => {
-  const { value, bitElement } = props;
-  const bits = (value | 0).toString(2).split("");
-  const bitLength = bits.length;
-  const length = props.length ?? bitLength;
-  const overflowLength = Math.max(0, bitLength - length);
-  const zeroPaddingLength = Math.max(0, length - bitLength);
-  const representLength = Math.max(length, bitLength);
-  const elements = Array.from(Array(representLength)).map((_, index) => {
-    const stand = bits[bitLength - representLength + index] === "1";
-    const bigEndianBitOrder = index;
-    const overflow = bigEndianBitOrder < overflowLength;
-    const zeroPadding = bigEndianBitOrder < zeroPaddingLength;
-    return import_react.default.createElement(bitElement, {
-      key: index,
-      stand,
-      overflow,
-      zeroPadding,
-      littleEndianBitOrder: representLength - index - 1,
-      bigEndianBitOrder
-    });
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: elements });
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Bits
-});
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./chunk-Bmb41Sf3.cjs`);let t=require(`react`);t=e.t(t);let n=require(`react/jsx-runtime`);const r=e=>{let{value:r,bitElement:i}=e,a=(r|0).toString(2).split(``),o=a.length,s=e.length??o,c=Math.max(0,o-s),l=Math.max(0,s-o),u=Math.max(s,o);return(0,n.jsx)(n.Fragment,{children:Array.from(Array(u)).map((e,n)=>{let r=a[o-u+n]===`1`,s=n,d=s<c,f=s<l;return t.default.createElement(i,{key:n,stand:r,overflow:d,zeroPadding:f,littleEndianBitOrder:u-n-1,bigEndianBitOrder:s})})})};exports.Bits=r;
 //# sourceMappingURL=Binary.cjs.map

package/dist/Binary.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Binary.tsx"],"sourcesContent":["import React from 'react'\n\n/**\n * BitProps is a type that represents the properties of a bit.\n */\nexport type BitProps = {\n  stand: boolean\n}\n\n/**\n * EnhancedBitProps is a type that adds the following properties to BitProps.\n * - overflow: If true, this means that bit is out of range.\n * - zeroPadding: If true, this means that bit is padded with zero.\n */\nexport type EnhancedBitProps = BitProps & {\n  overflow?: boolean\n  zeroPadding?: boolean\n  littleEndianBitOrder: number\n  bigEndianBitOrder: number\n}\n\nexport type BitElement = React.FC<EnhancedBitProps>\n\n/**\n * Bit is a component that displays a bit.\n * This component supports the behavior of zero padding and overflow.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const Bits = (props: {\n  value: number\n  bitElement: BitElement\n  length?: number | undefined\n}): React.JSX.Element => {\n  const { value, bitElement } = props\n  const bits = (value | 0).toString(2).split('')\n  const bitLength = bits.length\n  const length = props.length ?? bitLength\n  const overflowLength = Math.max(0, bitLength - length)\n  const zeroPaddingLength = Math.max(0, length - bitLength)\n  const representLength = Math.max(length, bitLength)\n  const elements = Array.from(Array(representLength)).map((_, index) => {\n    const stand = bits[bitLength - representLength + index] === '1'\n    const bigEndianBitOrder = index\n    const overflow = bigEndianBitOrder < overflowLength\n    const zeroPadding = bigEndianBitOrder < zeroPaddingLength\n    return React.createElement(bitElement, {\n      key: index,\n      stand,\n      overflow,\n      zeroPadding,\n      littleEndianBitOrder: representLength - index - 1,\n      bigEndianBitOrder,\n    })\n  })\n  return <>{elements}</>\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAuDT;AA1BF,IAAM,OAAO,CAAC,UAII;AACvB,QAAM,EAAE,OAAO,WAAW,IAAI;AAC9B,QAAM,QAAQ,QAAQ,GAAG,SAAS,CAAC,EAAE,MAAM,EAAE;AAC7C,QAAM,YAAY,KAAK;AACvB,QAAM,SAAS,MAAM,UAAU;AAC/B,QAAM,iBAAiB,KAAK,IAAI,GAAG,YAAY,MAAM;AACrD,QAAM,oBAAoB,KAAK,IAAI,GAAG,SAAS,SAAS;AACxD,QAAM,kBAAkB,KAAK,IAAI,QAAQ,SAAS;AAClD,QAAM,WAAW,MAAM,KAAK,MAAM,eAAe,CAAC,EAAE,IAAI,CAAC,GAAG,UAAU;AACpE,UAAM,QAAQ,KAAK,YAAY,kBAAkB,KAAK,MAAM;AAC5D,UAAM,oBAAoB;AAC1B,UAAM,WAAW,oBAAoB;AACrC,UAAM,cAAc,oBAAoB;AACxC,WAAO,aAAAA,QAAM,cAAc,YAAY;AAAA,MACrC,KAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,sBAAsB,kBAAkB,QAAQ;AAAA,MAChD;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACD,SAAO,2EAAG,oBAAS;AACrB;","names":["React"]}
+{"version":3,"file":"Binary.cjs","names":["React"],"sources":["../src/Binary.tsx"],"sourcesContent":["import React from 'react'\n\n/**\n * BitProps is a type that represents the properties of a bit.\n */\nexport type BitProps = {\n  stand: boolean\n}\n\n/**\n * EnhancedBitProps is a type that adds the following properties to BitProps.\n * - overflow: If true, this means that bit is out of range.\n * - zeroPadding: If true, this means that bit is padded with zero.\n */\nexport type EnhancedBitProps = BitProps & {\n  overflow?: boolean\n  zeroPadding?: boolean\n  littleEndianBitOrder: number\n  bigEndianBitOrder: number\n}\n\nexport type BitElement = React.FC<EnhancedBitProps>\n\nexport type BitsProps = {\n  value: number\n  bitElement: BitElement\n  length?: number | undefined\n}\n\n/**\n * Bit is a component that displays a bit.\n * This component supports the behavior of zero padding and overflow.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const Bits = (props: BitsProps): React.JSX.Element => {\n  const { value, bitElement } = props\n  const bits = (value | 0).toString(2).split('')\n  const bitLength = bits.length\n  const length = props.length ?? bitLength\n  const overflowLength = Math.max(0, bitLength - length)\n  const zeroPaddingLength = Math.max(0, length - bitLength)\n  const representLength = Math.max(length, bitLength)\n  const elements = Array.from(Array(representLength)).map((_, index) => {\n    const stand = bits[bitLength - representLength + index] === '1'\n    const bigEndianBitOrder = index\n    const overflow = bigEndianBitOrder < overflowLength\n    const zeroPadding = bigEndianBitOrder < zeroPaddingLength\n    return React.createElement(bitElement, {\n      key: index,\n      stand,\n      overflow,\n      zeroPadding,\n      littleEndianBitOrder: representLength - index - 1,\n      bigEndianBitOrder,\n    })\n  })\n  return <>{elements}</>\n}\n"],"mappings":"8KAmCA,MAAa,EAAQ,GAAwC,CAC3D,GAAM,CAAE,QAAO,cAAe,EACxB,GAAQ,EAAQ,GAAG,SAAS,EAAE,CAAC,MAAM,GAAG,CACxC,EAAY,EAAK,OACjB,EAAS,EAAM,QAAU,EACzB,EAAiB,KAAK,IAAI,EAAG,EAAY,EAAO,CAChD,EAAoB,KAAK,IAAI,EAAG,EAAS,EAAU,CACnD,EAAkB,KAAK,IAAI,EAAQ,EAAU,CAenD,OAAO,EAAA,EAAA,KAAA,EAAA,SAAA,CAAA,SAdU,MAAM,KAAK,MAAM,EAAgB,CAAC,CAAC,KAAK,EAAG,IAAU,CACpE,IAAM,EAAQ,EAAK,EAAY,EAAkB,KAAW,IACtD,EAAoB,EACpB,EAAW,EAAoB,EAC/B,EAAc,EAAoB,EACxC,OAAOA,EAAAA,QAAM,cAAc,EAAY,CACrC,IAAK,EACL,QACA,WACA,cACA,qBAAsB,EAAkB,EAAQ,EAChD,oBACD,CAAC,EACF,CAAA,CACoB"}

package/dist/Binary.d.cts

@@ -1,10 +1,11 @@
-import React from 'react';
+import React from "react";
 
+//#region src/Binary.d.ts
 /**
  * BitProps is a type that represents the properties of a bit.
  */
 type BitProps = {
-    stand: boolean;
+  stand: boolean;
 };
 /**
  * EnhancedBitProps is a type that adds the following properties to BitProps.
@@ -12,22 +13,24 @@ type BitProps = {
  * - zeroPadding: If true, this means that bit is padded with zero.
  */
 type EnhancedBitProps = BitProps & {
-    overflow?: boolean;
-    zeroPadding?: boolean;
-    littleEndianBitOrder: number;
-    bigEndianBitOrder: number;
+  overflow?: boolean;
+  zeroPadding?: boolean;
+  littleEndianBitOrder: number;
+  bigEndianBitOrder: number;
 };
 type BitElement = React.FC<EnhancedBitProps>;
+type BitsProps = {
+  value: number;
+  bitElement: BitElement;
+  length?: number | undefined;
+};
 /**
  * Bit is a component that displays a bit.
  * This component supports the behavior of zero padding and overflow.
  * @param props
  * @returns A component that displays a bit.
  */
-declare const Bits: (props: {
-    value: number;
-    bitElement: BitElement;
-    length?: number | undefined;
-}) => React.JSX.Element;
-
-export { type BitElement, type BitProps, Bits, type EnhancedBitProps };
+declare const Bits: (props: BitsProps) => React.JSX.Element;
+//#endregion
+export { BitElement, BitProps, Bits, BitsProps, EnhancedBitProps };
+//# sourceMappingURL=Binary.d.cts.map

package/dist/Binary.d.ts

@@ -1,10 +1,11 @@
-import React from 'react';
+import React from "react";
 
+//#region src/Binary.d.ts
 /**
  * BitProps is a type that represents the properties of a bit.
  */
 type BitProps = {
-    stand: boolean;
+  stand: boolean;
 };
 /**
  * EnhancedBitProps is a type that adds the following properties to BitProps.
@@ -12,22 +13,24 @@ type BitProps = {
  * - zeroPadding: If true, this means that bit is padded with zero.
  */
 type EnhancedBitProps = BitProps & {
-    overflow?: boolean;
-    zeroPadding?: boolean;
-    littleEndianBitOrder: number;
-    bigEndianBitOrder: number;
+  overflow?: boolean;
+  zeroPadding?: boolean;
+  littleEndianBitOrder: number;
+  bigEndianBitOrder: number;
 };
 type BitElement = React.FC<EnhancedBitProps>;
+type BitsProps = {
+  value: number;
+  bitElement: BitElement;
+  length?: number | undefined;
+};
 /**
  * Bit is a component that displays a bit.
  * This component supports the behavior of zero padding and overflow.
  * @param props
  * @returns A component that displays a bit.
  */
-declare const Bits: (props: {
-    value: number;
-    bitElement: BitElement;
-    length?: number | undefined;
-}) => React.JSX.Element;
-
-export { type BitElement, type BitProps, Bits, type EnhancedBitProps };
+declare const Bits: (props: BitsProps) => React.JSX.Element;
+//#endregion
+export { BitElement, BitProps, Bits, BitsProps, EnhancedBitProps };
+//# sourceMappingURL=Binary.d.ts.map

package/dist/Binary.js

@@ -1,7 +1,2 @@
-import {
-  Bits
-} from "./chunk-76L6HIHJ.js";
-export {
-  Bits
-};
+import e from"react";import{Fragment as t,jsx as n}from"react/jsx-runtime";const r=r=>{let{value:i,bitElement:a}=r,o=(i|0).toString(2).split(``),s=o.length,c=r.length??s,l=Math.max(0,s-c),u=Math.max(0,c-s),d=Math.max(c,s);return n(t,{children:Array.from(Array(d)).map((t,n)=>{let r=o[s-d+n]===`1`,i=n,c=i<l,f=i<u;return e.createElement(a,{key:n,stand:r,overflow:c,zeroPadding:f,littleEndianBitOrder:d-n-1,bigEndianBitOrder:i})})})};export{r as Bits};
 //# sourceMappingURL=Binary.js.map

package/dist/Binary.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
+{"version":3,"file":"Binary.js","names":[],"sources":["../src/Binary.tsx"],"sourcesContent":["import React from 'react'\n\n/**\n * BitProps is a type that represents the properties of a bit.\n */\nexport type BitProps = {\n  stand: boolean\n}\n\n/**\n * EnhancedBitProps is a type that adds the following properties to BitProps.\n * - overflow: If true, this means that bit is out of range.\n * - zeroPadding: If true, this means that bit is padded with zero.\n */\nexport type EnhancedBitProps = BitProps & {\n  overflow?: boolean\n  zeroPadding?: boolean\n  littleEndianBitOrder: number\n  bigEndianBitOrder: number\n}\n\nexport type BitElement = React.FC<EnhancedBitProps>\n\nexport type BitsProps = {\n  value: number\n  bitElement: BitElement\n  length?: number | undefined\n}\n\n/**\n * Bit is a component that displays a bit.\n * This component supports the behavior of zero padding and overflow.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const Bits = (props: BitsProps): React.JSX.Element => {\n  const { value, bitElement } = props\n  const bits = (value | 0).toString(2).split('')\n  const bitLength = bits.length\n  const length = props.length ?? bitLength\n  const overflowLength = Math.max(0, bitLength - length)\n  const zeroPaddingLength = Math.max(0, length - bitLength)\n  const representLength = Math.max(length, bitLength)\n  const elements = Array.from(Array(representLength)).map((_, index) => {\n    const stand = bits[bitLength - representLength + index] === '1'\n    const bigEndianBitOrder = index\n    const overflow = bigEndianBitOrder < overflowLength\n    const zeroPadding = bigEndianBitOrder < zeroPaddingLength\n    return React.createElement(bitElement, {\n      key: index,\n      stand,\n      overflow,\n      zeroPadding,\n      littleEndianBitOrder: representLength - index - 1,\n      bigEndianBitOrder,\n    })\n  })\n  return <>{elements}</>\n}\n"],"mappings":"2EAmCA,MAAa,EAAQ,GAAwC,CAC3D,GAAM,CAAE,QAAO,cAAe,EACxB,GAAQ,EAAQ,GAAG,SAAS,EAAE,CAAC,MAAM,GAAG,CACxC,EAAY,EAAK,OACjB,EAAS,EAAM,QAAU,EACzB,EAAiB,KAAK,IAAI,EAAG,EAAY,EAAO,CAChD,EAAoB,KAAK,IAAI,EAAG,EAAS,EAAU,CACnD,EAAkB,KAAK,IAAI,EAAQ,EAAU,CAenD,OAAO,EAAA,EAAA,CAAA,SAdU,MAAM,KAAK,MAAM,EAAgB,CAAC,CAAC,KAAK,EAAG,IAAU,CACpE,IAAM,EAAQ,EAAK,EAAY,EAAkB,KAAW,IACtD,EAAoB,EACpB,EAAW,EAAoB,EAC/B,EAAc,EAAoB,EACxC,OAAO,EAAM,cAAc,EAAY,CACrC,IAAK,EACL,QACA,WACA,cACA,qBAAsB,EAAkB,EAAQ,EAChD,oBACD,CAAC,EACF,CAAA,CACoB"}

package/dist/Detailed.cjs

@@ -1,132 +1,2 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Detailed.tsx
-var Detailed_exports = {};
-__export(Detailed_exports, {
-  DetailedBit: () => DetailedBit,
-  DetailedBitString: () => DetailedBitString
-});
-module.exports = __toCommonJS(Detailed_exports);
-
-// src/Binary.tsx
-var import_react = __toESM(require("react"), 1);
-var import_jsx_runtime = require("react/jsx-runtime");
-var Bits = (props) => {
-  const { value, bitElement } = props;
-  const bits = (value | 0).toString(2).split("");
-  const bitLength = bits.length;
-  const length = props.length ?? bitLength;
-  const overflowLength = Math.max(0, bitLength - length);
-  const zeroPaddingLength = Math.max(0, length - bitLength);
-  const representLength = Math.max(length, bitLength);
-  const elements = Array.from(Array(representLength)).map((_, index) => {
-    const stand = bits[bitLength - representLength + index] === "1";
-    const bigEndianBitOrder = index;
-    const overflow = bigEndianBitOrder < overflowLength;
-    const zeroPadding = bigEndianBitOrder < zeroPaddingLength;
-    return import_react.default.createElement(bitElement, {
-      key: index,
-      stand,
-      overflow,
-      zeroPadding,
-      littleEndianBitOrder: representLength - index - 1,
-      bigEndianBitOrder
-    });
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: elements });
-};
-
-// src/Detailed.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var DetailedBit = (props) => {
-  const { stand, overflow, zeroPadding } = props;
-  const displayLittleEndianBitOrder = props.displayLittleEndianBitOrder ?? false;
-  const displayBigEndianBitOrder = props.displayBigEndianBitOrder ?? false;
-  const text = stand ? "1" : "0";
-  const border = overflow ? "1px dotted red" : zeroPadding ? "1px dotted gray" : "1px solid #cccccc";
-  const margin = "0.5px";
-  const color = stand ? "#999999" : "#cccccc";
-  const backgroundColor = stand ? "#000000" : "#ffffff";
-  const fontFamily = "monospace";
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { style: { display: "inline-block", fontFamily, margin }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-      "div",
-      {
-        style: {
-          color,
-          backgroundColor,
-          border
-        },
-        children: text
-      }
-    ),
-    displayLittleEndianBitOrder && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(IndexLabel, { index: props.littleEndianBitOrder }),
-    displayBigEndianBitOrder && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(IndexLabel, { index: props.bigEndianBitOrder })
-  ] });
-};
-var IndexLabel = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    "div",
-    {
-      style: {
-        userSelect: "none",
-        fontSize: "0.5em",
-        textAlign: "center",
-        lineHeight: "1em"
-      },
-      children: props.index
-    }
-  );
-};
-var DetailedBitString = (props) => {
-  const showLittleEndianBitOrder = props.showLittleEndianBitOrder ?? false;
-  const showBigEndianBitOrder = props.showBigEndianBitOrder ?? false;
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-    Bits,
-    {
-      value: props.value,
-      length: props.length,
-      bitElement: (props2) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
-        DetailedBit,
-        {
-          ...props2,
-          displayLittleEndianBitOrder: showLittleEndianBitOrder,
-          displayBigEndianBitOrder: showBigEndianBitOrder
-        }
-      )
-    }
-  );
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  DetailedBit,
-  DetailedBitString
-});
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-Bmb41Sf3.cjs`);const e=require(`./Binary.cjs`);let t=require(`react/jsx-runtime`);const n=e=>{let{border:n,color:a,backgroundColor:s,text:c}=r(e.stand,e.overflow,e.zeroPadding),{displayLittleEndianBitOrder:l,displayBigEndianBitOrder:u}=i(e);return(0,t.jsxs)(`div`,{style:{display:`inline-block`,fontFamily:`monospace`,margin:`0.5px`},children:[(0,t.jsx)(`div`,{style:{color:a,backgroundColor:s,border:n},children:c}),(0,t.jsx)(o,{displayLittleEndianBitOrder:l,displayBigEndianBitOrder:u,littleEndianBitOrder:e.littleEndianBitOrder,bigEndianBitOrder:e.bigEndianBitOrder})]})},r=(e,t,n)=>({text:e?`1`:`0`,border:a(t,n),color:e?`#999999`:`#cccccc`,backgroundColor:e?`#000000`:`#ffffff`}),i=e=>({displayLittleEndianBitOrder:e.showLittleEndianBitOrder??e.displayLittleEndianBitOrder??!1,displayBigEndianBitOrder:e.showBigEndianBitOrder??e.displayBigEndianBitOrder??!1}),a=(e,t)=>e?`1px dotted red`:t?`1px dotted gray`:`1px solid #cccccc`,o=e=>{let{displayLittleEndianBitOrder:n,displayBigEndianBitOrder:r,littleEndianBitOrder:i,bigEndianBitOrder:a}=e;return(0,t.jsxs)(t.Fragment,{children:[n?(0,t.jsx)(s,{index:i}):null,r?(0,t.jsx)(s,{index:a}):null]})},s=e=>(0,t.jsx)(`div`,{style:{userSelect:`none`,fontSize:`0.5em`,textAlign:`center`,lineHeight:`1em`},children:e.index}),c=r=>{let i=r.showLittleEndianBitOrder??!1,a=r.showBigEndianBitOrder??!1;return(0,t.jsx)(e.Bits,{value:r.value,length:r.length,bitElement:e=>(0,t.jsx)(n,{...e,showLittleEndianBitOrder:i,showBigEndianBitOrder:a})})};exports.DetailedBit=n,exports.DetailedBitString=c;
 //# sourceMappingURL=Detailed.cjs.map

package/dist/Detailed.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Detailed.tsx","../src/Binary.tsx"],"sourcesContent":["import type React from 'react'\nimport { Bits, type EnhancedBitProps } from './Binary'\n\nexport type DetailedBitProps = EnhancedBitProps & {\n  displayLittleEndianBitOrder?: boolean | undefined\n  displayBigEndianBitOrder?: boolean | undefined\n}\n\nexport const DetailedBit = (props: DetailedBitProps): React.JSX.Element => {\n  const { stand, overflow, zeroPadding } = props\n  const displayLittleEndianBitOrder = props.displayLittleEndianBitOrder ?? false\n  const displayBigEndianBitOrder = props.displayBigEndianBitOrder ?? false\n  const text = stand ? '1' : '0'\n  const border = overflow\n    ? '1px dotted red'\n    : zeroPadding\n      ? '1px dotted gray'\n      : '1px solid #cccccc'\n  const margin = '0.5px'\n  const color = stand ? '#999999' : '#cccccc'\n  const backgroundColor = stand ? '#000000' : '#ffffff'\n  const fontFamily = 'monospace'\n  return (\n    <div style={{ display: 'inline-block', fontFamily, margin }}>\n      <div\n        style={{\n          color,\n          backgroundColor,\n          border,\n        }}\n      >\n        {text}\n      </div>\n      {displayLittleEndianBitOrder && (\n        <IndexLabel index={props.littleEndianBitOrder} />\n      )}\n      {displayBigEndianBitOrder && (\n        <IndexLabel index={props.bigEndianBitOrder} />\n      )}\n    </div>\n  )\n}\n\nconst IndexLabel = (props: { index: number }): React.JSX.Element => {\n  return (\n    <div\n      style={{\n        userSelect: 'none',\n        fontSize: '0.5em',\n        textAlign: 'center',\n        lineHeight: '1em',\n      }}\n    >\n      {props.index}\n    </div>\n  )\n}\n\nexport const DetailedBitString = (props: {\n  value: number\n  length?: number\n  showLittleEndianBitOrder?: boolean | undefined\n  showBigEndianBitOrder?: boolean | undefined\n}): React.JSX.Element => {\n  const showLittleEndianBitOrder = props.showLittleEndianBitOrder ?? false\n  const showBigEndianBitOrder = props.showBigEndianBitOrder ?? false\n  return (\n    <Bits\n      value={props.value}\n      length={props.length}\n      bitElement={(props) => (\n        <DetailedBit\n          {...props}\n          displayLittleEndianBitOrder={showLittleEndianBitOrder}\n          displayBigEndianBitOrder={showBigEndianBitOrder}\n        />\n      )}\n    />\n  )\n}\n","import React from 'react'\n\n/**\n * BitProps is a type that represents the properties of a bit.\n */\nexport type BitProps = {\n  stand: boolean\n}\n\n/**\n * EnhancedBitProps is a type that adds the following properties to BitProps.\n * - overflow: If true, this means that bit is out of range.\n * - zeroPadding: If true, this means that bit is padded with zero.\n */\nexport type EnhancedBitProps = BitProps & {\n  overflow?: boolean\n  zeroPadding?: boolean\n  littleEndianBitOrder: number\n  bigEndianBitOrder: number\n}\n\nexport type BitElement = React.FC<EnhancedBitProps>\n\n/**\n * Bit is a component that displays a bit.\n * This component supports the behavior of zero padding and overflow.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const Bits = (props: {\n  value: number\n  bitElement: BitElement\n  length?: number | undefined\n}): React.JSX.Element => {\n  const { value, bitElement } = props\n  const bits = (value | 0).toString(2).split('')\n  const bitLength = bits.length\n  const length = props.length ?? bitLength\n  const overflowLength = Math.max(0, bitLength - length)\n  const zeroPaddingLength = Math.max(0, length - bitLength)\n  const representLength = Math.max(length, bitLength)\n  const elements = Array.from(Array(representLength)).map((_, index) => {\n    const stand = bits[bitLength - representLength + index] === '1'\n    const bigEndianBitOrder = index\n    const overflow = bigEndianBitOrder < overflowLength\n    const zeroPadding = bigEndianBitOrder < zeroPaddingLength\n    return React.createElement(bitElement, {\n      key: index,\n      stand,\n      overflow,\n      zeroPadding,\n      littleEndianBitOrder: representLength - index - 1,\n      bigEndianBitOrder,\n    })\n  })\n  return <>{elements}</>\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAkB;AAuDT;AA1BF,IAAM,OAAO,CAAC,UAII;AACvB,QAAM,EAAE,OAAO,WAAW,IAAI;AAC9B,QAAM,QAAQ,QAAQ,GAAG,SAAS,CAAC,EAAE,MAAM,EAAE;AAC7C,QAAM,YAAY,KAAK;AACvB,QAAM,SAAS,MAAM,UAAU;AAC/B,QAAM,iBAAiB,KAAK,IAAI,GAAG,YAAY,MAAM;AACrD,QAAM,oBAAoB,KAAK,IAAI,GAAG,SAAS,SAAS;AACxD,QAAM,kBAAkB,KAAK,IAAI,QAAQ,SAAS;AAClD,QAAM,WAAW,MAAM,KAAK,MAAM,eAAe,CAAC,EAAE,IAAI,CAAC,GAAG,UAAU;AACpE,UAAM,QAAQ,KAAK,YAAY,kBAAkB,KAAK,MAAM;AAC5D,UAAM,oBAAoB;AAC1B,UAAM,WAAW,oBAAoB;AACrC,UAAM,cAAc,oBAAoB;AACxC,WAAO,aAAAA,QAAM,cAAc,YAAY;AAAA,MACrC,KAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,sBAAsB,kBAAkB,QAAQ;AAAA,MAChD;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACD,SAAO,2EAAG,oBAAS;AACrB;;;ADjCI,IAAAC,sBAAA;AAfG,IAAM,cAAc,CAAC,UAA+C;AACzE,QAAM,EAAE,OAAO,UAAU,YAAY,IAAI;AACzC,QAAM,8BAA8B,MAAM,+BAA+B;AACzE,QAAM,2BAA2B,MAAM,4BAA4B;AACnE,QAAM,OAAO,QAAQ,MAAM;AAC3B,QAAM,SAAS,WACX,mBACA,cACE,oBACA;AACN,QAAM,SAAS;AACf,QAAM,QAAQ,QAAQ,YAAY;AAClC,QAAM,kBAAkB,QAAQ,YAAY;AAC5C,QAAM,aAAa;AACnB,SACE,8CAAC,SAAI,OAAO,EAAE,SAAS,gBAAgB,YAAY,OAAO,GACxD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,IACC,+BACC,6CAAC,cAAW,OAAO,MAAM,sBAAsB;AAAA,IAEhD,4BACC,6CAAC,cAAW,OAAO,MAAM,mBAAmB;AAAA,KAEhD;AAEJ;AAEA,IAAM,aAAa,CAAC,UAAgD;AAClE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,WAAW;AAAA,QACX,YAAY;AAAA,MACd;AAAA,MAEC,gBAAM;AAAA;AAAA,EACT;AAEJ;AAEO,IAAM,oBAAoB,CAAC,UAKT;AACvB,QAAM,2BAA2B,MAAM,4BAA4B;AACnE,QAAM,wBAAwB,MAAM,yBAAyB;AAC7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,MAAM;AAAA,MACb,QAAQ,MAAM;AAAA,MACd,YAAY,CAACC,WACX;AAAA,QAAC;AAAA;AAAA,UACE,GAAGA;AAAA,UACJ,6BAA6B;AAAA,UAC7B,0BAA0B;AAAA;AAAA,MAC5B;AAAA;AAAA,EAEJ;AAEJ;","names":["React","import_jsx_runtime","props"]}
+{"version":3,"file":"Detailed.cjs","names":["Bits"],"sources":["../src/Detailed.tsx"],"sourcesContent":["import type React from 'react'\nimport { Bits, type EnhancedBitProps } from './Binary'\n\nexport type DetailedBitProps = EnhancedBitProps & {\n  showLittleEndianBitOrder?: boolean | undefined\n  showBigEndianBitOrder?: boolean | undefined\n  displayLittleEndianBitOrder?: boolean | undefined\n  displayBigEndianBitOrder?: boolean | undefined\n}\n\nexport const DetailedBit = (props: DetailedBitProps): React.JSX.Element => {\n  const { border, color, backgroundColor, text } = getDetailedBitPalette(\n    props.stand,\n    props.overflow,\n    props.zeroPadding\n  )\n  const { displayLittleEndianBitOrder, displayBigEndianBitOrder } =\n    getDetailedBitDisplayOptions(props)\n  const margin = '0.5px'\n  const fontFamily = 'monospace'\n  return (\n    <div style={{ display: 'inline-block', fontFamily, margin }}>\n      <div\n        style={{\n          color,\n          backgroundColor,\n          border,\n        }}\n      >\n        {text}\n      </div>\n      <DetailedBitLabels\n        displayLittleEndianBitOrder={displayLittleEndianBitOrder}\n        displayBigEndianBitOrder={displayBigEndianBitOrder}\n        littleEndianBitOrder={props.littleEndianBitOrder}\n        bigEndianBitOrder={props.bigEndianBitOrder}\n      />\n    </div>\n  )\n}\n\nconst getDetailedBitPalette = (\n  stand: boolean,\n  overflow: boolean | undefined,\n  zeroPadding: boolean | undefined\n) => {\n  return {\n    text: stand ? '1' : '0',\n    border: getDetailedBitBorder(overflow, zeroPadding),\n    color: stand ? '#999999' : '#cccccc',\n    backgroundColor: stand ? '#000000' : '#ffffff',\n  }\n}\n\nconst getDetailedBitDisplayOptions = (props: DetailedBitProps) => {\n  return {\n    displayLittleEndianBitOrder:\n      props.showLittleEndianBitOrder ?? props.displayLittleEndianBitOrder ?? false,\n    displayBigEndianBitOrder:\n      props.showBigEndianBitOrder ?? props.displayBigEndianBitOrder ?? false,\n  }\n}\n\nconst getDetailedBitBorder = (\n  overflow: boolean | undefined,\n  zeroPadding: boolean | undefined\n) => {\n  if (overflow) return '1px dotted red'\n  if (zeroPadding) return '1px dotted gray'\n  return '1px solid #cccccc'\n}\n\nconst DetailedBitLabels = (props: {\n  displayLittleEndianBitOrder: boolean\n  displayBigEndianBitOrder: boolean\n  littleEndianBitOrder: number\n  bigEndianBitOrder: number\n}) => {\n  const {\n    displayLittleEndianBitOrder,\n    displayBigEndianBitOrder,\n    littleEndianBitOrder,\n    bigEndianBitOrder,\n  } = props\n\n  return (\n    <>\n      {displayLittleEndianBitOrder ? (\n        <IndexLabel index={littleEndianBitOrder} />\n      ) : null}\n      {displayBigEndianBitOrder ? (\n        <IndexLabel index={bigEndianBitOrder} />\n      ) : null}\n    </>\n  )\n}\n\nconst IndexLabel = (props: { index: number }): React.JSX.Element => {\n  return (\n    <div\n      style={{\n        userSelect: 'none',\n        fontSize: '0.5em',\n        textAlign: 'center',\n        lineHeight: '1em',\n      }}\n    >\n      {props.index}\n    </div>\n  )\n}\n\nexport type DetailedBitStringProps = {\n  value: number\n  length?: number\n  showLittleEndianBitOrder?: boolean | undefined\n  showBigEndianBitOrder?: boolean | undefined\n}\n\nexport const DetailedBitString = (props: DetailedBitStringProps): React.JSX.Element => {\n  const showLittleEndianBitOrder = props.showLittleEndianBitOrder ?? false\n  const showBigEndianBitOrder = props.showBigEndianBitOrder ?? false\n  return (\n    <Bits\n      value={props.value}\n      length={props.length}\n      bitElement={(props) => (\n        <DetailedBit\n          {...props}\n          showLittleEndianBitOrder={showLittleEndianBitOrder}\n          showBigEndianBitOrder={showBigEndianBitOrder}\n        />\n      )}\n    />\n  )\n}\n"],"mappings":"sKAUA,MAAa,EAAe,GAA+C,CACzE,GAAM,CAAE,SAAQ,QAAO,kBAAiB,QAAS,EAC/C,EAAM,MACN,EAAM,SACN,EAAM,YACP,CACK,CAAE,8BAA6B,4BACnC,EAA6B,EAAM,CAGrC,OACE,EAAA,EAAA,MAAC,MAAA,CAAI,MAAO,CAAE,QAAS,eAAgB,WAFtB,YAEkC,OAHtC,QAG8C,YACzD,EAAA,EAAA,KAAC,MAAA,CACC,MAAO,CACL,QACA,kBACA,SACD,UAEA,GACG,EACN,EAAA,EAAA,KAAC,EAAA,CAC8B,8BACH,2BAC1B,qBAAsB,EAAM,qBAC5B,kBAAmB,EAAM,mBACzB,CAAA,EACE,EAIJ,GACJ,EACA,EACA,KAEO,CACL,KAAM,EAAQ,IAAM,IACpB,OAAQ,EAAqB,EAAU,EAAY,CACnD,MAAO,EAAQ,UAAY,UAC3B,gBAAiB,EAAQ,UAAY,UACtC,EAGG,EAAgC,IAC7B,CACL,4BACE,EAAM,0BAA4B,EAAM,6BAA+B,GACzE,yBACE,EAAM,uBAAyB,EAAM,0BAA4B,GACpE,EAGG,GACJ,EACA,IAEI,EAAiB,iBACjB,EAAoB,kBACjB,oBAGH,EAAqB,GAKrB,CACJ,GAAM,CACJ,8BACA,2BACA,uBACA,qBACE,EAEJ,OACE,EAAA,EAAA,MAAA,EAAA,SAAA,CAAA,SAAA,CACG,GACC,EAAA,EAAA,KAAC,EAAA,CAAW,MAAO,EAAA,CAAwB,CACzC,KACH,GACC,EAAA,EAAA,KAAC,EAAA,CAAW,MAAO,EAAA,CAAqB,CACtC,KAAA,CAAA,CACH,EAID,EAAc,IAEhB,EAAA,EAAA,KAAC,MAAA,CACC,MAAO,CACL,WAAY,OACZ,SAAU,QACV,UAAW,SACX,WAAY,MACb,UAEA,EAAM,OACH,CAWG,EAAqB,GAAqD,CACrF,IAAM,EAA2B,EAAM,0BAA4B,GAC7D,EAAwB,EAAM,uBAAyB,GAC7D,OACE,EAAA,EAAA,KAACA,EAAAA,KAAAA,CACC,MAAO,EAAM,MACb,OAAQ,EAAM,OACd,WAAa,IACX,EAAA,EAAA,KAAC,EAAA,CACC,GAAI,EACsB,2BACH,yBACvB,EAEJ"}

package/dist/Detailed.d.cts

@@ -1,16 +1,21 @@
-import React from 'react';
-import { EnhancedBitProps } from './Binary.cjs';
+import { EnhancedBitProps } from "./Binary.cjs";
+import React from "react";
 
+//#region src/Detailed.d.ts
 type DetailedBitProps = EnhancedBitProps & {
-    displayLittleEndianBitOrder?: boolean | undefined;
-    displayBigEndianBitOrder?: boolean | undefined;
+  showLittleEndianBitOrder?: boolean | undefined;
+  showBigEndianBitOrder?: boolean | undefined;
+  displayLittleEndianBitOrder?: boolean | undefined;
+  displayBigEndianBitOrder?: boolean | undefined;
 };
 declare const DetailedBit: (props: DetailedBitProps) => React.JSX.Element;
-declare const DetailedBitString: (props: {
-    value: number;
-    length?: number;
-    showLittleEndianBitOrder?: boolean | undefined;
-    showBigEndianBitOrder?: boolean | undefined;
-}) => React.JSX.Element;
-
-export { DetailedBit, type DetailedBitProps, DetailedBitString };
+type DetailedBitStringProps = {
+  value: number;
+  length?: number;
+  showLittleEndianBitOrder?: boolean | undefined;
+  showBigEndianBitOrder?: boolean | undefined;
+};
+declare const DetailedBitString: (props: DetailedBitStringProps) => React.JSX.Element;
+//#endregion
+export { DetailedBit, DetailedBitProps, DetailedBitString, DetailedBitStringProps };
+//# sourceMappingURL=Detailed.d.cts.map

package/dist/Detailed.d.ts

@@ -1,16 +1,21 @@
-import React from 'react';
-import { EnhancedBitProps } from './Binary.js';
+import { EnhancedBitProps } from "./Binary.js";
+import React from "react";
 
+//#region src/Detailed.d.ts
 type DetailedBitProps = EnhancedBitProps & {
-    displayLittleEndianBitOrder?: boolean | undefined;
-    displayBigEndianBitOrder?: boolean | undefined;
+  showLittleEndianBitOrder?: boolean | undefined;
+  showBigEndianBitOrder?: boolean | undefined;
+  displayLittleEndianBitOrder?: boolean | undefined;
+  displayBigEndianBitOrder?: boolean | undefined;
 };
 declare const DetailedBit: (props: DetailedBitProps) => React.JSX.Element;
-declare const DetailedBitString: (props: {
-    value: number;
-    length?: number;
-    showLittleEndianBitOrder?: boolean | undefined;
-    showBigEndianBitOrder?: boolean | undefined;
-}) => React.JSX.Element;
-
-export { DetailedBit, type DetailedBitProps, DetailedBitString };
+type DetailedBitStringProps = {
+  value: number;
+  length?: number;
+  showLittleEndianBitOrder?: boolean | undefined;
+  showBigEndianBitOrder?: boolean | undefined;
+};
+declare const DetailedBitString: (props: DetailedBitStringProps) => React.JSX.Element;
+//#endregion
+export { DetailedBit, DetailedBitProps, DetailedBitString, DetailedBitStringProps };
+//# sourceMappingURL=Detailed.d.ts.map

package/dist/Detailed.js

@@ -1,10 +1,2 @@
-import {
-  DetailedBit,
-  DetailedBitString
-} from "./chunk-KC5B3ZDB.js";
-import "./chunk-76L6HIHJ.js";
-export {
-  DetailedBit,
-  DetailedBitString
-};
+import{Bits as e}from"./Binary.js";import{Fragment as t,jsx as n,jsxs as r}from"react/jsx-runtime";const i=e=>{let{border:t,color:i,backgroundColor:s,text:l}=a(e.stand,e.overflow,e.zeroPadding),{displayLittleEndianBitOrder:u,displayBigEndianBitOrder:d}=o(e);return r(`div`,{style:{display:`inline-block`,fontFamily:`monospace`,margin:`0.5px`},children:[n(`div`,{style:{color:i,backgroundColor:s,border:t},children:l}),n(c,{displayLittleEndianBitOrder:u,displayBigEndianBitOrder:d,littleEndianBitOrder:e.littleEndianBitOrder,bigEndianBitOrder:e.bigEndianBitOrder})]})},a=(e,t,n)=>({text:e?`1`:`0`,border:s(t,n),color:e?`#999999`:`#cccccc`,backgroundColor:e?`#000000`:`#ffffff`}),o=e=>({displayLittleEndianBitOrder:e.showLittleEndianBitOrder??e.displayLittleEndianBitOrder??!1,displayBigEndianBitOrder:e.showBigEndianBitOrder??e.displayBigEndianBitOrder??!1}),s=(e,t)=>e?`1px dotted red`:t?`1px dotted gray`:`1px solid #cccccc`,c=e=>{let{displayLittleEndianBitOrder:i,displayBigEndianBitOrder:a,littleEndianBitOrder:o,bigEndianBitOrder:s}=e;return r(t,{children:[i?n(l,{index:o}):null,a?n(l,{index:s}):null]})},l=e=>n(`div`,{style:{userSelect:`none`,fontSize:`0.5em`,textAlign:`center`,lineHeight:`1em`},children:e.index}),u=t=>{let r=t.showLittleEndianBitOrder??!1,a=t.showBigEndianBitOrder??!1;return n(e,{value:t.value,length:t.length,bitElement:e=>n(i,{...e,showLittleEndianBitOrder:r,showBigEndianBitOrder:a})})};export{i as DetailedBit,u as DetailedBitString};
 //# sourceMappingURL=Detailed.js.map

package/dist/Detailed.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
+{"version":3,"file":"Detailed.js","names":[],"sources":["../src/Detailed.tsx"],"sourcesContent":["import type React from 'react'\nimport { Bits, type EnhancedBitProps } from './Binary'\n\nexport type DetailedBitProps = EnhancedBitProps & {\n  showLittleEndianBitOrder?: boolean | undefined\n  showBigEndianBitOrder?: boolean | undefined\n  displayLittleEndianBitOrder?: boolean | undefined\n  displayBigEndianBitOrder?: boolean | undefined\n}\n\nexport const DetailedBit = (props: DetailedBitProps): React.JSX.Element => {\n  const { border, color, backgroundColor, text } = getDetailedBitPalette(\n    props.stand,\n    props.overflow,\n    props.zeroPadding\n  )\n  const { displayLittleEndianBitOrder, displayBigEndianBitOrder } =\n    getDetailedBitDisplayOptions(props)\n  const margin = '0.5px'\n  const fontFamily = 'monospace'\n  return (\n    <div style={{ display: 'inline-block', fontFamily, margin }}>\n      <div\n        style={{\n          color,\n          backgroundColor,\n          border,\n        }}\n      >\n        {text}\n      </div>\n      <DetailedBitLabels\n        displayLittleEndianBitOrder={displayLittleEndianBitOrder}\n        displayBigEndianBitOrder={displayBigEndianBitOrder}\n        littleEndianBitOrder={props.littleEndianBitOrder}\n        bigEndianBitOrder={props.bigEndianBitOrder}\n      />\n    </div>\n  )\n}\n\nconst getDetailedBitPalette = (\n  stand: boolean,\n  overflow: boolean | undefined,\n  zeroPadding: boolean | undefined\n) => {\n  return {\n    text: stand ? '1' : '0',\n    border: getDetailedBitBorder(overflow, zeroPadding),\n    color: stand ? '#999999' : '#cccccc',\n    backgroundColor: stand ? '#000000' : '#ffffff',\n  }\n}\n\nconst getDetailedBitDisplayOptions = (props: DetailedBitProps) => {\n  return {\n    displayLittleEndianBitOrder:\n      props.showLittleEndianBitOrder ?? props.displayLittleEndianBitOrder ?? false,\n    displayBigEndianBitOrder:\n      props.showBigEndianBitOrder ?? props.displayBigEndianBitOrder ?? false,\n  }\n}\n\nconst getDetailedBitBorder = (\n  overflow: boolean | undefined,\n  zeroPadding: boolean | undefined\n) => {\n  if (overflow) return '1px dotted red'\n  if (zeroPadding) return '1px dotted gray'\n  return '1px solid #cccccc'\n}\n\nconst DetailedBitLabels = (props: {\n  displayLittleEndianBitOrder: boolean\n  displayBigEndianBitOrder: boolean\n  littleEndianBitOrder: number\n  bigEndianBitOrder: number\n}) => {\n  const {\n    displayLittleEndianBitOrder,\n    displayBigEndianBitOrder,\n    littleEndianBitOrder,\n    bigEndianBitOrder,\n  } = props\n\n  return (\n    <>\n      {displayLittleEndianBitOrder ? (\n        <IndexLabel index={littleEndianBitOrder} />\n      ) : null}\n      {displayBigEndianBitOrder ? (\n        <IndexLabel index={bigEndianBitOrder} />\n      ) : null}\n    </>\n  )\n}\n\nconst IndexLabel = (props: { index: number }): React.JSX.Element => {\n  return (\n    <div\n      style={{\n        userSelect: 'none',\n        fontSize: '0.5em',\n        textAlign: 'center',\n        lineHeight: '1em',\n      }}\n    >\n      {props.index}\n    </div>\n  )\n}\n\nexport type DetailedBitStringProps = {\n  value: number\n  length?: number\n  showLittleEndianBitOrder?: boolean | undefined\n  showBigEndianBitOrder?: boolean | undefined\n}\n\nexport const DetailedBitString = (props: DetailedBitStringProps): React.JSX.Element => {\n  const showLittleEndianBitOrder = props.showLittleEndianBitOrder ?? false\n  const showBigEndianBitOrder = props.showBigEndianBitOrder ?? false\n  return (\n    <Bits\n      value={props.value}\n      length={props.length}\n      bitElement={(props) => (\n        <DetailedBit\n          {...props}\n          showLittleEndianBitOrder={showLittleEndianBitOrder}\n          showBigEndianBitOrder={showBigEndianBitOrder}\n        />\n      )}\n    />\n  )\n}\n"],"mappings":"mGAUA,MAAa,EAAe,GAA+C,CACzE,GAAM,CAAE,SAAQ,QAAO,kBAAiB,QAAS,EAC/C,EAAM,MACN,EAAM,SACN,EAAM,YACP,CACK,CAAE,8BAA6B,4BACnC,EAA6B,EAAM,CAGrC,OACE,EAAC,MAAA,CAAI,MAAO,CAAE,QAAS,eAAgB,WAFtB,YAEkC,OAHtC,QAG8C,WACzD,EAAC,MAAA,CACC,MAAO,CACL,QACA,kBACA,SACD,UAEA,GACG,CACN,EAAC,EAAA,CAC8B,8BACH,2BAC1B,qBAAsB,EAAM,qBAC5B,kBAAmB,EAAM,mBACzB,CAAA,EACE,EAIJ,GACJ,EACA,EACA,KAEO,CACL,KAAM,EAAQ,IAAM,IACpB,OAAQ,EAAqB,EAAU,EAAY,CACnD,MAAO,EAAQ,UAAY,UAC3B,gBAAiB,EAAQ,UAAY,UACtC,EAGG,EAAgC,IAC7B,CACL,4BACE,EAAM,0BAA4B,EAAM,6BAA+B,GACzE,yBACE,EAAM,uBAAyB,EAAM,0BAA4B,GACpE,EAGG,GACJ,EACA,IAEI,EAAiB,iBACjB,EAAoB,kBACjB,oBAGH,EAAqB,GAKrB,CACJ,GAAM,CACJ,8BACA,2BACA,uBACA,qBACE,EAEJ,OACE,EAAA,EAAA,CAAA,SAAA,CACG,EACC,EAAC,EAAA,CAAW,MAAO,EAAA,CAAwB,CACzC,KACH,EACC,EAAC,EAAA,CAAW,MAAO,EAAA,CAAqB,CACtC,KAAA,CAAA,CACH,EAID,EAAc,GAEhB,EAAC,MAAA,CACC,MAAO,CACL,WAAY,OACZ,SAAU,QACV,UAAW,SACX,WAAY,MACb,UAEA,EAAM,OACH,CAWG,EAAqB,GAAqD,CACrF,IAAM,EAA2B,EAAM,0BAA4B,GAC7D,EAAwB,EAAM,uBAAyB,GAC7D,OACE,EAAC,EAAA,CACC,MAAO,EAAM,MACb,OAAQ,EAAM,OACd,WAAa,GACX,EAAC,EAAA,CACC,GAAI,EACsB,2BACH,yBACvB,EAEJ"}

package/dist/Simple.cjs

@@ -1,83 +1,2 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/Simple.tsx
-var Simple_exports = {};
-__export(Simple_exports, {
-  Simple8BitString: () => Simple8BitString,
-  SimpleBit: () => SimpleBit
-});
-module.exports = __toCommonJS(Simple_exports);
-
-// src/Binary.tsx
-var import_react = __toESM(require("react"), 1);
-var import_jsx_runtime = require("react/jsx-runtime");
-var Bits = (props) => {
-  const { value, bitElement } = props;
-  const bits = (value | 0).toString(2).split("");
-  const bitLength = bits.length;
-  const length = props.length ?? bitLength;
-  const overflowLength = Math.max(0, bitLength - length);
-  const zeroPaddingLength = Math.max(0, length - bitLength);
-  const representLength = Math.max(length, bitLength);
-  const elements = Array.from(Array(representLength)).map((_, index) => {
-    const stand = bits[bitLength - representLength + index] === "1";
-    const bigEndianBitOrder = index;
-    const overflow = bigEndianBitOrder < overflowLength;
-    const zeroPadding = bigEndianBitOrder < zeroPaddingLength;
-    return import_react.default.createElement(bitElement, {
-      key: index,
-      stand,
-      overflow,
-      zeroPadding,
-      littleEndianBitOrder: representLength - index - 1,
-      bigEndianBitOrder
-    });
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: elements });
-};
-
-// src/Simple.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var SimpleBit = (props) => {
-  const { stand, overflow } = props;
-  const baseText = stand ? "1" : "0";
-  const isOverflowVisible = overflow ?? false;
-  const text = isOverflowVisible ? "" : baseText;
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: text });
-};
-var Simple8BitString = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Bits, { value: props.value, length: 8, bitElement: SimpleBit });
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Simple8BitString,
-  SimpleBit
-});
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`./chunk-Bmb41Sf3.cjs`);const e=require(`./Binary.cjs`);let t=require(`react/jsx-runtime`);const n=e=>{let{stand:n,overflow:r}=e;return(0,t.jsx)(t.Fragment,{children:r??!1?``:n?`1`:`0`})},r=r=>(0,t.jsx)(e.Bits,{value:r.value,length:r.length??8,bitElement:n});exports.SimpleBit=n,exports.SimpleBitString=r;
 //# sourceMappingURL=Simple.cjs.map

package/dist/Simple.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Simple.tsx","../src/Binary.tsx"],"sourcesContent":["import type React from 'react'\nimport { Bits, type EnhancedBitProps } from './Binary'\n\n/**\n * SimpleBit is a simple component that displays a bit.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const SimpleBit = (props: EnhancedBitProps): React.JSX.Element => {\n  const { stand, overflow } = props\n  const baseText = stand ? '1' : '0'\n  const isOverflowVisible = overflow ?? false\n  const text = isOverflowVisible ? '' : baseText\n  return <>{text}</>\n}\n\nexport const Simple8BitString = (props: { value: number }): React.JSX.Element => {\n  return <Bits value={props.value} length={8} bitElement={SimpleBit} />\n}\n","import React from 'react'\n\n/**\n * BitProps is a type that represents the properties of a bit.\n */\nexport type BitProps = {\n  stand: boolean\n}\n\n/**\n * EnhancedBitProps is a type that adds the following properties to BitProps.\n * - overflow: If true, this means that bit is out of range.\n * - zeroPadding: If true, this means that bit is padded with zero.\n */\nexport type EnhancedBitProps = BitProps & {\n  overflow?: boolean\n  zeroPadding?: boolean\n  littleEndianBitOrder: number\n  bigEndianBitOrder: number\n}\n\nexport type BitElement = React.FC<EnhancedBitProps>\n\n/**\n * Bit is a component that displays a bit.\n * This component supports the behavior of zero padding and overflow.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const Bits = (props: {\n  value: number\n  bitElement: BitElement\n  length?: number | undefined\n}): React.JSX.Element => {\n  const { value, bitElement } = props\n  const bits = (value | 0).toString(2).split('')\n  const bitLength = bits.length\n  const length = props.length ?? bitLength\n  const overflowLength = Math.max(0, bitLength - length)\n  const zeroPaddingLength = Math.max(0, length - bitLength)\n  const representLength = Math.max(length, bitLength)\n  const elements = Array.from(Array(representLength)).map((_, index) => {\n    const stand = bits[bitLength - representLength + index] === '1'\n    const bigEndianBitOrder = index\n    const overflow = bigEndianBitOrder < overflowLength\n    const zeroPadding = bigEndianBitOrder < zeroPaddingLength\n    return React.createElement(bitElement, {\n      key: index,\n      stand,\n      overflow,\n      zeroPadding,\n      littleEndianBitOrder: representLength - index - 1,\n      bigEndianBitOrder,\n    })\n  })\n  return <>{elements}</>\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAkB;AAuDT;AA1BF,IAAM,OAAO,CAAC,UAII;AACvB,QAAM,EAAE,OAAO,WAAW,IAAI;AAC9B,QAAM,QAAQ,QAAQ,GAAG,SAAS,CAAC,EAAE,MAAM,EAAE;AAC7C,QAAM,YAAY,KAAK;AACvB,QAAM,SAAS,MAAM,UAAU;AAC/B,QAAM,iBAAiB,KAAK,IAAI,GAAG,YAAY,MAAM;AACrD,QAAM,oBAAoB,KAAK,IAAI,GAAG,SAAS,SAAS;AACxD,QAAM,kBAAkB,KAAK,IAAI,QAAQ,SAAS;AAClD,QAAM,WAAW,MAAM,KAAK,MAAM,eAAe,CAAC,EAAE,IAAI,CAAC,GAAG,UAAU;AACpE,UAAM,QAAQ,KAAK,YAAY,kBAAkB,KAAK,MAAM;AAC5D,UAAM,oBAAoB;AAC1B,UAAM,WAAW,oBAAoB;AACrC,UAAM,cAAc,oBAAoB;AACxC,WAAO,aAAAA,QAAM,cAAc,YAAY;AAAA,MACrC,KAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,sBAAsB,kBAAkB,QAAQ;AAAA,MAChD;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACD,SAAO,2EAAG,oBAAS;AACrB;;;AD3CS,IAAAC,sBAAA;AALF,IAAM,YAAY,CAAC,UAA+C;AACvE,QAAM,EAAE,OAAO,SAAS,IAAI;AAC5B,QAAM,WAAW,QAAQ,MAAM;AAC/B,QAAM,oBAAoB,YAAY;AACtC,QAAM,OAAO,oBAAoB,KAAK;AACtC,SAAO,6EAAG,gBAAK;AACjB;AAEO,IAAM,mBAAmB,CAAC,UAAgD;AAC/E,SAAO,6CAAC,QAAK,OAAO,MAAM,OAAO,QAAQ,GAAG,YAAY,WAAW;AACrE;","names":["React","import_jsx_runtime"]}
+{"version":3,"file":"Simple.cjs","names":["Bits"],"sources":["../src/Simple.tsx"],"sourcesContent":["import type React from 'react'\nimport { Bits, type EnhancedBitProps } from './Binary'\n\nexport type SimpleBitProps = EnhancedBitProps\n\n/**\n * SimpleBit is a simple component that displays a bit.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const SimpleBit = (props: SimpleBitProps): React.JSX.Element => {\n  const { stand, overflow } = props\n  const baseText = stand ? '1' : '0'\n  const isOverflowVisible = overflow ?? false\n  const text = isOverflowVisible ? '' : baseText\n  return <>{text}</>\n}\n\nexport type SimpleBitStringProps = {\n  value: number\n  length?: number\n}\n\nexport const SimpleBitString = (props: SimpleBitStringProps): React.JSX.Element => {\n  return <Bits value={props.value} length={props.length ?? 8} bitElement={SimpleBit} />\n}\n"],"mappings":"sKAUA,MAAa,EAAa,GAA6C,CACrE,GAAM,CAAE,QAAO,YAAa,EAI5B,OAAO,EAAA,EAAA,KAAA,EAAA,SAAA,CAAA,SAFmB,GAAY,GACL,GAFhB,EAAQ,IAAM,IAAA,CAGb,EAQP,EAAmB,IACvB,EAAA,EAAA,KAACA,EAAAA,KAAAA,CAAK,MAAO,EAAM,MAAO,OAAQ,EAAM,QAAU,EAAG,WAAY,GAAa"}

package/dist/Simple.d.cts

@@ -1,14 +1,19 @@
-import React from 'react';
-import { EnhancedBitProps } from './Binary.cjs';
+import { EnhancedBitProps } from "./Binary.cjs";
+import React from "react";
 
+//#region src/Simple.d.ts
+type SimpleBitProps = EnhancedBitProps;
 /**
  * SimpleBit is a simple component that displays a bit.
  * @param props
  * @returns A component that displays a bit.
  */
-declare const SimpleBit: (props: EnhancedBitProps) => React.JSX.Element;
-declare const Simple8BitString: (props: {
-    value: number;
-}) => React.JSX.Element;
-
-export { Simple8BitString, SimpleBit };
+declare const SimpleBit: (props: SimpleBitProps) => React.JSX.Element;
+type SimpleBitStringProps = {
+  value: number;
+  length?: number;
+};
+declare const SimpleBitString: (props: SimpleBitStringProps) => React.JSX.Element;
+//#endregion
+export { SimpleBit, SimpleBitProps, SimpleBitString, SimpleBitStringProps };
+//# sourceMappingURL=Simple.d.cts.map

package/dist/Simple.d.ts

@@ -1,14 +1,19 @@
-import React from 'react';
-import { EnhancedBitProps } from './Binary.js';
+import { EnhancedBitProps } from "./Binary.js";
+import React from "react";
 
+//#region src/Simple.d.ts
+type SimpleBitProps = EnhancedBitProps;
 /**
  * SimpleBit is a simple component that displays a bit.
  * @param props
  * @returns A component that displays a bit.
  */
-declare const SimpleBit: (props: EnhancedBitProps) => React.JSX.Element;
-declare const Simple8BitString: (props: {
-    value: number;
-}) => React.JSX.Element;
-
-export { Simple8BitString, SimpleBit };
+declare const SimpleBit: (props: SimpleBitProps) => React.JSX.Element;
+type SimpleBitStringProps = {
+  value: number;
+  length?: number;
+};
+declare const SimpleBitString: (props: SimpleBitStringProps) => React.JSX.Element;
+//#endregion
+export { SimpleBit, SimpleBitProps, SimpleBitString, SimpleBitStringProps };
+//# sourceMappingURL=Simple.d.ts.map

package/dist/Simple.js

@@ -1,10 +1,2 @@
-import {
-  Simple8BitString,
-  SimpleBit
-} from "./chunk-EIJS7GKA.js";
-import "./chunk-76L6HIHJ.js";
-export {
-  Simple8BitString,
-  SimpleBit
-};
+import{Bits as e}from"./Binary.js";import{Fragment as t,jsx as n}from"react/jsx-runtime";const r=e=>{let{stand:r,overflow:i}=e;return n(t,{children:i??!1?``:r?`1`:`0`})},i=t=>n(e,{value:t.value,length:t.length??8,bitElement:r});export{r as SimpleBit,i as SimpleBitString};
 //# sourceMappingURL=Simple.js.map

package/dist/Simple.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
+{"version":3,"file":"Simple.js","names":[],"sources":["../src/Simple.tsx"],"sourcesContent":["import type React from 'react'\nimport { Bits, type EnhancedBitProps } from './Binary'\n\nexport type SimpleBitProps = EnhancedBitProps\n\n/**\n * SimpleBit is a simple component that displays a bit.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const SimpleBit = (props: SimpleBitProps): React.JSX.Element => {\n  const { stand, overflow } = props\n  const baseText = stand ? '1' : '0'\n  const isOverflowVisible = overflow ?? false\n  const text = isOverflowVisible ? '' : baseText\n  return <>{text}</>\n}\n\nexport type SimpleBitStringProps = {\n  value: number\n  length?: number\n}\n\nexport const SimpleBitString = (props: SimpleBitStringProps): React.JSX.Element => {\n  return <Bits value={props.value} length={props.length ?? 8} bitElement={SimpleBit} />\n}\n"],"mappings":"yFAUA,MAAa,EAAa,GAA6C,CACrE,GAAM,CAAE,QAAO,YAAa,EAI5B,OAAO,EAAA,EAAA,CAAA,SAFmB,GAAY,GACL,GAFhB,EAAQ,IAAM,IAAA,CAGb,EAQP,EAAmB,GACvB,EAAC,EAAA,CAAK,MAAO,EAAM,MAAO,OAAQ,EAAM,QAAU,EAAG,WAAY,GAAa"}

package/dist/chunk-Bmb41Sf3.cjs

@@ -0,0 +1 @@
+var e=Object.create,t=Object.defineProperty,n=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,i=Object.getPrototypeOf,a=Object.prototype.hasOwnProperty,o=(e,i,o,s)=>{if(i&&typeof i==`object`||typeof i==`function`)for(var c=r(i),l=0,u=c.length,d;l<u;l++)d=c[l],!a.call(e,d)&&d!==o&&t(e,d,{get:(e=>i[e]).bind(null,d),enumerable:!(s=n(i,d))||s.enumerable});return e},s=(n,r,a)=>(a=n==null?{}:e(i(n)),o(r||!n||!n.__esModule?t(a,`default`,{value:n,enumerable:!0}):a,n));Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return s}});

package/dist/index.cjs

@@ -1,151 +1 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/index.ts
-var index_exports = {};
-__export(index_exports, {
-  Bits: () => Bits,
-  DetailedBit: () => DetailedBit,
-  DetailedBitString: () => DetailedBitString,
-  Simple8BitString: () => Simple8BitString,
-  SimpleBit: () => SimpleBit
-});
-module.exports = __toCommonJS(index_exports);
-
-// src/Binary.tsx
-var import_react = __toESM(require("react"), 1);
-var import_jsx_runtime = require("react/jsx-runtime");
-var Bits = (props) => {
-  const { value, bitElement } = props;
-  const bits = (value | 0).toString(2).split("");
-  const bitLength = bits.length;
-  const length = props.length ?? bitLength;
-  const overflowLength = Math.max(0, bitLength - length);
-  const zeroPaddingLength = Math.max(0, length - bitLength);
-  const representLength = Math.max(length, bitLength);
-  const elements = Array.from(Array(representLength)).map((_, index) => {
-    const stand = bits[bitLength - representLength + index] === "1";
-    const bigEndianBitOrder = index;
-    const overflow = bigEndianBitOrder < overflowLength;
-    const zeroPadding = bigEndianBitOrder < zeroPaddingLength;
-    return import_react.default.createElement(bitElement, {
-      key: index,
-      stand,
-      overflow,
-      zeroPadding,
-      littleEndianBitOrder: representLength - index - 1,
-      bigEndianBitOrder
-    });
-  });
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: elements });
-};
-
-// src/Simple.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var SimpleBit = (props) => {
-  const { stand, overflow } = props;
-  const baseText = stand ? "1" : "0";
-  const isOverflowVisible = overflow ?? false;
-  const text = isOverflowVisible ? "" : baseText;
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: text });
-};
-var Simple8BitString = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Bits, { value: props.value, length: 8, bitElement: SimpleBit });
-};
-
-// src/Detailed.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
-var DetailedBit = (props) => {
-  const { stand, overflow, zeroPadding } = props;
-  const displayLittleEndianBitOrder = props.displayLittleEndianBitOrder ?? false;
-  const displayBigEndianBitOrder = props.displayBigEndianBitOrder ?? false;
-  const text = stand ? "1" : "0";
-  const border = overflow ? "1px dotted red" : zeroPadding ? "1px dotted gray" : "1px solid #cccccc";
-  const margin = "0.5px";
-  const color = stand ? "#999999" : "#cccccc";
-  const backgroundColor = stand ? "#000000" : "#ffffff";
-  const fontFamily = "monospace";
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { style: { display: "inline-block", fontFamily, margin }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-      "div",
-      {
-        style: {
-          color,
-          backgroundColor,
-          border
-        },
-        children: text
-      }
-    ),
-    displayLittleEndianBitOrder && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(IndexLabel, { index: props.littleEndianBitOrder }),
-    displayBigEndianBitOrder && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(IndexLabel, { index: props.bigEndianBitOrder })
-  ] });
-};
-var IndexLabel = (props) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    "div",
-    {
-      style: {
-        userSelect: "none",
-        fontSize: "0.5em",
-        textAlign: "center",
-        lineHeight: "1em"
-      },
-      children: props.index
-    }
-  );
-};
-var DetailedBitString = (props) => {
-  const showLittleEndianBitOrder = props.showLittleEndianBitOrder ?? false;
-  const showBigEndianBitOrder = props.showBigEndianBitOrder ?? false;
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-    Bits,
-    {
-      value: props.value,
-      length: props.length,
-      bitElement: (props2) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-        DetailedBit,
-        {
-          ...props2,
-          displayLittleEndianBitOrder: showLittleEndianBitOrder,
-          displayBigEndianBitOrder: showBigEndianBitOrder
-        }
-      )
-    }
-  );
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  Bits,
-  DetailedBit,
-  DetailedBitString,
-  Simple8BitString,
-  SimpleBit
-});
-//# sourceMappingURL=index.cjs.map
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./Binary.cjs`),t=require(`./Detailed.cjs`),n=require(`./Simple.cjs`);exports.Bits=e.Bits,exports.DetailedBit=t.DetailedBit,exports.DetailedBitString=t.DetailedBitString,exports.SimpleBit=n.SimpleBit,exports.SimpleBitString=n.SimpleBitString;

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-export { BitElement, BitProps, Bits, EnhancedBitProps } from './Binary.cjs';
-export { Simple8BitString, SimpleBit } from './Simple.cjs';
-export { DetailedBit, DetailedBitProps, DetailedBitString } from './Detailed.cjs';
-import 'react';
+import { BitElement, BitProps, Bits, BitsProps, EnhancedBitProps } from "./Binary.cjs";
+import { DetailedBit, DetailedBitProps, DetailedBitString, DetailedBitStringProps } from "./Detailed.cjs";
+import { SimpleBit, SimpleBitProps, SimpleBitString, SimpleBitStringProps } from "./Simple.cjs";
+export { BitElement, BitProps, Bits, BitsProps, DetailedBit, DetailedBitProps, DetailedBitString, DetailedBitStringProps, EnhancedBitProps, SimpleBit, SimpleBitProps, SimpleBitString, SimpleBitStringProps };

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export { BitElement, BitProps, Bits, EnhancedBitProps } from './Binary.js';
-export { Simple8BitString, SimpleBit } from './Simple.js';
-export { DetailedBit, DetailedBitProps, DetailedBitString } from './Detailed.js';
-import 'react';
+import { BitElement, BitProps, Bits, BitsProps, EnhancedBitProps } from "./Binary.js";
+import { DetailedBit, DetailedBitProps, DetailedBitString, DetailedBitStringProps } from "./Detailed.js";
+import { SimpleBit, SimpleBitProps, SimpleBitString, SimpleBitStringProps } from "./Simple.js";
+export { BitElement, BitProps, Bits, BitsProps, DetailedBit, DetailedBitProps, DetailedBitString, DetailedBitStringProps, EnhancedBitProps, SimpleBit, SimpleBitProps, SimpleBitString, SimpleBitStringProps };

package/dist/index.js

@@ -1,19 +1 @@
-import {
-  DetailedBit,
-  DetailedBitString
-} from "./chunk-KC5B3ZDB.js";
-import {
-  Simple8BitString,
-  SimpleBit
-} from "./chunk-EIJS7GKA.js";
-import {
-  Bits
-} from "./chunk-76L6HIHJ.js";
-export {
-  Bits,
-  DetailedBit,
-  DetailedBitString,
-  Simple8BitString,
-  SimpleBit
-};
-//# sourceMappingURL=index.js.map
+import{Bits as e}from"./Binary.js";import{DetailedBit as t,DetailedBitString as n}from"./Detailed.js";import{SimpleBit as r,SimpleBitString as i}from"./Simple.js";export{e as Bits,t as DetailedBit,n as DetailedBitString,r as SimpleBit,i as SimpleBitString};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kitsuyui/react-binary",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "Binary representation of number for React",
   "repository": {
     "type": "git",
@@ -22,26 +22,25 @@
     }
   },
   "main": "./dist/index.js",
-  "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "files": [
     "dist",
     "package.json"
   ],
+  "scripts": {
+    "build": "tsdown",
+    "dev": "tsdown --no-clean --watch",
+    "test": "vitest run",
+    "validate": "validate-package-exports --check"
+  },
   "devDependencies": {
-    "@types/react": "^19.1.8",
-    "@types/react-dom": "^19.1.6",
-    "react": "^19.1.0",
-    "react-dom": "^19.1.0"
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4"
   },
   "peerDependencies": {
     "react": "*",
     "react-dom": "*"
-  },
-  "scripts": {
-    "build": "tsup --clean",
-    "dev": "tsup --watch",
-    "test": "vitest run",
-    "validate": "validate-package-exports --check --verify"
   }
-}
+}

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2023 Yui KITSU
-
-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/dist/chunk-76L6HIHJ.js

@@ -1,32 +0,0 @@
-// src/Binary.tsx
-import React from "react";
-import { Fragment, jsx } from "react/jsx-runtime";
-var Bits = (props) => {
-  const { value, bitElement } = props;
-  const bits = (value | 0).toString(2).split("");
-  const bitLength = bits.length;
-  const length = props.length ?? bitLength;
-  const overflowLength = Math.max(0, bitLength - length);
-  const zeroPaddingLength = Math.max(0, length - bitLength);
-  const representLength = Math.max(length, bitLength);
-  const elements = Array.from(Array(representLength)).map((_, index) => {
-    const stand = bits[bitLength - representLength + index] === "1";
-    const bigEndianBitOrder = index;
-    const overflow = bigEndianBitOrder < overflowLength;
-    const zeroPadding = bigEndianBitOrder < zeroPaddingLength;
-    return React.createElement(bitElement, {
-      key: index,
-      stand,
-      overflow,
-      zeroPadding,
-      littleEndianBitOrder: representLength - index - 1,
-      bigEndianBitOrder
-    });
-  });
-  return /* @__PURE__ */ jsx(Fragment, { children: elements });
-};
-
-export {
-  Bits
-};
-//# sourceMappingURL=chunk-76L6HIHJ.js.map

package/dist/chunk-76L6HIHJ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/Binary.tsx"],"sourcesContent":["import React from 'react'\n\n/**\n * BitProps is a type that represents the properties of a bit.\n */\nexport type BitProps = {\n  stand: boolean\n}\n\n/**\n * EnhancedBitProps is a type that adds the following properties to BitProps.\n * - overflow: If true, this means that bit is out of range.\n * - zeroPadding: If true, this means that bit is padded with zero.\n */\nexport type EnhancedBitProps = BitProps & {\n  overflow?: boolean\n  zeroPadding?: boolean\n  littleEndianBitOrder: number\n  bigEndianBitOrder: number\n}\n\nexport type BitElement = React.FC<EnhancedBitProps>\n\n/**\n * Bit is a component that displays a bit.\n * This component supports the behavior of zero padding and overflow.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const Bits = (props: {\n  value: number\n  bitElement: BitElement\n  length?: number | undefined\n}): React.JSX.Element => {\n  const { value, bitElement } = props\n  const bits = (value | 0).toString(2).split('')\n  const bitLength = bits.length\n  const length = props.length ?? bitLength\n  const overflowLength = Math.max(0, bitLength - length)\n  const zeroPaddingLength = Math.max(0, length - bitLength)\n  const representLength = Math.max(length, bitLength)\n  const elements = Array.from(Array(representLength)).map((_, index) => {\n    const stand = bits[bitLength - representLength + index] === '1'\n    const bigEndianBitOrder = index\n    const overflow = bigEndianBitOrder < overflowLength\n    const zeroPadding = bigEndianBitOrder < zeroPaddingLength\n    return React.createElement(bitElement, {\n      key: index,\n      stand,\n      overflow,\n      zeroPadding,\n      littleEndianBitOrder: representLength - index - 1,\n      bigEndianBitOrder,\n    })\n  })\n  return <>{elements}</>\n}\n"],"mappings":";AAAA,OAAO,WAAW;AAuDT;AA1BF,IAAM,OAAO,CAAC,UAII;AACvB,QAAM,EAAE,OAAO,WAAW,IAAI;AAC9B,QAAM,QAAQ,QAAQ,GAAG,SAAS,CAAC,EAAE,MAAM,EAAE;AAC7C,QAAM,YAAY,KAAK;AACvB,QAAM,SAAS,MAAM,UAAU;AAC/B,QAAM,iBAAiB,KAAK,IAAI,GAAG,YAAY,MAAM;AACrD,QAAM,oBAAoB,KAAK,IAAI,GAAG,SAAS,SAAS;AACxD,QAAM,kBAAkB,KAAK,IAAI,QAAQ,SAAS;AAClD,QAAM,WAAW,MAAM,KAAK,MAAM,eAAe,CAAC,EAAE,IAAI,CAAC,GAAG,UAAU;AACpE,UAAM,QAAQ,KAAK,YAAY,kBAAkB,KAAK,MAAM;AAC5D,UAAM,oBAAoB;AAC1B,UAAM,WAAW,oBAAoB;AACrC,UAAM,cAAc,oBAAoB;AACxC,WAAO,MAAM,cAAc,YAAY;AAAA,MACrC,KAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,sBAAsB,kBAAkB,QAAQ;AAAA,MAChD;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACD,SAAO,gCAAG,oBAAS;AACrB;","names":[]}

package/dist/chunk-EIJS7GKA.js

@@ -1,22 +0,0 @@
-import {
-  Bits
-} from "./chunk-76L6HIHJ.js";
-
-// src/Simple.tsx
-import { Fragment, jsx } from "react/jsx-runtime";
-var SimpleBit = (props) => {
-  const { stand, overflow } = props;
-  const baseText = stand ? "1" : "0";
-  const isOverflowVisible = overflow ?? false;
-  const text = isOverflowVisible ? "" : baseText;
-  return /* @__PURE__ */ jsx(Fragment, { children: text });
-};
-var Simple8BitString = (props) => {
-  return /* @__PURE__ */ jsx(Bits, { value: props.value, length: 8, bitElement: SimpleBit });
-};
-
-export {
-  SimpleBit,
-  Simple8BitString
-};
-//# sourceMappingURL=chunk-EIJS7GKA.js.map

package/dist/chunk-EIJS7GKA.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/Simple.tsx"],"sourcesContent":["import type React from 'react'\nimport { Bits, type EnhancedBitProps } from './Binary'\n\n/**\n * SimpleBit is a simple component that displays a bit.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const SimpleBit = (props: EnhancedBitProps): React.JSX.Element => {\n  const { stand, overflow } = props\n  const baseText = stand ? '1' : '0'\n  const isOverflowVisible = overflow ?? false\n  const text = isOverflowVisible ? '' : baseText\n  return <>{text}</>\n}\n\nexport const Simple8BitString = (props: { value: number }): React.JSX.Element => {\n  return <Bits value={props.value} length={8} bitElement={SimpleBit} />\n}\n"],"mappings":";;;;;AAaS;AALF,IAAM,YAAY,CAAC,UAA+C;AACvE,QAAM,EAAE,OAAO,SAAS,IAAI;AAC5B,QAAM,WAAW,QAAQ,MAAM;AAC/B,QAAM,oBAAoB,YAAY;AACtC,QAAM,OAAO,oBAAoB,KAAK;AACtC,SAAO,gCAAG,gBAAK;AACjB;AAEO,IAAM,mBAAmB,CAAC,UAAgD;AAC/E,SAAO,oBAAC,QAAK,OAAO,MAAM,OAAO,QAAQ,GAAG,YAAY,WAAW;AACrE;","names":[]}

package/dist/chunk-KC5B3ZDB.js

@@ -1,71 +0,0 @@
-import {
-  Bits
-} from "./chunk-76L6HIHJ.js";
-
-// src/Detailed.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-var DetailedBit = (props) => {
-  const { stand, overflow, zeroPadding } = props;
-  const displayLittleEndianBitOrder = props.displayLittleEndianBitOrder ?? false;
-  const displayBigEndianBitOrder = props.displayBigEndianBitOrder ?? false;
-  const text = stand ? "1" : "0";
-  const border = overflow ? "1px dotted red" : zeroPadding ? "1px dotted gray" : "1px solid #cccccc";
-  const margin = "0.5px";
-  const color = stand ? "#999999" : "#cccccc";
-  const backgroundColor = stand ? "#000000" : "#ffffff";
-  const fontFamily = "monospace";
-  return /* @__PURE__ */ jsxs("div", { style: { display: "inline-block", fontFamily, margin }, children: [
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        style: {
-          color,
-          backgroundColor,
-          border
-        },
-        children: text
-      }
-    ),
-    displayLittleEndianBitOrder && /* @__PURE__ */ jsx(IndexLabel, { index: props.littleEndianBitOrder }),
-    displayBigEndianBitOrder && /* @__PURE__ */ jsx(IndexLabel, { index: props.bigEndianBitOrder })
-  ] });
-};
-var IndexLabel = (props) => {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      style: {
-        userSelect: "none",
-        fontSize: "0.5em",
-        textAlign: "center",
-        lineHeight: "1em"
-      },
-      children: props.index
-    }
-  );
-};
-var DetailedBitString = (props) => {
-  const showLittleEndianBitOrder = props.showLittleEndianBitOrder ?? false;
-  const showBigEndianBitOrder = props.showBigEndianBitOrder ?? false;
-  return /* @__PURE__ */ jsx(
-    Bits,
-    {
-      value: props.value,
-      length: props.length,
-      bitElement: (props2) => /* @__PURE__ */ jsx(
-        DetailedBit,
-        {
-          ...props2,
-          displayLittleEndianBitOrder: showLittleEndianBitOrder,
-          displayBigEndianBitOrder: showBigEndianBitOrder
-        }
-      )
-    }
-  );
-};
-
-export {
-  DetailedBit,
-  DetailedBitString
-};
-//# sourceMappingURL=chunk-KC5B3ZDB.js.map

package/dist/chunk-KC5B3ZDB.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/Detailed.tsx"],"sourcesContent":["import type React from 'react'\nimport { Bits, type EnhancedBitProps } from './Binary'\n\nexport type DetailedBitProps = EnhancedBitProps & {\n  displayLittleEndianBitOrder?: boolean | undefined\n  displayBigEndianBitOrder?: boolean | undefined\n}\n\nexport const DetailedBit = (props: DetailedBitProps): React.JSX.Element => {\n  const { stand, overflow, zeroPadding } = props\n  const displayLittleEndianBitOrder = props.displayLittleEndianBitOrder ?? false\n  const displayBigEndianBitOrder = props.displayBigEndianBitOrder ?? false\n  const text = stand ? '1' : '0'\n  const border = overflow\n    ? '1px dotted red'\n    : zeroPadding\n      ? '1px dotted gray'\n      : '1px solid #cccccc'\n  const margin = '0.5px'\n  const color = stand ? '#999999' : '#cccccc'\n  const backgroundColor = stand ? '#000000' : '#ffffff'\n  const fontFamily = 'monospace'\n  return (\n    <div style={{ display: 'inline-block', fontFamily, margin }}>\n      <div\n        style={{\n          color,\n          backgroundColor,\n          border,\n        }}\n      >\n        {text}\n      </div>\n      {displayLittleEndianBitOrder && (\n        <IndexLabel index={props.littleEndianBitOrder} />\n      )}\n      {displayBigEndianBitOrder && (\n        <IndexLabel index={props.bigEndianBitOrder} />\n      )}\n    </div>\n  )\n}\n\nconst IndexLabel = (props: { index: number }): React.JSX.Element => {\n  return (\n    <div\n      style={{\n        userSelect: 'none',\n        fontSize: '0.5em',\n        textAlign: 'center',\n        lineHeight: '1em',\n      }}\n    >\n      {props.index}\n    </div>\n  )\n}\n\nexport const DetailedBitString = (props: {\n  value: number\n  length?: number\n  showLittleEndianBitOrder?: boolean | undefined\n  showBigEndianBitOrder?: boolean | undefined\n}): React.JSX.Element => {\n  const showLittleEndianBitOrder = props.showLittleEndianBitOrder ?? false\n  const showBigEndianBitOrder = props.showBigEndianBitOrder ?? false\n  return (\n    <Bits\n      value={props.value}\n      length={props.length}\n      bitElement={(props) => (\n        <DetailedBit\n          {...props}\n          displayLittleEndianBitOrder={showLittleEndianBitOrder}\n          displayBigEndianBitOrder={showBigEndianBitOrder}\n        />\n      )}\n    />\n  )\n}\n"],"mappings":";;;;;AAuBI,SACE,KADF;AAfG,IAAM,cAAc,CAAC,UAA+C;AACzE,QAAM,EAAE,OAAO,UAAU,YAAY,IAAI;AACzC,QAAM,8BAA8B,MAAM,+BAA+B;AACzE,QAAM,2BAA2B,MAAM,4BAA4B;AACnE,QAAM,OAAO,QAAQ,MAAM;AAC3B,QAAM,SAAS,WACX,mBACA,cACE,oBACA;AACN,QAAM,SAAS;AACf,QAAM,QAAQ,QAAQ,YAAY;AAClC,QAAM,kBAAkB,QAAQ,YAAY;AAC5C,QAAM,aAAa;AACnB,SACE,qBAAC,SAAI,OAAO,EAAE,SAAS,gBAAgB,YAAY,OAAO,GACxD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,IACC,+BACC,oBAAC,cAAW,OAAO,MAAM,sBAAsB;AAAA,IAEhD,4BACC,oBAAC,cAAW,OAAO,MAAM,mBAAmB;AAAA,KAEhD;AAEJ;AAEA,IAAM,aAAa,CAAC,UAAgD;AAClE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,WAAW;AAAA,QACX,YAAY;AAAA,MACd;AAAA,MAEC,gBAAM;AAAA;AAAA,EACT;AAEJ;AAEO,IAAM,oBAAoB,CAAC,UAKT;AACvB,QAAM,2BAA2B,MAAM,4BAA4B;AACnE,QAAM,wBAAwB,MAAM,yBAAyB;AAC7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,MAAM;AAAA,MACb,QAAQ,MAAM;AAAA,MACd,YAAY,CAACA,WACX;AAAA,QAAC;AAAA;AAAA,UACE,GAAGA;AAAA,UACJ,6BAA6B;AAAA,UAC7B,0BAA0B;AAAA;AAAA,MAC5B;AAAA;AAAA,EAEJ;AAEJ;","names":["props"]}

package/dist/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/index.ts","../src/Binary.tsx","../src/Simple.tsx","../src/Detailed.tsx"],"sourcesContent":["export * from './Binary'\nexport * from './Simple'\nexport * from './Detailed'\n","import React from 'react'\n\n/**\n * BitProps is a type that represents the properties of a bit.\n */\nexport type BitProps = {\n  stand: boolean\n}\n\n/**\n * EnhancedBitProps is a type that adds the following properties to BitProps.\n * - overflow: If true, this means that bit is out of range.\n * - zeroPadding: If true, this means that bit is padded with zero.\n */\nexport type EnhancedBitProps = BitProps & {\n  overflow?: boolean\n  zeroPadding?: boolean\n  littleEndianBitOrder: number\n  bigEndianBitOrder: number\n}\n\nexport type BitElement = React.FC<EnhancedBitProps>\n\n/**\n * Bit is a component that displays a bit.\n * This component supports the behavior of zero padding and overflow.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const Bits = (props: {\n  value: number\n  bitElement: BitElement\n  length?: number | undefined\n}): React.JSX.Element => {\n  const { value, bitElement } = props\n  const bits = (value | 0).toString(2).split('')\n  const bitLength = bits.length\n  const length = props.length ?? bitLength\n  const overflowLength = Math.max(0, bitLength - length)\n  const zeroPaddingLength = Math.max(0, length - bitLength)\n  const representLength = Math.max(length, bitLength)\n  const elements = Array.from(Array(representLength)).map((_, index) => {\n    const stand = bits[bitLength - representLength + index] === '1'\n    const bigEndianBitOrder = index\n    const overflow = bigEndianBitOrder < overflowLength\n    const zeroPadding = bigEndianBitOrder < zeroPaddingLength\n    return React.createElement(bitElement, {\n      key: index,\n      stand,\n      overflow,\n      zeroPadding,\n      littleEndianBitOrder: representLength - index - 1,\n      bigEndianBitOrder,\n    })\n  })\n  return <>{elements}</>\n}\n","import type React from 'react'\nimport { Bits, type EnhancedBitProps } from './Binary'\n\n/**\n * SimpleBit is a simple component that displays a bit.\n * @param props\n * @returns A component that displays a bit.\n */\nexport const SimpleBit = (props: EnhancedBitProps): React.JSX.Element => {\n  const { stand, overflow } = props\n  const baseText = stand ? '1' : '0'\n  const isOverflowVisible = overflow ?? false\n  const text = isOverflowVisible ? '' : baseText\n  return <>{text}</>\n}\n\nexport const Simple8BitString = (props: { value: number }): React.JSX.Element => {\n  return <Bits value={props.value} length={8} bitElement={SimpleBit} />\n}\n","import type React from 'react'\nimport { Bits, type EnhancedBitProps } from './Binary'\n\nexport type DetailedBitProps = EnhancedBitProps & {\n  displayLittleEndianBitOrder?: boolean | undefined\n  displayBigEndianBitOrder?: boolean | undefined\n}\n\nexport const DetailedBit = (props: DetailedBitProps): React.JSX.Element => {\n  const { stand, overflow, zeroPadding } = props\n  const displayLittleEndianBitOrder = props.displayLittleEndianBitOrder ?? false\n  const displayBigEndianBitOrder = props.displayBigEndianBitOrder ?? false\n  const text = stand ? '1' : '0'\n  const border = overflow\n    ? '1px dotted red'\n    : zeroPadding\n      ? '1px dotted gray'\n      : '1px solid #cccccc'\n  const margin = '0.5px'\n  const color = stand ? '#999999' : '#cccccc'\n  const backgroundColor = stand ? '#000000' : '#ffffff'\n  const fontFamily = 'monospace'\n  return (\n    <div style={{ display: 'inline-block', fontFamily, margin }}>\n      <div\n        style={{\n          color,\n          backgroundColor,\n          border,\n        }}\n      >\n        {text}\n      </div>\n      {displayLittleEndianBitOrder && (\n        <IndexLabel index={props.littleEndianBitOrder} />\n      )}\n      {displayBigEndianBitOrder && (\n        <IndexLabel index={props.bigEndianBitOrder} />\n      )}\n    </div>\n  )\n}\n\nconst IndexLabel = (props: { index: number }): React.JSX.Element => {\n  return (\n    <div\n      style={{\n        userSelect: 'none',\n        fontSize: '0.5em',\n        textAlign: 'center',\n        lineHeight: '1em',\n      }}\n    >\n      {props.index}\n    </div>\n  )\n}\n\nexport const DetailedBitString = (props: {\n  value: number\n  length?: number\n  showLittleEndianBitOrder?: boolean | undefined\n  showBigEndianBitOrder?: boolean | undefined\n}): React.JSX.Element => {\n  const showLittleEndianBitOrder = props.showLittleEndianBitOrder ?? false\n  const showBigEndianBitOrder = props.showBigEndianBitOrder ?? false\n  return (\n    <Bits\n      value={props.value}\n      length={props.length}\n      bitElement={(props) => (\n        <DetailedBit\n          {...props}\n          displayLittleEndianBitOrder={showLittleEndianBitOrder}\n          displayBigEndianBitOrder={showBigEndianBitOrder}\n        />\n      )}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAkB;AAuDT;AA1BF,IAAM,OAAO,CAAC,UAII;AACvB,QAAM,EAAE,OAAO,WAAW,IAAI;AAC9B,QAAM,QAAQ,QAAQ,GAAG,SAAS,CAAC,EAAE,MAAM,EAAE;AAC7C,QAAM,YAAY,KAAK;AACvB,QAAM,SAAS,MAAM,UAAU;AAC/B,QAAM,iBAAiB,KAAK,IAAI,GAAG,YAAY,MAAM;AACrD,QAAM,oBAAoB,KAAK,IAAI,GAAG,SAAS,SAAS;AACxD,QAAM,kBAAkB,KAAK,IAAI,QAAQ,SAAS;AAClD,QAAM,WAAW,MAAM,KAAK,MAAM,eAAe,CAAC,EAAE,IAAI,CAAC,GAAG,UAAU;AACpE,UAAM,QAAQ,KAAK,YAAY,kBAAkB,KAAK,MAAM;AAC5D,UAAM,oBAAoB;AAC1B,UAAM,WAAW,oBAAoB;AACrC,UAAM,cAAc,oBAAoB;AACxC,WAAO,aAAAA,QAAM,cAAc,YAAY;AAAA,MACrC,KAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,sBAAsB,kBAAkB,QAAQ;AAAA,MAChD;AAAA,IACF,CAAC;AAAA,EACH,CAAC;AACD,SAAO,2EAAG,oBAAS;AACrB;;;AC3CS,IAAAC,sBAAA;AALF,IAAM,YAAY,CAAC,UAA+C;AACvE,QAAM,EAAE,OAAO,SAAS,IAAI;AAC5B,QAAM,WAAW,QAAQ,MAAM;AAC/B,QAAM,oBAAoB,YAAY;AACtC,QAAM,OAAO,oBAAoB,KAAK;AACtC,SAAO,6EAAG,gBAAK;AACjB;AAEO,IAAM,mBAAmB,CAAC,UAAgD;AAC/E,SAAO,6CAAC,QAAK,OAAO,MAAM,OAAO,QAAQ,GAAG,YAAY,WAAW;AACrE;;;ACKI,IAAAC,sBAAA;AAfG,IAAM,cAAc,CAAC,UAA+C;AACzE,QAAM,EAAE,OAAO,UAAU,YAAY,IAAI;AACzC,QAAM,8BAA8B,MAAM,+BAA+B;AACzE,QAAM,2BAA2B,MAAM,4BAA4B;AACnE,QAAM,OAAO,QAAQ,MAAM;AAC3B,QAAM,SAAS,WACX,mBACA,cACE,oBACA;AACN,QAAM,SAAS;AACf,QAAM,QAAQ,QAAQ,YAAY;AAClC,QAAM,kBAAkB,QAAQ,YAAY;AAC5C,QAAM,aAAa;AACnB,SACE,8CAAC,SAAI,OAAO,EAAE,SAAS,gBAAgB,YAAY,OAAO,GACxD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,IACC,+BACC,6CAAC,cAAW,OAAO,MAAM,sBAAsB;AAAA,IAEhD,4BACC,6CAAC,cAAW,OAAO,MAAM,mBAAmB;AAAA,KAEhD;AAEJ;AAEA,IAAM,aAAa,CAAC,UAAgD;AAClE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,QACL,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,WAAW;AAAA,QACX,YAAY;AAAA,MACd;AAAA,MAEC,gBAAM;AAAA;AAAA,EACT;AAEJ;AAEO,IAAM,oBAAoB,CAAC,UAKT;AACvB,QAAM,2BAA2B,MAAM,4BAA4B;AACnE,QAAM,wBAAwB,MAAM,yBAAyB;AAC7D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,MAAM;AAAA,MACb,QAAQ,MAAM;AAAA,MACd,YAAY,CAACC,WACX;AAAA,QAAC;AAAA;AAAA,UACE,GAAGA;AAAA,UACJ,6BAA6B;AAAA,UAC7B,0BAA0B;AAAA;AAAA,MAC5B;AAAA;AAAA,EAEJ;AAEJ;","names":["React","import_jsx_runtime","import_jsx_runtime","props"]}

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}