react-component-truncated
Version:
Purely stylistic React.JS component to truncate long strings, like crypto addresses or tokens.
199 lines (198 loc) • 7.5 kB
JavaScript
var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp.call(b, prop))
__defNormalProp(a, prop, b[prop]);
if (__getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(b)) {
if (__propIsEnum.call(b, prop))
__defNormalProp(a, prop, b[prop]);
}
return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __objRest = (source, exclude) => {
var target = {};
for (var prop in source)
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
target[prop] = source[prop];
if (source != null && __getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(source)) {
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
target[prop] = source[prop];
}
return target;
};
var __vite_style__ = document.createElement("style");
__vite_style__.innerHTML = "._root_1u0yk_1 {\n display: inline-flex;\n max-width: 100%;\n user-select: all;\n flex-direction: row;\n flex-wrap: nowrap;\n align-items: center;\n}\n._root_1u0yk_1 div {\n flex-shrink: 0;\n flex-grow: 0;\n order: 2;\n user-select: none;\n padding: 0 2px;\n}\n._root_1u0yk_1 span {\n order: 1;\n flex-grow: 0;\n overflow: hidden;\n text-overflow: clip;\n white-space: nowrap;\n word-break: break-all;\n}\n._root_1u0yk_1 span:last-of-type {\n order: 3;\n display: inline-flex;\n justify-content: end;\n}";
document.head.appendChild(__vite_style__);
(function(global, factory) {
typeof exports === "object" && typeof module !== "undefined" ? module.exports = factory(require("react")) : typeof define === "function" && define.amd ? define(["react"], factory) : (global = typeof globalThis !== "undefined" ? globalThis : global || self, global["react-component-truncated"] = factory(global.react));
})(this, function(require$$0) {
"use strict";
function _interopDefaultLegacy(e) {
return e && typeof e === "object" && "default" in e ? e : { "default": e };
}
var require$$0__default = /* @__PURE__ */ _interopDefaultLegacy(require$$0);
const root = "_root_1u0yk_1";
var styles = {
root
};
var jsxRuntime = { exports: {} };
var reactJsxRuntime_production_min = {};
/*
object-assign
(c) Sindre Sorhus
@license MIT
*/
var getOwnPropertySymbols = Object.getOwnPropertySymbols;
var hasOwnProperty = Object.prototype.hasOwnProperty;
var propIsEnumerable = Object.prototype.propertyIsEnumerable;
function toObject(val) {
if (val === null || val === void 0) {
throw new TypeError("Object.assign cannot be called with null or undefined");
}
return Object(val);
}
function shouldUseNative() {
try {
if (!Object.assign) {
return false;
}
var test1 = new String("abc");
test1[5] = "de";
if (Object.getOwnPropertyNames(test1)[0] === "5") {
return false;
}
var test2 = {};
for (var i = 0; i < 10; i++) {
test2["_" + String.fromCharCode(i)] = i;
}
var order2 = Object.getOwnPropertyNames(test2).map(function(n2) {
return test2[n2];
});
if (order2.join("") !== "0123456789") {
return false;
}
var test3 = {};
"abcdefghijklmnopqrst".split("").forEach(function(letter) {
test3[letter] = letter;
});
if (Object.keys(Object.assign({}, test3)).join("") !== "abcdefghijklmnopqrst") {
return false;
}
return true;
} catch (err) {
return false;
}
}
shouldUseNative() ? Object.assign : function(target, source) {
var from;
var to = toObject(target);
var symbols;
for (var s = 1; s < arguments.length; s++) {
from = Object(arguments[s]);
for (var key in from) {
if (hasOwnProperty.call(from, key)) {
to[key] = from[key];
}
}
if (getOwnPropertySymbols) {
symbols = getOwnPropertySymbols(from);
for (var i = 0; i < symbols.length; i++) {
if (propIsEnumerable.call(from, symbols[i])) {
to[symbols[i]] = from[symbols[i]];
}
}
}
}
return to;
};
/** @license React v17.0.2
* react-jsx-runtime.production.min.js
*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var f = require$$0__default["default"], g = 60103;
reactJsxRuntime_production_min.Fragment = 60107;
if (typeof Symbol === "function" && Symbol.for) {
var h = Symbol.for;
g = h("react.element");
reactJsxRuntime_production_min.Fragment = h("react.fragment");
}
var m = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, n = Object.prototype.hasOwnProperty, p = { key: true, ref: true, __self: true, __source: true };
function q(c, a, k) {
var b, d = {}, e = null, l = null;
k !== void 0 && (e = "" + k);
a.key !== void 0 && (e = "" + a.key);
a.ref !== void 0 && (l = a.ref);
for (b in a)
n.call(a, b) && !p.hasOwnProperty(b) && (d[b] = a[b]);
if (c && c.defaultProps)
for (b in a = c.defaultProps, a)
d[b] === void 0 && (d[b] = a[b]);
return { $$typeof: g, type: c, key: e, ref: l, props: d, _owner: m.current };
}
reactJsxRuntime_production_min.jsx = q;
reactJsxRuntime_production_min.jsxs = q;
{
jsxRuntime.exports = reactJsxRuntime_production_min;
}
const jsx = jsxRuntime.exports.jsx;
const jsxs = jsxRuntime.exports.jsxs;
function Truncated(_a) {
var _b = _a, {
children,
className
} = _b, props = __objRest(_b, [
"children",
"className"
]);
const content = `${children}`;
const middle = Math.round(content.length / 2);
const [mainRef, setMainRef] = require$$0.useState(null);
const span1Ref = require$$0.useRef(null);
const span2Ref = require$$0.useRef(null);
const [overflowing, setOverflowing] = require$$0.useState(false);
require$$0.useEffect(() => {
if (!mainRef) {
return;
}
const resizeObserver = new ResizeObserver((entries) => {
if (!span1Ref || !span2Ref) {
return;
}
entries.forEach(() => {
setOverflowing(span1Ref.current.clientWidth < span1Ref.current.scrollWidth || span2Ref.current.clientWidth < span2Ref.current.scrollWidth);
});
});
resizeObserver.observe(mainRef);
return () => {
resizeObserver.disconnect();
};
}, [mainRef]);
return /* @__PURE__ */ jsxs("div", __spreadProps(__spreadValues({}, props), {
ref: setMainRef,
className: `${styles.root} ${className || ""}`,
children: [/* @__PURE__ */ jsx("span", {
ref: span1Ref,
children: content.substring(0, middle)
}), /* @__PURE__ */ jsx("span", {
ref: span2Ref,
children: content.substring(middle)
}), overflowing && /* @__PURE__ */ jsx("div", {
children: "..."
})]
}));
}
return Truncated;
});