@fibery/ui-kit 1.17.1 → 1.19.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.
Files changed (121) hide show
  1. package/index.ts +1 -1
  2. package/package.json +29 -23
  3. package/src/antd/styles.ts +1 -1
  4. package/src/back-button.tsx +3 -0
  5. package/src/{Button → button}/actions-button.tsx +2 -2
  6. package/src/{Button → button}/button-base.tsx +2 -2
  7. package/src/{Button → button}/button-group.tsx +1 -1
  8. package/src/{Button → button}/button.tsx +3 -3
  9. package/src/{Button → button}/icon-button.tsx +1 -0
  10. package/src/button.tsx +3 -0
  11. package/src/create-inline-theme.ts +2 -0
  12. package/src/design-system.ts +1009 -0
  13. package/src/emoji-picker/app-icon-picker.tsx +2 -2
  14. package/src/emoji-picker/emoji-picker-content-with-color.tsx +7 -7
  15. package/src/emoji-picker/emoji-picker.tsx +11 -5
  16. package/src/emoji-picker/icon-emoji-picker.tsx +2 -2
  17. package/src/emoji-picker/primitives/category.tsx +2 -2
  18. package/src/emoji-picker/primitives/content.tsx +3 -2
  19. package/src/emoji-picker/primitives/emoji.tsx +1 -1
  20. package/src/emoji-picker/primitives/footer.tsx +1 -1
  21. package/src/emoji-picker/primitives/header.tsx +1 -1
  22. package/src/emoji-picker/primitives/layout.ts +1 -1
  23. package/src/emoji-picker/primitives/search.tsx +2 -2
  24. package/src/emoji-picker/primitives/skin-tone.tsx +2 -2
  25. package/src/emoji-picker/stores/lazy-emoji-data-store.tsx +3 -3
  26. package/src/emoji-picker/stores/lazy-icon-data-store.tsx +1 -1
  27. package/src/error-alert.tsx +3 -3
  28. package/src/form-field-loader.tsx +1 -1
  29. package/src/icons/Icon.tsx +5 -5
  30. package/src/icons/ast/Activity.ts +1 -1
  31. package/src/icons/ast/BellFilled.ts +8 -0
  32. package/src/icons/ast/BellOff.ts +8 -0
  33. package/src/icons/ast/BellRinging.ts +8 -0
  34. package/src/icons/ast/Clock.ts +8 -0
  35. package/src/icons/ast/ClockAlarm.ts +8 -0
  36. package/src/icons/ast/Copy.ts +1 -1
  37. package/src/icons/ast/Export.ts +8 -0
  38. package/src/icons/ast/ExtensionComments.ts +1 -1
  39. package/src/icons/ast/Favorites.ts +1 -1
  40. package/src/icons/ast/FavoritesChecked.ts +1 -1
  41. package/src/icons/ast/FavoritesOff.ts +8 -0
  42. package/src/icons/ast/GlobeSimple.ts +8 -0
  43. package/src/icons/ast/Import.ts +8 -0
  44. package/src/icons/ast/Lab.ts +8 -0
  45. package/src/icons/ast/Link.ts +8 -0
  46. package/src/icons/ast/Monitor.ts +8 -0
  47. package/src/icons/ast/Network.ts +8 -0
  48. package/src/icons/ast/Pencil.ts +8 -0
  49. package/src/icons/ast/People.ts +8 -0
  50. package/src/icons/ast/RicheditorCommentCreate.ts +1 -1
  51. package/src/icons/ast/RicheditorLinkCreate.ts +1 -1
  52. package/src/icons/ast/RicheditorOpenLink.ts +1 -1
  53. package/src/icons/ast/RicheditorUnlink.ts +1 -1
  54. package/src/icons/ast/ShieldKeyhole.ts +8 -0
  55. package/src/icons/ast/Success.ts +8 -0
  56. package/src/icons/ast/Terminal.ts +8 -0
  57. package/src/icons/ast/TypeUrl.ts +1 -1
  58. package/src/icons/ast/WarningTriangle.ts +8 -0
  59. package/src/icons/ast/index.tsx +19 -4
  60. package/src/icons/{getIconContainerStyle.tsx → get-icon-container-style.tsx} +1 -1
  61. package/src/icons/react/BellFilled.tsx +12 -0
  62. package/src/icons/react/BellOff.tsx +12 -0
  63. package/src/icons/react/BellRinging.tsx +12 -0
  64. package/src/icons/react/Clock.tsx +12 -0
  65. package/src/icons/react/ClockAlarm.tsx +12 -0
  66. package/src/icons/react/Export.tsx +12 -0
  67. package/src/icons/react/FavoritesOff.tsx +12 -0
  68. package/src/icons/react/GlobeSimple.tsx +12 -0
  69. package/src/icons/react/Import.tsx +12 -0
  70. package/src/icons/react/Lab.tsx +12 -0
  71. package/src/icons/react/Link.tsx +12 -0
  72. package/src/icons/react/Monitor.tsx +12 -0
  73. package/src/icons/react/Network.tsx +12 -0
  74. package/src/icons/react/Pencil.tsx +12 -0
  75. package/src/icons/react/People.tsx +12 -0
  76. package/src/icons/react/ShieldKeyhole.tsx +12 -0
  77. package/src/icons/react/Success.tsx +12 -0
  78. package/src/icons/react/Terminal.tsx +12 -0
  79. package/src/icons/react/WarningTriangle.tsx +12 -0
  80. package/src/icons/react/index.tsx +19 -4
  81. package/src/{Item.tsx → item.tsx} +1 -1
  82. package/src/loaders.tsx +19 -6
  83. package/src/loading-sausage.tsx +3 -1
  84. package/src/select/custom-select-partials/clear-indicator.tsx +22 -0
  85. package/src/select/custom-select-partials/drop-down-indicator.tsx +26 -0
  86. package/src/select/custom-select-partials/group-heading.tsx +54 -0
  87. package/src/select/custom-select-partials/menu.tsx +25 -0
  88. package/src/select/custom-select-partials/no-option-message.tsx +10 -0
  89. package/src/select/custom-select-partials/option.tsx +65 -0
  90. package/src/{Select → select}/index.tsx +54 -48
  91. package/src/{Select → select}/select-in-popover.tsx +5 -5
  92. package/src/{Select → select}/styles.ts +9 -53
  93. package/src/{ThemeProvider.tsx → theme-provider.tsx} +11 -1
  94. package/src/theme-styles.ts +2 -5
  95. package/src/toast/primitives.tsx +145 -0
  96. package/src/toast/toast-action.tsx +20 -0
  97. package/src/toast/toast-queue.tsx +121 -0
  98. package/src/toast/toast.tsx +114 -0
  99. package/src/toast/toaster.tsx +72 -0
  100. package/src/tooltip.tsx +3 -3
  101. package/src/BackButton.tsx +0 -3
  102. package/src/Button.tsx +0 -3
  103. package/src/Select/components.tsx +0 -90
  104. package/src/designSystem.ts +0 -951
  105. package/src/icons/ast/AppTemplatesOneColor.ts +0 -8
  106. package/src/icons/ast/CopyUrl.ts +0 -8
  107. package/src/icons/ast/FavoritesMenu.ts +0 -8
  108. package/src/icons/ast/Markdown.ts +0 -8
  109. package/src/icons/react/AppTemplatesOneColor.tsx +0 -12
  110. package/src/icons/react/CopyUrl.tsx +0 -12
  111. package/src/icons/react/FavoritesMenu.tsx +0 -12
  112. package/src/icons/react/Markdown.tsx +0 -12
  113. /package/src/{Button → button}/actions-button-compact.tsx +0 -0
  114. /package/src/{Button/AddButton.tsx → button/add-button.tsx} +0 -0
  115. /package/src/{Button/BackButton.tsx → button/back-button.tsx} +0 -0
  116. /package/src/icons/{generateIconFromAst.ts → generate-icon-from-ast.ts} +0 -0
  117. /package/src/icons/{IconAsPaths.ts → get-paths.ts} +0 -0
  118. /package/src/icons/{getShiftStyle.ts → get-shift-style.ts} +0 -0
  119. /package/src/{Pallete.ts → pallete.ts} +0 -0
  120. /package/src/{Select → select}/select-control-settings-context.tsx +0 -0
  121. /package/src/{Select → select}/select-loader.tsx +0 -0
