@vef-framework/components 1.0.98 → 1.0.99

package/lib/vef-table/components/columns/file.cjs

@@ -1,3 +1,15 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime");exports.default=function File({value:t}){return e.jsx("span",{children:t})};
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+
+function File({
+  value
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { children: value });
+}
+
+exports.default = File;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-table/components/columns/icon.cjs

@@ -1,3 +1,15 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime");exports.default=function Icon({value:t}){return e.jsx("span",{children:t})};
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+
+function Icon({
+  value
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { children: value });
+}
+
+exports.default = Icon;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-table/components/columns/id.cjs

@@ -1,3 +1,87 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),r=require("@emotion/react"),t=require("@vef-framework/shared"),u=require("react"),l=require("../../../vef-text/index.cjs"),o=require("../../hooks/use-computed-values.cjs"),i=/Id$/;exports.default=function Id({value:s,record:a,rowIndex:c,columnProps:d}){if("Id"!==d.type)throw new t.VefError(-1,"Column type must be Id");const{name:n,defaultValue:m,ellipsis:f,bold:p,italic:x,color:h,width:w}=d,[V,b,q]=o.useComputedValues([{key:"bold",rawValue:p,defaultValue:!1},{key:"italic",rawValue:x,defaultValue:!1},{key:"color",rawValue:h}],s,a,c),v=u.useMemo((()=>{const e=n.replace(i,"Name");return t.isNullish(s)||t.isNullish(a[e])?m:a[e]}),[s,a,n,m]),y=u.useMemo((()=>{if(w)return r.css({maxWidth:`${w}px !important`})}),[w]);return e.jsx(l.default,{bold:V,color:q,css:y,ellipsis:f,italic:b,children:v})};
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const react$1 = require('@emotion/react');
+const shared = require('@vef-framework/shared');
+const react = require('react');
+const index = require('../../../vef-text/index.cjs');
+const useComputedValues = require('../../hooks/use-computed-values.cjs');
+
+const ID_NAME_SUFFIX = "Name";
+const ID_NAME_REPLACE_REGEX = /Id$/;
+function Id({
+  value,
+  record,
+  rowIndex,
+  columnProps
+}) {
+  if (columnProps.type !== "Id") {
+    throw new shared.VefError(-1, "Column type must be Id");
+  }
+  const {
+    name,
+    defaultValue,
+    ellipsis,
+    bold,
+    italic,
+    color,
+    width
+  } = columnProps;
+  const [boldToUse, italicToUse, colorToUse] = useComputedValues.useComputedValues(
+    [
+      {
+        key: "bold",
+        rawValue: bold,
+        defaultValue: false
+      },
+      {
+        key: "italic",
+        rawValue: italic,
+        defaultValue: false
+      },
+      {
+        key: "color",
+        rawValue: color
+      }
+    ],
+    value,
+    record,
+    rowIndex
+  );
+  const valueToDisplay = react.useMemo(() => {
+    const nameToUse = name.replace(ID_NAME_REPLACE_REGEX, ID_NAME_SUFFIX);
+    if (shared.isNullish(value) || shared.isNullish(record[nameToUse])) {
+      return defaultValue;
+    }
+    return record[nameToUse];
+  }, [
+    value,
+    record,
+    name,
+    defaultValue
+  ]);
+  const cssToUse = react.useMemo(() => {
+    if (width) {
+      return react$1.css({
+        maxWidth: `${width}px !important`
+      });
+    }
+  }, [width]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.default,
+    {
+      bold: boldToUse,
+      color: colorToUse,
+      css: cssToUse,
+      ellipsis,
+      italic: italicToUse,
+      children: valueToDisplay
+    }
+  );
+}
+
+exports.default = Id;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-table/components/columns/image.cjs

