@digilogiclabs/saas-factory-ui 2.8.0 → 2.8.2

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.
@@ -5148,7 +5148,10 @@ declare function TiltCard({ accent, accentSecondary, topLabel, icon, title, subt
5148
5148
  * Features:
5149
5149
  * - 1 to 6 dice; d6 renders as a full 3D cube (six faces, CSS
5150
5150
  * transforms, standard layout — opposite faces sum to 7); d4/d8/
5151
- * d10/d12/d20 render as themed polyhedron silhouettes with numerals
5151
+ * d10/d12/d20 render as extruded 3D polyhedron slabs (numeral
5152
+ * front + shaded back + stacked edge layers for real thickness)
5153
+ * that tumble on every axis with the same chaos-snap-then-settle
5154
+ * motion as the cube
5152
5155
  * - Displayed face is structurally guaranteed to match the recorded
5153
5156
  * value: the d6 landing rotation is DERIVED as the inverse of the
5154
5157
  * face placement (one source of truth), and non-cube dice render
@@ -6462,7 +6465,10 @@ interface ScoreboardProps {
6462
6465
  onBeforeNewGame?: () => boolean;
6463
6466
  /** Max characters accepted in a team-name input. Unlimited by default. */
6464
6467
  nameMaxLength?: number;
6465
- /** Lower clamp for scores driven by the +/− buttons. Default −9999. */
6468
+ /** Lower clamp for scores driven by the +/− buttons. Default −9999.
6469
+ * Seeded/resumed scores are NOT rewritten at init — an out-of-range
6470
+ * restored score renders as-is and snaps into range on the first
6471
+ * button press. Changing the bounds does not reset current scores. */
6466
6472
  scoreMin?: number;
6467
6473
  /** Upper clamp for scores driven by the +/− buttons. Default 9999. */
6468
6474
  scoreMax?: number;
@@ -5148,7 +5148,10 @@ declare function TiltCard({ accent, accentSecondary, topLabel, icon, title, subt
5148
5148
  * Features:
5149
5149
  * - 1 to 6 dice; d6 renders as a full 3D cube (six faces, CSS
5150
5150
  * transforms, standard layout — opposite faces sum to 7); d4/d8/
5151
- * d10/d12/d20 render as themed polyhedron silhouettes with numerals
5151
+ * d10/d12/d20 render as extruded 3D polyhedron slabs (numeral
5152
+ * front + shaded back + stacked edge layers for real thickness)
5153
+ * that tumble on every axis with the same chaos-snap-then-settle
5154
+ * motion as the cube
5152
5155
  * - Displayed face is structurally guaranteed to match the recorded
5153
5156
  * value: the d6 landing rotation is DERIVED as the inverse of the
5154
5157
  * face placement (one source of truth), and non-cube dice render
@@ -6462,7 +6465,10 @@ interface ScoreboardProps {
6462
6465
  onBeforeNewGame?: () => boolean;
6463
6466
  /** Max characters accepted in a team-name input. Unlimited by default. */
6464
6467
  nameMaxLength?: number;
6465
- /** Lower clamp for scores driven by the +/− buttons. Default −9999. */
6468
+ /** Lower clamp for scores driven by the +/− buttons. Default −9999.
6469
+ * Seeded/resumed scores are NOT rewritten at init — an out-of-range
6470
+ * restored score renders as-is and snaps into range on the first
6471
+ * button press. Changing the bounds does not reset current scores. */
6466
6472
  scoreMin?: number;
6467
6473
  /** Upper clamp for scores driven by the +/− buttons. Default 9999. */
6468
6474
  scoreMax?: number;
package/dist/web/index.js CHANGED
@@ -30754,17 +30754,13 @@ function DiceRoller({
30754
30754
  const starts = currentPositionsRef.current ?? defaultPositions(w, h, clampedCount);
30755
30755
  const frames = simulateDice(w, h, effectiveSize, starts, clampedCount);
30756
30756
  for (let i = 0; i < clampedCount; i++) {
30757
- if (sides === 6) {
30758
- writeCubeRotation(
30759
- i,
30760
- (Math.random() - 0.5) * 720,
30761
- (Math.random() - 0.5) * 720,
30762
- (Math.random() - 0.5) * 720,
30763
- false
30764
- );
30765
- } else {
30766
- writeCubeRotation(i, 0, 0, (Math.random() - 0.5) * 720, false);
30767
- }
30757
+ writeCubeRotation(
30758
+ i,
30759
+ (Math.random() - 0.5) * 720,
30760
+ (Math.random() - 0.5) * 720,
30761
+ (Math.random() - 0.5) * 720,
30762
+ false
30763
+ );
30768
30764
  const el = dieWrapperRefs.current[i];
30769
30765
  if (el) el.style.transition = "none";
30770
30766
  const shadow = shadowRefs.current[i];
@@ -30825,8 +30821,10 @@ function DiceRoller({
30825
30821
  const lz = (Math.random() > 0.5 ? 1 : -1) * 360;
30826
30822
  writeCubeRotation(i, lx, ly, lz, true, tilt);
30827
30823
  } else {
30824
+ const lx = (Math.random() > 0.5 ? 1 : -1) * 720;
30825
+ const ly = (Math.random() > 0.5 ? 1 : -1) * 360;
30828
30826
  const lz = (Math.random() > 0.5 ? 1 : -1) * 720 + tilt;
30829
- writeCubeRotation(i, 0, 0, lz, true);
30827
+ writeCubeRotation(i, lx, ly, lz, true);
30830
30828
  }
30831
30829
  }
30832
30830
  });
@@ -30985,60 +30983,157 @@ function DiceRoller({
30985
30983
  )) : (() => {
30986
30984
  const shape = POLY_SHAPES[sides];
30987
30985
  const shown = results?.[d] ?? sides;
30988
- return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(
30989
- "svg",
30990
- {
30991
- viewBox: "0 0 100 100",
30992
- width: "100%",
30993
- height: "100%",
30994
- style: { display: "block", overflow: "visible" },
30995
- "aria-hidden": "true",
30996
- children: [
30997
- /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
30998
- "polygon",
30999
- {
31000
- points: shape.points,
31001
- fill: colors.face,
31002
- stroke: colors.faceBorder,
31003
- strokeWidth: 2.5,
31004
- strokeLinejoin: "round",
31005
- style: { transition: "fill 0.3s, stroke 0.3s" }
31006
- }
31007
- ),
31008
- /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
31009
- "polygon",
31010
- {
31011
- points: shape.points,
31012
- fill: "none",
31013
- stroke: colors.faceBorder,
31014
- strokeWidth: 1.5,
31015
- strokeLinejoin: "round",
31016
- opacity: 0.55,
31017
- transform: "translate(50 50) scale(0.76) translate(-50 -50)"
31018
- }
31019
- ),
31020
- /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
31021
- "text",
31022
- {
31023
- ref: getNumeralSetter(d),
31024
- x: 50,
31025
- y: shape.textY,
31026
- textAnchor: "middle",
31027
- dominantBaseline: "central",
31028
- fontSize: 100 * shape.fontScale,
31029
- fontWeight: 800,
31030
- fill: colors.pip,
31031
- style: {
31032
- fontVariantNumeric: "tabular-nums",
31033
- transition: "fill 0.3s",
31034
- userSelect: "none"
31035
- },
31036
- children: formatDieValue(shown, sides)
31037
- }
31038
- )
31039
- ]
31040
- }
31041
- );
30986
+ const depth = effectiveSize * 0.18;
30987
+ const edgeLayers = 16;
30988
+ const cardFaceStyle = {
30989
+ position: "absolute",
30990
+ inset: 0,
30991
+ display: "block",
30992
+ overflow: "visible",
30993
+ backfaceVisibility: "hidden"
30994
+ };
30995
+ return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(import_jsx_runtime113.Fragment, { children: [
30996
+ Array.from({ length: edgeLayers }, (_2, li) => {
30997
+ const z = -depth / 2 + depth * (li + 0.5) / edgeLayers;
30998
+ return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(
30999
+ "svg",
31000
+ {
31001
+ viewBox: "0 0 100 100",
31002
+ width: "100%",
31003
+ height: "100%",
31004
+ style: {
31005
+ position: "absolute",
31006
+ inset: 0,
31007
+ display: "block",
31008
+ overflow: "visible",
31009
+ transform: `translateZ(${z}px)`
31010
+ },
31011
+ "aria-hidden": "true",
31012
+ children: [
31013
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
31014
+ "polygon",
31015
+ {
31016
+ points: shape.points,
31017
+ fill: colors.face
31018
+ }
31019
+ ),
31020
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
31021
+ "polygon",
31022
+ {
31023
+ points: shape.points,
31024
+ fill: "#000",
31025
+ opacity: 0.22
31026
+ }
31027
+ )
31028
+ ]
31029
+ },
31030
+ li
31031
+ );
31032
+ }),
31033
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(
31034
+ "svg",
31035
+ {
31036
+ viewBox: "0 0 100 100",
31037
+ width: "100%",
31038
+ height: "100%",
31039
+ style: {
31040
+ ...cardFaceStyle,
31041
+ transform: `translateZ(${depth / 2}px)`
31042
+ },
31043
+ "aria-hidden": "true",
31044
+ children: [
31045
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
31046
+ "polygon",
31047
+ {
31048
+ points: shape.points,
31049
+ fill: colors.face,
31050
+ stroke: colors.faceBorder,
31051
+ strokeWidth: 2.5,
31052
+ strokeLinejoin: "round",
31053
+ style: { transition: "fill 0.3s, stroke 0.3s" }
31054
+ }
31055
+ ),
31056
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
31057
+ "polygon",
31058
+ {
31059
+ points: shape.points,
31060
+ fill: "none",
31061
+ stroke: colors.faceBorder,
31062
+ strokeWidth: 1.5,
31063
+ strokeLinejoin: "round",
31064
+ opacity: 0.55,
31065
+ transform: "translate(50 50) scale(0.76) translate(-50 -50)"
31066
+ }
31067
+ ),
31068
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
31069
+ "text",
31070
+ {
31071
+ ref: getNumeralSetter(d),
31072
+ x: 50,
31073
+ y: shape.textY,
31074
+ textAnchor: "middle",
31075
+ dominantBaseline: "central",
31076
+ fontSize: 100 * shape.fontScale,
31077
+ fontWeight: 800,
31078
+ fill: colors.pip,
31079
+ style: {
31080
+ fontVariantNumeric: "tabular-nums",
31081
+ transition: "fill 0.3s",
31082
+ userSelect: "none"
31083
+ },
31084
+ children: formatDieValue(shown, sides)
31085
+ }
31086
+ )
31087
+ ]
31088
+ }
31089
+ ),
31090
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(
31091
+ "svg",
31092
+ {
31093
+ viewBox: "0 0 100 100",
31094
+ width: "100%",
31095
+ height: "100%",
31096
+ style: {
31097
+ ...cardFaceStyle,
31098
+ transform: `rotateY(180deg) translateZ(${depth / 2}px)`
31099
+ },
31100
+ "aria-hidden": "true",
31101
+ children: [
31102
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
31103
+ "polygon",
31104
+ {
31105
+ points: shape.points,
31106
+ fill: colors.face,
31107
+ stroke: colors.faceBorder,
31108
+ strokeWidth: 2.5,
31109
+ strokeLinejoin: "round",
31110
+ style: { transition: "fill 0.3s, stroke 0.3s" }
31111
+ }
31112
+ ),
31113
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
31114
+ "polygon",
31115
+ {
31116
+ points: shape.points,
31117
+ fill: "none",
31118
+ stroke: colors.faceBorder,
31119
+ strokeWidth: 1.5,
31120
+ strokeLinejoin: "round",
31121
+ opacity: 0.55,
31122
+ transform: "translate(50 50) scale(0.76) translate(-50 -50)"
31123
+ }
31124
+ ),
31125
+ /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
31126
+ "polygon",
31127
+ {
31128
+ points: shape.points,
31129
+ fill: "#000",
31130
+ opacity: 0.14
31131
+ }
31132
+ )
31133
+ ]
31134
+ }
31135
+ )
31136
+ ] });
31042
31137
  })()
31043
31138
  }
31044
31139
  )