package/index.ts CHANGED
@@ -1 +1 @@
1
- export * from "./src/designSystem";
1
+ export * from "./src/design-system";
package/package.json CHANGED
@@ -1,40 +1,45 @@
1
1
  {
2
2
  "name": "@fibery/ui-kit",
3
- "version": "1.17.1",
3
+ "version": "1.19.0",
4
4
  "main": "index.ts",
5
5
  "private": false,
6
6
  "files": [
7
7
  "src/antd/styles.ts",
8
- "src/Button.tsx",
9
- "src/designSystem.ts",
8
+ "src/button.tsx",
9
+ "src/design-system.ts",
10
10
  "src/theme-styles.ts",
11
11
  "src/theme-settings.ts",
12
12
  "src/media-query-utils.ts",
13
13
  "src/create-inline-theme.ts",
14
14
  "src/form-field-loader.tsx",
15
- "src/ThemeProvider.tsx",
16
- "src/Item.tsx",
15
+ "src/theme-provider.tsx",
16
+ "src/item.tsx",
17
17
  "src/loaders.tsx",
18
18
  "src/loading-sausage.tsx",
19
19
  "src/icons/**/*.ts*",
20
- "src/Select",
20
+ "src/select",
21
21
  "src/error-alert.tsx",
22
- "src/Pallete.ts",
22
+ "src/pallete.ts",
23
23
  "src/tooltip.tsx",
24
- "src/BackButton.tsx",
25
- "src/Button",
24
+ "src/back-button.tsx",
25
+ "src/button",
26
26
  "src/emoji-picker/**/*.ts*",
27
+ "src/toast/**/*.ts*",
27
28
  "src/a11y-color.ts"
28
29
  ],
29
30
  "license": "UNLICENSED",
30
31
  "dependencies": {
31
- "@linaria/core": "3.0.0-beta.15",
32
- "@linaria/react": "3.0.0-beta.15",
32
+ "@linaria/core": "5.0.1",
33
+ "@linaria/react": "5.0.1",
33
34
  "@popperjs/core": "2.11.6",
34
- "@radix-ui/react-collapsible": "1.0.1",
35
- "@radix-ui/react-context-menu": "2.1.1",
36
- "@radix-ui/react-dropdown-menu": "2.0.3-rc.7",
37
- "@radix-ui/react-tooltip": "1.0.3",
35
+ "@radix-ui/react-collapsible": "1.0.3",
36
+ "@radix-ui/react-context-menu": "2.1.5",
37
+ "@radix-ui/react-dropdown-menu": "2.0.6",
38
+ "@radix-ui/react-toast": "1.1.5",
39
+ "@radix-ui/react-tooltip": "1.0.7",
40
+ "@types/d3-shape": "^3.1.3",
41
+ "@types/react-select-country-list": "^2.2.1",
42
+ "@types/setimmediate": "^1.0.2",
38
43
  "@types/ua-parser-js": "0.7.36",
39
44
  "antd": "4.24.7",
40
45
  "chroma-js": "2.1.2",
@@ -61,9 +66,9 @@
61
66
  "react-windowed-select": "5.0.0",
62
67
  "screenfull": "6.0.1",
63
68
  "ua-parser-js": "0.7.24",
64
- "@fibery/emoji-data": "2.1.1",
65
- "@fibery/helpers": "1.1.0",
66
- "@fibery/react": "1.0.3"
69
+ "@fibery/emoji-data": "2.2.1",
70
+ "@fibery/helpers": "1.2.0",
71
+ "@fibery/react": "1.2.0"
67
72
  },
68
73
  "peerDependencies": {
69
74
  "react": "^18.2.0",
@@ -72,7 +77,7 @@
72
77
  "devDependencies": {
73
78
  "@babel/core": "7.20.5",
74
79
  "@babel/runtime": "7.20.6",
75
- "@linaria/babel-preset": "3.0.0-beta.15",
80
+ "@linaria/babel-preset": "5.0.3",
76
81
  "@testing-library/dom": "8.19.1",
77
82
  "@testing-library/jest-dom": "5.16.5",
78
83
  "@testing-library/react": "13.4.0",
@@ -80,6 +85,7 @@
80
85
  "@types/chroma-js": "2.1.3",
81
86
  "@types/color-hash": "1.0.2",
82
87
  "@types/invariant": "2.2.34",
88
+ "@types/jest": "27.0.1",
83
89
  "@types/lodash": "4.14.172",
84
90
  "@types/prop-types": "15.7.5",
85
91
  "@types/react": "18.0.26",
@@ -95,8 +101,8 @@
95
101
  "svgo": "2.8.0",
96
102
  "typescript": "5.1.6",
97
103
  "unist-util-reduce": "0.2.2",
98
- "@fibery/babel-preset": "7.2.0",
99
- "@fibery/eslint-config": "8.3.0"
104
+ "@fibery/eslint-config": "8.4.0",
105
+ "@fibery/babel-preset": "7.3.0"
100
106
  },
101
107
  "jest": {
102
108
  "testEnvironment": "jsdom",
@@ -124,8 +130,8 @@
124
130
  },
125
131
  "scripts": {
126
132
  "test": "TZ=Europe/Minsk jest",
127
- "test:ci": "yarn test --reporters=default --reporters=jest-junit",
128
- "test:coverage": "yarn test --coverage --coverageDirectory=${JEST_COVERAGE_RESULT_DIR:-$(pwd)}/coverage/ui-kit --reporters=default --reporters=jest-junit",
133
+ "test:ci": "pnpm run test --reporters=default --reporters=jest-junit",
134
+ "test:coverage": "pnpm run test --coverage --coverageDirectory=${JEST_COVERAGE_RESULT_DIR:-$(pwd)}/coverage/ui-kit --reporters=default --reporters=jest-junit",
129
135
  "lint": "eslint .",
130
136
  "generate-icons": "node scripts/generate-icons.mjs"
131
137
  }
@@ -1,5 +1,5 @@
1
1
  import {css} from "@linaria/core";
2
- import {colors, layout, border, shadows, space, textStyles, themeVars, transition} from "../designSystem";
2
+ import {colors, layout, border, shadows, space, textStyles, themeVars, transition} from "../design-system";
3
3
 
4
4
  const inputVariables = {
5
5
  default: {
@@ -0,0 +1,3 @@
1
+ import {BackButton} from "./button/back-button";
2
+
3
+ export {BackButton};
@@ -2,7 +2,7 @@ import {IconButton, IconButtonProps} from "./icon-button";
2
2
  import MoreCompact from "../icons/react/MoreCompact";
3
3
  import {forwardRef} from "react";
4
4
  import {css} from "@linaria/core";
5
- import {border, themeVars} from "../designSystem";
5
+ import {border, themeVars} from "../design-system";
6
6
 
7
7
  export const ActionsButton = forwardRef<HTMLButtonElement, IconButtonProps>(function ActionsButtonComponent(
8
8
  {...rest},
@@ -19,7 +19,7 @@ export const ActionsButton = forwardRef<HTMLButtonElement, IconButtonProps>(func
19
19
  export const actionButtonInlineStyle = css`
20
20
  background-color: ${themeVars.actionMenuButtonColor};
21
21
  box-shadow: ${themeVars.entityCardShadow};
22
- border-radius: ${border.radius6};
22
+ border-radius: ${border.radius6}px;
23
23
 
24
24
  .Button:hover {
25
25
  background-color: ${themeVars.actionMenuButtonHoverColor} !important;
@@ -1,7 +1,7 @@
1
1
  import {styled} from "@linaria/react";
2
2
  import {ComponentPropsWithoutRef, forwardRef} from "react";
3
- import {border, colors, fontWeight, getDarkenColor, getOpacities, opacity, ThemeColors} from "../designSystem";
4
- import {useTheme} from "../ThemeProvider";
3
+ import {border, colors, fontWeight, getDarkenColor, getOpacities, opacity, ThemeColors} from "../design-system";
4
+ import {useTheme} from "../theme-provider";
5
5
 
6
6
  export const getMainColor = ({color, dangerous, theme}: {color?: string; dangerous?: boolean; theme: ThemeColors}) => {
7
7
  if (color) {
@@ -1,6 +1,6 @@
1
1
  import {Children, cloneElement, CSSProperties, ReactElement} from "react";
2
2
  import {css, cx} from "@linaria/core";
3
- import {border} from "../designSystem";
3
+ import {border} from "../design-system";
4
4
 
5
5
  const ordersInRowGroup = {
6
6
  first: css`
@@ -4,9 +4,9 @@ import {styled} from "@linaria/react";
4
4
  import cx from "classnames";
5
5
  import _ from "lodash";
6
6
  import React, {forwardRef} from "react";
7
- import {Item} from "../Item";
8
- import {useTheme} from "../ThemeProvider";
9
- import {border, colors, getOpacities, opacity, space, textStyles} from "../designSystem";
7
+ import {Item} from "../item";
8
+ import {useTheme} from "../theme-provider";
9
+ import {border, colors, getOpacities, opacity, space, textStyles} from "../design-system";
10
10
  import {IconBaseProps} from "../icons/types";
11
11
  import {Spinner} from "../loaders";
12
12
  import {ButtonBase, ButtonBaseProps, buttonBorderWidth, getMainColor, getTextColor} from "./button-base";
@@ -7,6 +7,7 @@ export type IconButtonSize = "super-small" | "small" | "normal" | "big";
7
7
 
8
8
  export type IconButtonProps = Omit<ButtonBaseProps, "borderless"> & {
9
9
  size?: IconButtonSize;
10
+ classNameOverride?: string;
10
11
  };
11
12
 
12
13
  const Paddings = {
package/src/button.tsx ADDED
@@ -0,0 +1,3 @@
1
+ import {Button} from "./button/button";
2
+
3
+ export {Button};
@@ -1,3 +1,5 @@
1
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
2
+ // @ts-ignore
1
3
  export const varPrefix = process.env.VAR_THEME_PREFIX || "fibery";
2
4
 
3
5
  export function createInlineTheme<T extends Record<string, unknown>>(