@@ -1,3 +1,16 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),r=require("@vef-framework/shared");exports.default=function Image({value:t}){return e.jsx("img",{alt:r.extractBaseName(t),src:t})};
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const shared = require('@vef-framework/shared');
+
+function Image({
+  value
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("img", { alt: shared.extractBaseName(value), src: value });
+}
+
+exports.default = Image;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-table/components/columns/index.cjs

@@ -1,3 +1,38 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./bool.cjs"),r=require("./code.cjs"),u=require("./data-dictionary.cjs"),t=require("./enum.cjs"),i=require("./file.cjs"),a=require("./icon.cjs"),c=require("./id.cjs"),d=require("./image.cjs"),o=require("./markdown.cjs"),s=require("./number.cjs"),l=require("./render.cjs"),n=require("./rich-text.cjs"),f=require("./text.cjs");require("./props.cjs");const j={Text:f.default,Number:s.default,Enum:t.default,Boolean:e.default,DataDictionary:u.default,Id:c.default,Render:l.default,Markdown:o.default,Icon:a.default,File:i.default,RichText:n.default,Image:d.default,Code:r.default};exports.columnComponents=j;
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const bool = require('./bool.cjs');
+const code = require('./code.cjs');
+const dataDictionary = require('./data-dictionary.cjs');
+const _enum = require('./enum.cjs');
+const file = require('./file.cjs');
+const icon = require('./icon.cjs');
+const id = require('./id.cjs');
+const image = require('./image.cjs');
+const markdown = require('./markdown.cjs');
+const number = require('./number.cjs');
+const render = require('./render.cjs');
+const richText = require('./rich-text.cjs');
+const text = require('./text.cjs');
+require('./props.cjs');
+
+const columnComponents = {
+  Text: text.default,
+  Number: number.default,
+  Enum: _enum.default,
+  Boolean: bool.default,
+  DataDictionary: dataDictionary.default,
+  Id: id.default,
+  Render: render.default,
+  Markdown: markdown.default,
+  Icon: icon.default,
+  File: file.default,
+  RichText: richText.default,
+  Image: image.default,
+  Code: code.default
+};
+
+exports.columnComponents = columnComponents;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-table/components/columns/markdown.cjs

@@ -1,3 +1,15 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime");exports.default=function Markdown({value:t}){return e.jsx("span",{children:t})};
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+
+function Markdown({
+  value
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { children: value });
+}
+
+exports.default = Markdown;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-table/components/columns/number.cjs

@@ -1,3 +1,88 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),r=require("@emotion/react"),u=require("@vef-framework/shared"),t=require("react"),l=require("../../../vef-text/index.cjs"),o=require("../../hooks/use-computed-values.cjs"),a=require("../../hooks/use-display-value.cjs");exports.default=function NumberColumn({value:i,record:s,rowIndex:c,columnProps:d}){if("Number"!==d.type)throw new u.VefError(-1,"Column type must be Number");const{defaultValue:f,formatter:n,prefix:m,suffix:p,bold:x,italic:V,color:b,width:h}=d,w=a.useDisplayValue(i,s,c,{defaultValue:f,formatter:n,prefix:m,suffix:p}),[y,q,v]=o.useComputedValues([{key:"bold",rawValue:x,defaultValue:!1},{key:"italic",rawValue:V,defaultValue:!1},{key:"color",rawValue:b}],i,s,c),j=t.useMemo((()=>{if(h)return r.css({maxWidth:`${h}px !important`})}),[h]);return u.isNullish(w)?null:e.jsx(l.default,{bold:y,color:v,css:j,italic:q,children:w})};
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const react$1 = require('@emotion/react');
+const shared = require('@vef-framework/shared');
+const react = require('react');
+const index = require('../../../vef-text/index.cjs');
+const useComputedValues = require('../../hooks/use-computed-values.cjs');
+const useDisplayValue = require('../../hooks/use-display-value.cjs');
+
+function NumberColumn({
+  value,
+  record,
+  rowIndex,
+  columnProps
+}) {
+  if (columnProps.type !== "Number") {
+    throw new shared.VefError(-1, "Column type must be Number");
+  }
+  const {
+    defaultValue,
+    formatter,
+    prefix,
+    suffix,
+    bold,
+    italic,
+    color,
+    width
+  } = columnProps;
+  const displayValue = useDisplayValue.useDisplayValue(
+    value,
+    record,
+    rowIndex,
+    {
+      defaultValue,
+      formatter,
+      prefix,
+      suffix
+    }
+  );
+  const [boldToUse, italicToUse, colorToUse] = useComputedValues.useComputedValues(
+    [
+      {
+        key: "bold",
+        rawValue: bold,
+        defaultValue: false
+      },
+      {
+        key: "italic",
+        rawValue: italic,
+        defaultValue: false
+      },
+      {
+        key: "color",
+        rawValue: color
+      }
+    ],
+    value,
+    record,
+    rowIndex
+  );
+  const cssToUse = react.useMemo(() => {
+    if (width) {
+      return react$1.css({
+        maxWidth: `${width}px !important`
+      });
+    }
+  }, [width]);
+  if (shared.isNullish(displayValue)) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.default,
+    {
+      bold: boldToUse,
+      color: colorToUse,
+      css: cssToUse,
+      italic: italicToUse,
+      children: displayValue
+    }
+  );
+}
+
+exports.default = NumberColumn;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-table/components/columns/props.cjs

@@ -1,3 +1,5 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-table/components/columns/render.cjs

