pragmate-ui
Version:
An advanced, on-demand React UI library optimized for BeyondJS. Pragmate UI provides modular, responsive, and accessible components with a focus on efficient bundle sizes and a streamlined development process.
166 lines (158 loc) • 6.03 kB
JavaScript
System.register(["@beyond-js/kernel/bundle", "@beyond-js/kernel/styles", "react", "@beyond-js/kernel/routing", "@beyond-js/react-18-widgets/hooks", "uuid", "pragmate-ui/components"], function (_export, _context) {
"use strict";
var dependency_0, dependency_1, dependency_2, dependency_3, dependency_4, dependency_5, dependency_6, __Bundle, __pkg, ims, BreadCrumb, __beyond_pkg, hmr;
_export("BreadCrumb", void 0);
return {
setters: [function (_beyondJsKernelBundle) {
dependency_0 = _beyondJsKernelBundle;
}, function (_beyondJsKernelStyles) {
dependency_1 = _beyondJsKernelStyles;
}, function (_react2) {
dependency_2 = _react2;
}, function (_beyondJsKernelRouting) {
dependency_3 = _beyondJsKernelRouting;
}, function (_beyondJsReact18WidgetsHooks) {
dependency_4 = _beyondJsReact18WidgetsHooks;
}, function (_uuid2) {
dependency_5 = _uuid2;
}, function (_pragmateUiComponents) {
dependency_6 = _pragmateUiComponents;
}],
execute: function () {
({
Bundle: __Bundle
} = dependency_0);
__pkg = new __Bundle({
"module": {
"vspecifier": "pragmate-ui@1.0.1/breadcrumb"
},
"type": "code"
}, _context.meta.url).package();
;
__pkg.dependencies.update([['@beyond-js/kernel/styles', dependency_1], ['react', dependency_2], ['@beyond-js/kernel/routing', dependency_3], ['@beyond-js/react-18-widgets/hooks', dependency_4], ['uuid', dependency_5], ['pragmate-ui/components', dependency_6]]);
brequire('@beyond-js/kernel/styles').styles.register('pragmate-ui@1.0.1/breadcrumb');
ims = new Map();
/***********************
INTERNAL MODULE: ./index
***********************/
ims.set('./index', {
hash: 3543951005,
creator: function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.BreadCrumb = BreadCrumb;
var _react = require("react");
var _routing = require("@beyond-js/kernel/routing");
var _hooks = require("@beyond-js/react-18-widgets/hooks");
var _uuid = require("uuid");
var _item = require("./item");
/* bundle */
function BreadCrumb({
items,
separator = '/',
className,
children,
...props
}) {
const [currentRouting, setCurrentRouting] = _react.default.useState(_routing.routing.uri.pathname);
(0, _hooks.useBinder)([_routing.routing], () => setCurrentRouting(_routing.routing.uri.pathname));
const total = items.length;
const breadcrumbOutput = items.map(([label, link], index) => _react.default.createElement(_item.Item, {
key: (0, _uuid.v4)(),
total: total,
index: index,
separator: separator,
link: link,
label: label,
last: total === index + 1,
currentRouting: currentRouting
}));
let cls = `pui-breadcrumb__container${className ? ` ${className}` : ''}`;
return _react.default.createElement("div", {
className: cls,
...props
}, breadcrumbOutput.length > 0 && _react.default.createElement("ul", {
className: "pui-breadcrumb"
}, breadcrumbOutput), children && _react.default.createElement("div", null, children));
}
}
});
/**********************
INTERNAL MODULE: ./item
**********************/
ims.set('./item', {
hash: 2741562250,
creator: function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Item = Item;
var _react = require("react");
var _components = require("pragmate-ui/components");
function Item({
link,
label,
last,
currentRouting,
index,
total,
separator = '>'
}) {
const isChecked = link === currentRouting || last ? 'breadcrumb__item--current' : 'breadcrumb__item';
const isFunction = typeof link === 'function';
const attrs = {};
if (isFunction) {
attrs.onClick = link;
} else {
attrs.href = link;
}
return _react.default.createElement("li", {
key: `${link} ${label}`,
className: "pui-breadcrumb-item__container"
}, _react.default.createElement(_components.Link, {
className: isChecked,
...attrs
}, label, total > index + 1 && _react.default.createElement("span", {
className: "pui-breadcrumb__separator"
}, separator)));
}
}
});
/***********************
INTERNAL MODULE: ./types
***********************/
ims.set('./types', {
hash: 2303835339,
creator: function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
}
});
__pkg.exports.descriptor = [{
"im": "./index",
"from": "BreadCrumb",
"name": "BreadCrumb"
}];
// Module exports
__pkg.exports.process = function ({
require,
prop,
value
}) {
(require || prop === 'BreadCrumb') && _export("BreadCrumb", BreadCrumb = require ? require('./index').BreadCrumb : value);
};
_export("__beyond_pkg", __beyond_pkg = __pkg);
_export("hmr", hmr = new function () {
this.on = (event, listener) => void 0;
this.off = (event, listener) => void 0;
}());
__pkg.initialise(ims);
}
};
});
//# sourceMappingURL=breadcrumb.sjs.js.map