pallote-react 0.9.0 → 0.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.js +3 -262
- package/package.json +2 -3
package/index.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import React__default, { useState, useEffect, useRef
|
|
2
|
+
import React__default, { useState, useEffect, useRef } from 'react';
|
|
3
3
|
import classnames from 'classnames';
|
|
4
4
|
import PropTypes from 'prop-types';
|
|
5
5
|
import { createPortal } from 'react-dom';
|
|
6
|
-
import { X, CalendarBlank, Clock, CaretUpDown, ArrowSquareOut
|
|
6
|
+
import { X, CalendarBlank, Clock, CaretUpDown, ArrowSquareOut } from '@phosphor-icons/react';
|
|
7
7
|
import SyntaxHighlighter from 'react-syntax-highlighter';
|
|
8
8
|
|
|
9
9
|
const Color = ({
|
|
@@ -3275,265 +3275,6 @@ Switch.propTypes = {
|
|
|
3275
3275
|
className: PropTypes.node
|
|
3276
3276
|
};
|
|
3277
3277
|
|
|
3278
|
-
const TabsContext = /*#__PURE__*/createContext();
|
|
3279
|
-
const Tabs = ({
|
|
3280
|
-
direction,
|
|
3281
|
-
dense,
|
|
3282
|
-
hasBorder,
|
|
3283
|
-
className,
|
|
3284
|
-
children
|
|
3285
|
-
}) => {
|
|
3286
|
-
const [activeIndex, setActiveIndex] = useState(0);
|
|
3287
|
-
return /*#__PURE__*/React__default.createElement(TabsContext.Provider, {
|
|
3288
|
-
value: {
|
|
3289
|
-
activeIndex,
|
|
3290
|
-
setActiveIndex
|
|
3291
|
-
}
|
|
3292
|
-
}, /*#__PURE__*/React__default.createElement("div", {
|
|
3293
|
-
className: classnames(['tabs', {
|
|
3294
|
-
[`tabs-${direction}`]: direction,
|
|
3295
|
-
'tabs-dense': dense,
|
|
3296
|
-
'tabs-hasBorder': hasBorder
|
|
3297
|
-
}, className])
|
|
3298
|
-
}, children));
|
|
3299
|
-
};
|
|
3300
|
-
Tabs.propTypes = {
|
|
3301
|
-
direction: PropTypes.oneOf(['portrait', 'landscape']),
|
|
3302
|
-
dense: PropTypes.bool,
|
|
3303
|
-
hasBorder: PropTypes.bool,
|
|
3304
|
-
className: PropTypes.node,
|
|
3305
|
-
children: PropTypes.node.isRequired
|
|
3306
|
-
};
|
|
3307
|
-
|
|
3308
|
-
const Tab = ({
|
|
3309
|
-
index,
|
|
3310
|
-
label,
|
|
3311
|
-
className
|
|
3312
|
-
}) => {
|
|
3313
|
-
const {
|
|
3314
|
-
activeIndex,
|
|
3315
|
-
setActiveIndex
|
|
3316
|
-
} = useContext(TabsContext);
|
|
3317
|
-
const isSelected = activeIndex === index;
|
|
3318
|
-
return /*#__PURE__*/React__default.createElement("button", {
|
|
3319
|
-
className: classnames(['tab', {
|
|
3320
|
-
'tab-active': isSelected
|
|
3321
|
-
}, className]),
|
|
3322
|
-
role: "tab",
|
|
3323
|
-
"aria-selected": isSelected,
|
|
3324
|
-
"aria-controls": `tabpanel-${index}`,
|
|
3325
|
-
id: `tab-${index}`,
|
|
3326
|
-
tabIndex: isSelected ? 0 : -1,
|
|
3327
|
-
onClick: () => setActiveIndex(index)
|
|
3328
|
-
}, label);
|
|
3329
|
-
};
|
|
3330
|
-
Tab.propTypes = {
|
|
3331
|
-
label: PropTypes.string,
|
|
3332
|
-
className: PropTypes.node.isRequired
|
|
3333
|
-
};
|
|
3334
|
-
|
|
3335
|
-
const TableFooter = ({
|
|
3336
|
-
className,
|
|
3337
|
-
...props
|
|
3338
|
-
}) => {
|
|
3339
|
-
return /*#__PURE__*/React__default.createElement("div", _extends({
|
|
3340
|
-
className: classnames(['table_footer', className])
|
|
3341
|
-
}, props), /*#__PURE__*/React__default.createElement(Select, {
|
|
3342
|
-
dense: true,
|
|
3343
|
-
id: "rows",
|
|
3344
|
-
className: "table_rowSelect"
|
|
3345
|
-
}, /*#__PURE__*/React__default.createElement("option", {
|
|
3346
|
-
value: "1"
|
|
3347
|
-
}, "10"), /*#__PURE__*/React__default.createElement("option", {
|
|
3348
|
-
value: "2"
|
|
3349
|
-
}, "25"), /*#__PURE__*/React__default.createElement("option", {
|
|
3350
|
-
value: "2"
|
|
3351
|
-
}, "50"), /*#__PURE__*/React__default.createElement("option", {
|
|
3352
|
-
value: "2"
|
|
3353
|
-
}, "100"), /*#__PURE__*/React__default.createElement("option", {
|
|
3354
|
-
value: "2"
|
|
3355
|
-
}, "All")), /*#__PURE__*/React__default.createElement(Buttons, {
|
|
3356
|
-
className: "table_pagination"
|
|
3357
|
-
}, /*#__PURE__*/React__default.createElement(Button, {
|
|
3358
|
-
kind: "icon",
|
|
3359
|
-
variant: "transparent",
|
|
3360
|
-
size: "sm"
|
|
3361
|
-
}, /*#__PURE__*/React__default.createElement(CaretDoubleLeft, null)), /*#__PURE__*/React__default.createElement(Button, {
|
|
3362
|
-
kind: "icon",
|
|
3363
|
-
variant: "transparent",
|
|
3364
|
-
size: "sm"
|
|
3365
|
-
}, /*#__PURE__*/React__default.createElement(CaretLeft, null)), /*#__PURE__*/React__default.createElement(Button, {
|
|
3366
|
-
kind: "icon",
|
|
3367
|
-
size: "sm"
|
|
3368
|
-
}, "1"), /*#__PURE__*/React__default.createElement(Button, {
|
|
3369
|
-
kind: "icon",
|
|
3370
|
-
variant: "transparent",
|
|
3371
|
-
size: "sm"
|
|
3372
|
-
}, "2"), /*#__PURE__*/React__default.createElement(Button, {
|
|
3373
|
-
kind: "icon",
|
|
3374
|
-
variant: "transparent",
|
|
3375
|
-
size: "sm"
|
|
3376
|
-
}, "3"), /*#__PURE__*/React__default.createElement(Button, {
|
|
3377
|
-
kind: "icon",
|
|
3378
|
-
variant: "transparent",
|
|
3379
|
-
size: "sm"
|
|
3380
|
-
}, "\u2026"), /*#__PURE__*/React__default.createElement(Button, {
|
|
3381
|
-
kind: "icon",
|
|
3382
|
-
variant: "transparent",
|
|
3383
|
-
size: "sm"
|
|
3384
|
-
}, "8"), /*#__PURE__*/React__default.createElement(Button, {
|
|
3385
|
-
kind: "icon",
|
|
3386
|
-
variant: "transparent",
|
|
3387
|
-
size: "sm"
|
|
3388
|
-
}, /*#__PURE__*/React__default.createElement(CaretRight, null)), /*#__PURE__*/React__default.createElement(Button, {
|
|
3389
|
-
kind: "icon",
|
|
3390
|
-
variant: "transparent",
|
|
3391
|
-
size: "sm"
|
|
3392
|
-
}, /*#__PURE__*/React__default.createElement(CaretDoubleRight, null))));
|
|
3393
|
-
};
|
|
3394
|
-
TableFooter.propTypes = {
|
|
3395
|
-
className: PropTypes.node
|
|
3396
|
-
};
|
|
3397
|
-
|
|
3398
|
-
const DenseContext = /*#__PURE__*/createContext(false);
|
|
3399
|
-
const Table = ({
|
|
3400
|
-
striped,
|
|
3401
|
-
hasHover,
|
|
3402
|
-
dense,
|
|
3403
|
-
border,
|
|
3404
|
-
withFooter,
|
|
3405
|
-
className,
|
|
3406
|
-
children,
|
|
3407
|
-
...props
|
|
3408
|
-
}) => {
|
|
3409
|
-
return /*#__PURE__*/React__default.createElement(DenseContext.Provider, {
|
|
3410
|
-
value: dense
|
|
3411
|
-
}, /*#__PURE__*/React__default.createElement("div", {
|
|
3412
|
-
className: classnames(['table', {
|
|
3413
|
-
'table-striped': striped,
|
|
3414
|
-
'table-hasHover': hasHover,
|
|
3415
|
-
'table-dense': dense,
|
|
3416
|
-
'table-border': border
|
|
3417
|
-
}, className])
|
|
3418
|
-
}, /*#__PURE__*/React__default.createElement("table", _extends({
|
|
3419
|
-
cellPadding: 0,
|
|
3420
|
-
cellSpacing: 0,
|
|
3421
|
-
className: classnames('table_content')
|
|
3422
|
-
}, props), children), withFooter ? /*#__PURE__*/React__default.createElement(TableFooter, {
|
|
3423
|
-
dense: dense ? dense : null
|
|
3424
|
-
}) : null));
|
|
3425
|
-
};
|
|
3426
|
-
Table.propTypes = {
|
|
3427
|
-
striped: PropTypes.bool,
|
|
3428
|
-
hasHover: PropTypes.bool,
|
|
3429
|
-
dense: PropTypes.bool,
|
|
3430
|
-
border: PropTypes.bool,
|
|
3431
|
-
withFooter: PropTypes.bool,
|
|
3432
|
-
className: PropTypes.node,
|
|
3433
|
-
children: PropTypes.node.isRequired
|
|
3434
|
-
};
|
|
3435
|
-
|
|
3436
|
-
const TableBody = ({
|
|
3437
|
-
className,
|
|
3438
|
-
children,
|
|
3439
|
-
...props
|
|
3440
|
-
}) => {
|
|
3441
|
-
return /*#__PURE__*/React__default.createElement("tbody", _extends({
|
|
3442
|
-
className: classnames(['table_body', className])
|
|
3443
|
-
}, props), children);
|
|
3444
|
-
};
|
|
3445
|
-
TableBody.propTypes = {
|
|
3446
|
-
className: PropTypes.node,
|
|
3447
|
-
children: PropTypes.node.isRequired
|
|
3448
|
-
};
|
|
3449
|
-
|
|
3450
|
-
const TableCellComponentContext = /*#__PURE__*/createContext('td');
|
|
3451
|
-
const TableHead = ({
|
|
3452
|
-
className,
|
|
3453
|
-
children,
|
|
3454
|
-
...props
|
|
3455
|
-
}) => {
|
|
3456
|
-
return /*#__PURE__*/React__default.createElement(TableCellComponentContext.Provider, {
|
|
3457
|
-
value: "th"
|
|
3458
|
-
}, /*#__PURE__*/React__default.createElement("thead", _extends({
|
|
3459
|
-
className: classnames(['table_head', className])
|
|
3460
|
-
}, props), children));
|
|
3461
|
-
};
|
|
3462
|
-
TableHead.propTypes = {
|
|
3463
|
-
className: PropTypes.node,
|
|
3464
|
-
children: PropTypes.node.isRequired
|
|
3465
|
-
};
|
|
3466
|
-
|
|
3467
|
-
const TableCell = ({
|
|
3468
|
-
kind = 'default',
|
|
3469
|
-
className,
|
|
3470
|
-
children,
|
|
3471
|
-
...props
|
|
3472
|
-
}) => {
|
|
3473
|
-
const useTableCellComponent = () => useContext(TableCellComponentContext);
|
|
3474
|
-
const Component = useTableCellComponent();
|
|
3475
|
-
return /*#__PURE__*/React__default.createElement(Component, _extends({
|
|
3476
|
-
className: classnames(['table_cell', {
|
|
3477
|
-
[`table_cell-${kind}`]: kind
|
|
3478
|
-
}, className])
|
|
3479
|
-
}, props), children);
|
|
3480
|
-
};
|
|
3481
|
-
TableCell.propTypes = {
|
|
3482
|
-
kind: PropTypes.oneOf(['default', 'number', 'action']),
|
|
3483
|
-
className: PropTypes.node,
|
|
3484
|
-
children: PropTypes.node.isRequired
|
|
3485
|
-
};
|
|
3486
|
-
|
|
3487
|
-
const TableRow = ({
|
|
3488
|
-
className,
|
|
3489
|
-
children,
|
|
3490
|
-
...props
|
|
3491
|
-
}) => {
|
|
3492
|
-
return /*#__PURE__*/React__default.createElement("tr", _extends({
|
|
3493
|
-
className: classnames(['table_row', className])
|
|
3494
|
-
}, props), children);
|
|
3495
|
-
};
|
|
3496
|
-
TableRow.propTypes = {
|
|
3497
|
-
className: PropTypes.node,
|
|
3498
|
-
children: PropTypes.node.isRequired
|
|
3499
|
-
};
|
|
3500
|
-
|
|
3501
|
-
const TabsControl = ({
|
|
3502
|
-
className,
|
|
3503
|
-
children
|
|
3504
|
-
}) => {
|
|
3505
|
-
return /*#__PURE__*/React__default.createElement("div", {
|
|
3506
|
-
role: "tablist",
|
|
3507
|
-
className: classnames(['tabs_controls', className])
|
|
3508
|
-
}, children);
|
|
3509
|
-
};
|
|
3510
|
-
TabsControl.propTypes = {
|
|
3511
|
-
className: PropTypes.node,
|
|
3512
|
-
children: PropTypes.node.isRequired
|
|
3513
|
-
};
|
|
3514
|
-
|
|
3515
|
-
const TabsPanel = ({
|
|
3516
|
-
index,
|
|
3517
|
-
className,
|
|
3518
|
-
children
|
|
3519
|
-
}) => {
|
|
3520
|
-
const {
|
|
3521
|
-
activeIndex
|
|
3522
|
-
} = useContext(TabsContext);
|
|
3523
|
-
const isActive = activeIndex === index;
|
|
3524
|
-
return isActive ? /*#__PURE__*/React__default.createElement("div", {
|
|
3525
|
-
className: classnames(['tabs_panel', className]),
|
|
3526
|
-
role: "tabpanel",
|
|
3527
|
-
id: `tabpanel-${index}`,
|
|
3528
|
-
"aria-labelledby": `tab-${index}`,
|
|
3529
|
-
hidden: !isActive
|
|
3530
|
-
}, children) : null;
|
|
3531
|
-
};
|
|
3532
|
-
TabsPanel.propTypes = {
|
|
3533
|
-
className: PropTypes.node,
|
|
3534
|
-
children: PropTypes.node.isRequired
|
|
3535
|
-
};
|
|
3536
|
-
|
|
3537
3278
|
const Tag = ({
|
|
3538
3279
|
color = 'primary',
|
|
3539
3280
|
dense,
|
|
@@ -3612,4 +3353,4 @@ Textarea.propTypes = {
|
|
|
3612
3353
|
className: PropTypes.node
|
|
3613
3354
|
};
|
|
3614
3355
|
|
|
3615
|
-
export { Alert, Breadcrumbs, Button, Buttons, Card, CardActions, CardContent, CardHeader, CardMedia, Checkbox, Checkboxes, Color, Display, Divider, Grid, Input, InputLabel, Link$1 as Link, List, ListItem, Nav, NavBar, NavItem, Radio, RadioButtons, Section, SectionContent, SectionHeader, Select, Snippet, Status, Switch,
|
|
3356
|
+
export { Alert, Breadcrumbs, Button, Buttons, Card, CardActions, CardContent, CardHeader, CardMedia, Checkbox, Checkboxes, Color, Display, Divider, Grid, Input, InputLabel, Link$1 as Link, List, ListItem, Nav, NavBar, NavItem, Radio, RadioButtons, Section, SectionContent, SectionHeader, Select, Snippet, Status, Switch, Tag, Text, Textarea };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "pallote-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.11.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"styles": "dist/index.css",
|
|
@@ -15,8 +15,7 @@
|
|
|
15
15
|
"license": "ISC",
|
|
16
16
|
"peerDependencies": {
|
|
17
17
|
"react": "^18.0.0 || ^19.0.0",
|
|
18
|
-
"react-dom": "^18.0.0 || ^19.0.0"
|
|
19
|
-
"pallote-css": "^0.8.0"
|
|
18
|
+
"react-dom": "^18.0.0 || ^19.0.0"
|
|
20
19
|
},
|
|
21
20
|
"dependencies": {
|
|
22
21
|
"@babel/preset-react": "^7.26.3",
|