@prosperitainova/dumbo-react-native
Version:
Dumbo for React Native Library
100 lines (98 loc) • 2.89 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.List = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _Text = require("../Text");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/** Props for List component */
/**
* List component for rendering an ordered or unordered list
*
* {@link https://github.com/carbon-design-system/carbon-react-native/blob/main/example/src/Views/List.tsx | Example code}
*/
class List extends _react.default.Component {
letters = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
get styles() {
return _reactNative.StyleSheet.create({
itemWrapper: {
flexDirection: 'row',
paddingBottom: 4
},
indicator: {
marginRight: 10
},
content: {
flex: 1
}
});
}
getIndicator(index) {
const {
type,
nested
} = this.props;
if (type === 'ordered') {
if (nested) {
let value = this.letters[index % 26] || '?';
if (index >= 26) {
const subIndex = Math.floor(index / 26) - 1;
const subValue = this.letters[subIndex % 26] || '?';
value = subValue + value;
}
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
text: value + '.'
});
} else {
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
text: String(index + 1) + '.'
});
}
} else {
if (nested) {
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
text: '\uFFED'
});
} else {
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
text: '\u2014'
});
}
}
}
getListItem(item, index) {
const {
textType
} = this.props;
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
style: this.styles.itemWrapper,
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
style: this.styles.indicator,
children: this.getIndicator(index)
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
style: this.styles.content,
children: typeof item === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
type: textType,
text: item
}) : item
})]
}, index);
}
render() {
const {
items,
componentProps,
style
} = this.props;
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
style: style,
...(componentProps || {}),
children: items.map((item, index) => this.getListItem(item, index))
});
}
}
exports.List = List;
//# sourceMappingURL=index.js.map