@uni-design-system/uni-angular 8.3.1 → 8.4.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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uni-design-system/uni-angular",
3
- "version": "8.3.1",
3
+ "version": "8.4.0",
4
4
  "license": "MIT",
5
5
  "repository": {
6
6
  "type": "git",
@@ -22,7 +22,7 @@
22
22
  "@angular/core": "^21.2.0",
23
23
  "@angular/forms": "^21.2.0",
24
24
  "@emotion/css": "^11.0.0",
25
- "@uni-design-system/uni-core": "^8.3.1"
25
+ "@uni-design-system/uni-core": "^8.4.0"
26
26
  },
27
27
  "module": "fesm2022/uni-design-system-uni-angular.mjs",
28
28
  "typings": "types/uni-design-system-uni-angular.d.ts",
@@ -837,6 +837,43 @@ var BaseThicknesses = {
837
837
  standard: 2,
838
838
  thick: 4
839
839
  };
840
+ /**
841
+ * Shared motion timing, named by what moves rather than by how fast:
842
+ * a small panel attached to a control snaps (`popup`), a larger free-floating
843
+ * surface settles (`panel`), content growing in place eases at both ends
844
+ * (`reveal`), a transient message arrives and leaves under its own steam
845
+ * (`notification`), and a control answering a pointer should feel immediate
846
+ * (`control`).
847
+ *
848
+ * Fast and linear is deliberate for `popup`. It is the timing every
849
+ * trigger-anchored panel in the library uses — dropdown, menu, multi-select
850
+ * and the combobox-style listboxes — so a form full of them opens uniformly;
851
+ * at 100ms an easing curve is imperceptible anyway, and linear avoids the
852
+ * lag a slow-in curve adds to something the user is waiting on.
853
+ */
854
+ var BaseMotion = {
855
+ popup: {
856
+ duration: 100,
857
+ easing: "linear",
858
+ scale: .8
859
+ },
860
+ panel: {
861
+ duration: 250,
862
+ easing: "ease"
863
+ },
864
+ reveal: {
865
+ duration: 350,
866
+ easing: "ease-in-out"
867
+ },
868
+ notification: {
869
+ duration: 350,
870
+ easing: "ease-in-out"
871
+ },
872
+ control: {
873
+ duration: 300,
874
+ easing: "ease"
875
+ }
876
+ };
840
877
  var BaseRadii = {
841
878
  none: "none",
842
879
  xxs: "4px",
@@ -880,7 +917,7 @@ var buildComponents = (c) => ({
880
917
  alert: { options: {
881
918
  topPosition: 40,
882
919
  borderRadius: "sm",
883
- transitionSpeed: .35,
920
+ motion: "notification",
884
921
  elevation: "md"
885
922
  } },
886
923
  breadcrumb: { options: {
@@ -986,7 +1023,7 @@ var buildComponents = (c) => ({
986
1023
  size: 20,
987
1024
  ringColor: "outline",
988
1025
  fillColor: "surface",
989
- transitionSpeed: .3
1026
+ motion: "control"
990
1027
  } },
991
1028
  dialog: { options: {
992
1029
  borderRadius: "lg",
@@ -1023,7 +1060,8 @@ var buildComponents = (c) => ({
1023
1060
  border: "none",
1024
1061
  borderRadius: "xxs",
1025
1062
  color: "primary-surface",
1026
- shadow: "menu"
1063
+ shadow: "menu",
1064
+ motion: "popup"
1027
1065
  } },
1028
1066
  menu: { options: {
1029
1067
  minWidth: 184,
@@ -1046,7 +1084,7 @@ var buildComponents = (c) => ({
1046
1084
  textColor: void 0,
1047
1085
  hoverColor: "primary-container",
1048
1086
  activeSymbol: "check",
1049
- transitionSpeed: .35
1087
+ motion: "control"
1050
1088
  },
1051
1089
  variants: { warn: {
1052
1090
  color: c.warn,
@@ -1070,9 +1108,10 @@ var buildComponents = (c) => ({
1070
1108
  headerTypeface: "title-small",
1071
1109
  tooltipPadding: "4px 8px",
1072
1110
  tooltipOpenDelay: 500,
1073
- tooltipCloseDelay: 150
1111
+ tooltipCloseDelay: 150,
1112
+ motion: "panel"
1074
1113
  } },
1075
- expand: { options: { transitionSpeed: .35 } },
1114
+ expand: { options: { motion: "reveal" } },
1076
1115
  footer: { options: {
1077
1116
  height: 52,
1078
1117
  color: "primary",
@@ -1533,11 +1572,13 @@ var buildComponents = (c) => ({
1533
1572
  borderRadius: "xs",
1534
1573
  animation: "shimmer",
1535
1574
  duration: 1.4,
1575
+ direction: "ltr",
1576
+ highlightWidth: 40,
1536
1577
  gap: "sm"
1537
1578
  } },
1538
1579
  snackbar: { options: {
1539
1580
  bottomPosition: 40,
1540
- transitionDelay: "0.35s",
1581
+ motion: "notification",
1541
1582
  autoCloseDelay: 35e3
1542
1583
  } },
1543
1584
  symbol: { options: {
@@ -1573,7 +1614,7 @@ var buildComponents = (c) => ({
1573
1614
  spotlightPadding: 6,
1574
1615
  spotlightRadius: "xs",
1575
1616
  ringWidth: 2,
1576
- transitionMs: 250
1617
+ motion: "panel"
1577
1618
  } },
1578
1619
  tour: { options: {
1579
1620
  progressStyle: "dots",
@@ -1587,7 +1628,7 @@ var deepMerge = (base, override) => {
1587
1628
  for (const [key, value] of Object.entries(override)) out[key] = isRecord$1(value) && isRecord$1(out[key]) ? deepMerge(out[key], value) : value;
1588
1629
  return out;
1589
1630
  };
1590
- var createTheme = ({ id, name, colors, icons = {}, radii = BaseRadii, shadows = BaseShadows, typography, borders, thicknesses, components }) => ({
1631
+ var createTheme = ({ id, name, colors, icons = {}, radii = BaseRadii, shadows = BaseShadows, motion, typography, borders, thicknesses, components }) => ({
1591
1632
  id,
1592
1633
  name,
1593
1634
  colors,
@@ -1596,6 +1637,10 @@ var createTheme = ({ id, name, colors, icons = {}, radii = BaseRadii, shadows =
1596
1637
  radii,
1597
1638
  shadows,
1598
1639
  spacing: BaseSpacing,
1640
+ motion: {
1641
+ ...BaseMotion,
1642
+ ...motion
1643
+ },
1599
1644
  thicknesses: {
1600
1645
  ...BaseThicknesses,
1601
1646
  ...thicknesses
@@ -1975,7 +2020,7 @@ var UniThemes = {
1975
2020
  Object.keys(UniThemes)[0];
1976
2021
  //#endregion
1977
2022
  //#region package.json
1978
- var version = "8.3.1";
2023
+ var version = "8.4.0";
1979
2024
  //#endregion
1980
2025
  //#region schematics-src/ng-add/transforms.ts
1981
2026
  var addDependencies = (packageJsonText, deps) => {