@@ -1,3 +1,33 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),r=require("@emotion/react"),t=require("@vef-framework/shared"),o=require("react");exports.default=function Render({value:n,record:i,rowIndex:u,columnProps:s}){if("Render"!==s.type)throw new t.VefError(-1,"Column type must be Render");const{render:d,width:c}=s,a=d?.(n,i,u),m=o.useMemo((()=>{if(c)return r.css({maxWidth:`${c}px !important`})}),[c]);return e.jsx("div",{css:m,children:a})};
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const react$1 = require('@emotion/react');
+const shared = require('@vef-framework/shared');
+const react = require('react');
+
+function Render({
+  value,
+  record,
+  rowIndex,
+  columnProps
+}) {
+  if (columnProps.type !== "Render") {
+    throw new shared.VefError(-1, "Column type must be Render");
+  }
+  const { render, width } = columnProps;
+  const content = render?.(value, record, rowIndex);
+  const cssToUse = react.useMemo(() => {
+    if (width) {
+      return react$1.css({
+        maxWidth: `${width}px !important`
+      });
+    }
+  }, [width]);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { css: cssToUse, children: content });
+}
+
+exports.default = Render;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-table/components/columns/rich-text.cjs

@@ -1,3 +1,15 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime");exports.default=function RichText({value:t}){return e.jsx("span",{children:t})};
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+
+function RichText({
+  value
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { children: value });
+}
+
+exports.default = RichText;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */

package/lib/vef-table/components/columns/text.cjs

@@ -1,3 +1,93 @@
-/*! VefFramework version: 1.0.98, build time: 2025-03-07T07:45:28.961Z, made by Venus. */
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@emotion/react/jsx-runtime"),r=require("@emotion/react"),l=require("@vef-framework/shared"),u=require("react"),t=require("../../../vef-text/index.cjs"),i=require("../../hooks/use-computed-values.cjs"),o=require("../../hooks/use-display-value.cjs");exports.default=function Text({value:s,record:a,rowIndex:c,columnProps:d}){if("Text"!==d.type)throw new l.VefError(-1,"Column type must be Text");const{defaultValue:f,formatter:p,prefix:n,suffix:x,ellipsis:m,bold:y,italic:V,color:b,copyable:h,width:v}=d,[w,q,j]=i.useComputedValues([{key:"bold",rawValue:y,defaultValue:!1},{key:"italic",rawValue:V,defaultValue:!1},{key:"color",rawValue:b}],s,a,c),k=o.useDisplayValue(s,a,c,{defaultValue:f,formatter:p,prefix:n,suffix:x}),T=u.useMemo((()=>{if(v)return r.css({maxWidth:`${v}px !important`})}),[v]);return l.isNullish(k)?null:e.jsx(t.default,{bold:w,color:j,copyable:h,css:T,ellipsis:m,ellipsisTip:m?k:void 0,italic:q,children:k})};
+/*! VefFramework version: 1.0.99, build time: 2025-03-07T13:41:55.865Z, made by Venus. */
+'use strict';
+
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+
+const jsxRuntime = require('@emotion/react/jsx-runtime');
+const react$1 = require('@emotion/react');
+const shared = require('@vef-framework/shared');
+const react = require('react');
+const index = require('../../../vef-text/index.cjs');
+const useComputedValues = require('../../hooks/use-computed-values.cjs');
+const useDisplayValue = require('../../hooks/use-display-value.cjs');
+
+function Text({
+  value,
+  record,
+  rowIndex,
+  columnProps
+}) {
+  if (columnProps.type !== "Text") {
+    throw new shared.VefError(-1, "Column type must be Text");
+  }
+  const {
+    defaultValue,
+    formatter,
+    prefix,
+    suffix,
+    ellipsis,
+    bold,
+    italic,
+    color,
+    copyable,
+    width
+  } = columnProps;
+  const [boldToUse, italicToUse, colorToUse] = useComputedValues.useComputedValues(
+    [
+      {
+        key: "bold",
+        rawValue: bold,
+        defaultValue: false
+      },
+      {
+        key: "italic",
+        rawValue: italic,
+        defaultValue: false
+      },
+      {
+        key: "color",
+        rawValue: color
+      }
+    ],
+    value,
+    record,
+    rowIndex
+  );
+  const valueToDisplay = useDisplayValue.useDisplayValue(
+    value,
+    record,
+    rowIndex,
+    {
+      defaultValue,
+      formatter,
+      prefix,
+      suffix
+    }
+  );
+  const cssToUse = react.useMemo(() => {
+    if (width) {
+      return react$1.css({
+        maxWidth: `${width}px !important`
+      });
+    }
+  }, [width]);
+  if (shared.isNullish(valueToDisplay)) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.default,
+    {
+      bold: boldToUse,
+      color: colorToUse,
+      copyable,
+      css: cssToUse,
+      ellipsis,
+      ellipsisTip: ellipsis ? valueToDisplay : void 0,
+      italic: italicToUse,
+      children: valueToDisplay
+    }
+  );
+}
+
+exports.default = Text;
 /*! VefFramework is a blazingly high-level, modern, flexible, easy-to-use UI framework made by Venus. Follow me on Github: https://github.com/ilxqx! @ilxqx */