@webority-technologies/mobile-ui 0.0.1

package/lib/commonjs/utils/feedback.js

@@ -0,0 +1,76 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isFeedbackEnabled = exports.hapticForIntent = exports.feedback = exports.configureFeedback = void 0;
+var _hapticUtils = require("./hapticUtils.js");
+/**
+ * What the interaction MEANT, not which vibration to play.
+ *
+ * Call sites that pick a `HapticType` directly end up disagreeing with each
+ * other — one screen fires `impactMedium` on delete, the next fires
+ * `notificationWarning`, and the app stops speaking one language. Naming the
+ * intent moves that decision here, once.
+ */
+
+const INTENT_HAPTIC = {
+  tap: 'impactLight',
+  select: 'selection',
+  longPress: 'impactMedium',
+  created: 'impactMedium',
+  deleted: 'notificationWarning',
+  restored: 'notificationSuccess',
+  toggledOn: 'impactMedium',
+  toggledOff: 'impactLight',
+  succeeded: 'notificationSuccess',
+  warned: 'notificationWarning',
+  failed: 'notificationError'
+};
+let hapticsEnabled = true;
+
+/**
+ * Gate every intent from one place, so an app's "haptics" setting needs no
+ * per-component plumbing.
+ */
+const configureFeedback = prefs => {
+  hapticsEnabled = prefs.haptics;
+};
+exports.configureFeedback = configureFeedback;
+const isFeedbackEnabled = () => hapticsEnabled;
+exports.isFeedbackEnabled = isFeedbackEnabled;
+const fire = intent => {
+  if (!hapticsEnabled) {
+    return;
+  }
+  (0, _hapticUtils.triggerHaptic)(INTENT_HAPTIC[intent]);
+};
+
+/** Resolve an intent to its haptic type without firing it. */
+const hapticForIntent = intent => INTENT_HAPTIC[intent];
+exports.hapticForIntent = hapticForIntent;
+const feedback = exports.feedback = {
+  /** A plain press: button, row, chip. */
+  tap: () => fire('tap'),
+  /** Moving between options — segmented control, picker wheel, tab. */
+  select: () => fire('select'),
+  /** A long-press threshold being crossed. */
+  longPress: () => fire('longPress'),
+  /** Something now exists that did not before. */
+  created: () => fire('created'),
+  /** Something was destroyed or removed. */
+  deleted: () => fire('deleted'),
+  /** An undo landed. */
+  restored: () => fire('restored'),
+  /** A binary control turned on / off — switch, checkbox, favourite. */
+  toggled: on => fire(on ? 'toggledOn' : 'toggledOff'),
+  /** A flow finished successfully. */
+  succeeded: () => fire('succeeded'),
+  /** A recoverable problem the user should notice. */
+  warned: () => fire('warned'),
+  /** A failure. */
+  failed: () => fire('failed'),
+  /** Escape hatch for an intent held in a variable. */
+  fire
+};
+//# sourceMappingURL=feedback.js.map

package/lib/commonjs/utils/hapticUtils.js

@@ -0,0 +1,67 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.triggerHaptic = exports.setHapticImplementation = exports.resolveHaptic = void 0;
+var _reactNative = require("react-native");
+let hapticImpl = null;
+const tryLoadOptional = () => {
+  if (hapticImpl) {
+    return;
+  }
+  try {
+    // Lazily try to load the user's optional haptic dep without making it a hard requirement.
+    const haptic = require('react-native-haptic-feedback');
+    const trigger = haptic.default?.trigger ?? haptic.trigger;
+    if (typeof trigger === 'function') {
+      hapticImpl = type => trigger(type, {
+        enableVibrateFallback: true
+      });
+    }
+  } catch {
+    // Ignored: not installed; fall back to Vibration on Android, no-op on iOS.
+  }
+};
+const fallback = type => {
+  if (_reactNative.Platform.OS === 'android') {
+    const map = {
+      selection: 5,
+      impactLight: 10,
+      impactMedium: 20,
+      impactHeavy: 30,
+      notificationSuccess: 15,
+      notificationWarning: 25,
+      notificationError: 40
+    };
+    _reactNative.Vibration.vibrate(map[type] ?? 10);
+  }
+};
+const triggerHaptic = (type = 'selection') => {
+  tryLoadOptional();
+  if (hapticImpl) {
+    try {
+      hapticImpl(type);
+      return;
+    } catch {
+      /* ignore */
+    }
+  }
+  fallback(type);
+};
+exports.triggerHaptic = triggerHaptic;
+const setHapticImplementation = impl => {
+  hapticImpl = impl;
+};
+
+/**
+ * Resolves a component's `haptic` prop to the type that should fire, or null
+ * when haptics are off. `false` disables; a `HapticType` overrides; `undefined`
+ * falls back to the component's sensible default. Pair with `triggerHaptic`:
+ *   const h = resolveHaptic(haptic, 'selection');
+ *   if (h) triggerHaptic(h);
+ */
+exports.setHapticImplementation = setHapticImplementation;
+const resolveHaptic = (haptic, fallbackType) => haptic === false ? null : haptic ?? fallbackType;
+exports.resolveHaptic = resolveHaptic;
+//# sourceMappingURL=hapticUtils.js.map

package/lib/commonjs/utils/index.js

@@ -0,0 +1,114 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Breakpoints", {
+  enumerable: true,
+  get: function () {
+    return _responsive.Breakpoints;
+  }
+});
+Object.defineProperty(exports, "Margin", {
+  enumerable: true,
+  get: function () {
+    return _spacing.Margin;
+  }
+});
+Object.defineProperty(exports, "Padding", {
+  enumerable: true,
+  get: function () {
+    return _spacing.Padding;
+  }
+});
+Object.defineProperty(exports, "Responsive", {
+  enumerable: true,
+  get: function () {
+    return _responsive.Responsive;
+  }
+});
+Object.defineProperty(exports, "ScreenDimensions", {
+  enumerable: true,
+  get: function () {
+    return _responsive.ScreenDimensions;
+  }
+});
+Object.defineProperty(exports, "Spacing", {
+  enumerable: true,
+  get: function () {
+    return _spacing.Spacing;
+  }
+});
+Object.defineProperty(exports, "configureFeedback", {
+  enumerable: true,
+  get: function () {
+    return _feedback.configureFeedback;
+  }
+});
+Object.defineProperty(exports, "feedback", {
+  enumerable: true,
+  get: function () {
+    return _feedback.feedback;
+  }
+});
+Object.defineProperty(exports, "hapticForIntent", {
+  enumerable: true,
+  get: function () {
+    return _feedback.hapticForIntent;
+  }
+});
+Object.defineProperty(exports, "isFeedbackEnabled", {
+  enumerable: true,
+  get: function () {
+    return _feedback.isFeedbackEnabled;
+  }
+});
+Object.defineProperty(exports, "isScreenSize", {
+  enumerable: true,
+  get: function () {
+    return _responsive.isScreenSize;
+  }
+});
+Object.defineProperty(exports, "isTablet", {
+  enumerable: true,
+  get: function () {
+    return _responsive.isTablet;
+  }
+});
+Object.defineProperty(exports, "resolveHaptic", {
+  enumerable: true,
+  get: function () {
+    return _hapticUtils.resolveHaptic;
+  }
+});
+Object.defineProperty(exports, "setHapticImplementation", {
+  enumerable: true,
+  get: function () {
+    return _hapticUtils.setHapticImplementation;
+  }
+});
+Object.defineProperty(exports, "shadowStyle", {
+  enumerable: true,
+  get: function () {
+    return _shadows.shadowStyle;
+  }
+});
+Object.defineProperty(exports, "triggerHaptic", {
+  enumerable: true,
+  get: function () {
+    return _hapticUtils.triggerHaptic;
+  }
+});
+Object.defineProperty(exports, "warnUnknownProps", {
+  enumerable: true,
+  get: function () {
+    return _warnUnknownProps.warnUnknownProps;
+  }
+});
+var _feedback = require("./feedback.js");
+var _hapticUtils = require("./hapticUtils.js");
+var _responsive = require("./responsive.js");
+var _shadows = require("./shadows.js");
+var _spacing = require("./spacing.js");
+var _warnUnknownProps = require("./warnUnknownProps.js");
+//# sourceMappingURL=index.js.map

package/lib/commonjs/utils/responsive.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isTablet = exports.isScreenSize = exports.ScreenDimensions = exports.Responsive = exports.Breakpoints = void 0;
+var _reactNative = require("react-native");
+const BASE_WIDTH = 390;
+const BASE_HEIGHT = 844;
+const {
+  width: SCREEN_WIDTH,
+  height: SCREEN_HEIGHT
+} = _reactNative.Dimensions.get('window');
+const ScreenDimensions = exports.ScreenDimensions = {
+  width: SCREEN_WIDTH,
+  height: SCREEN_HEIGHT,
+  pixelRatio: _reactNative.PixelRatio.get(),
+  fontScale: _reactNative.PixelRatio.getFontScale()
+};
+const Breakpoints = exports.Breakpoints = {
+  xs: 0,
+  sm: 360,
+  md: 414,
+  lg: 768,
+  xl: 1024
+};
+const isScreenSize = size => {
+  return SCREEN_WIDTH >= Breakpoints[size];
+};
+exports.isScreenSize = isScreenSize;
+const isTablet = () => SCREEN_WIDTH >= Breakpoints.lg;
+exports.isTablet = isTablet;
+const widthScale = SCREEN_WIDTH / BASE_WIDTH;
+const heightScale = SCREEN_HEIGHT / BASE_HEIGHT;
+const minScale = Math.min(widthScale, heightScale);
+const Responsive = exports.Responsive = {
+  width: size => Math.round(size * widthScale),
+  height: size => Math.round(size * heightScale),
+  size: size => Math.round(size * minScale),
+  font: size => {
+    const scaled = size * minScale;
+    if (_reactNative.Platform.OS === 'ios') {
+      return Math.round(_reactNative.PixelRatio.roundToNearestPixel(scaled));
+    }
+    return Math.round(_reactNative.PixelRatio.roundToNearestPixel(scaled)) - 1;
+  }
+};
+//# sourceMappingURL=responsive.js.map

package/lib/commonjs/utils/shadows.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.shadowStyle = void 0;
+const shadowStyle = (shadows, level) => {
+  const def = shadows[level];
+  return def;
+};
+exports.shadowStyle = shadowStyle;
+//# sourceMappingURL=shadows.js.map

package/lib/commonjs/utils/spacing.js

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Spacing = exports.Padding = exports.Margin = void 0;
+var _index = require("../theme/index.js");
+const Spacing = exports.Spacing = {
+  get none() {
+    return (0, _index.getTheme)().spacing.none;
+  },
+  get xxs() {
+    return (0, _index.getTheme)().spacing.xxs;
+  },
+  get xs() {
+    return (0, _index.getTheme)().spacing.xs;
+  },
+  get sm() {
+    return (0, _index.getTheme)().spacing.sm;
+  },
+  get md() {
+    return (0, _index.getTheme)().spacing.md;
+  },
+  get lg() {
+    return (0, _index.getTheme)().spacing.lg;
+  },
+  get xl() {
+    return (0, _index.getTheme)().spacing.xl;
+  },
+  get '2xl'() {
+    return (0, _index.getTheme)().spacing['2xl'];
+  },
+  get '3xl'() {
+    return (0, _index.getTheme)().spacing['3xl'];
+  },
+  get '4xl'() {
+    return (0, _index.getTheme)().spacing['4xl'];
+  }
+};
+const Padding = exports.Padding = {
+  all: token => ({
+    padding: (0, _index.getTheme)().spacing[token]
+  }),
+  horizontal: token => ({
+    paddingHorizontal: (0, _index.getTheme)().spacing[token]
+  }),
+  vertical: token => ({
+    paddingVertical: (0, _index.getTheme)().spacing[token]
+  }),
+  top: token => ({
+    paddingTop: (0, _index.getTheme)().spacing[token]
+  }),
+  bottom: token => ({
+    paddingBottom: (0, _index.getTheme)().spacing[token]
+  }),
+  left: token => ({
+    paddingLeft: (0, _index.getTheme)().spacing[token]
+  }),
+  right: token => ({
+    paddingRight: (0, _index.getTheme)().spacing[token]
+  })
+};
+const Margin = exports.Margin = {
+  all: token => ({
+    margin: (0, _index.getTheme)().spacing[token]
+  }),
+  horizontal: token => ({
+    marginHorizontal: (0, _index.getTheme)().spacing[token]
+  }),
+  vertical: token => ({
+    marginVertical: (0, _index.getTheme)().spacing[token]
+  }),
+  top: token => ({
+    marginTop: (0, _index.getTheme)().spacing[token]
+  }),
+  bottom: token => ({
+    marginBottom: (0, _index.getTheme)().spacing[token]
+  }),
+  left: token => ({
+    marginLeft: (0, _index.getTheme)().spacing[token]
+  }),
+  right: token => ({
+    marginRight: (0, _index.getTheme)().spacing[token]
+  })
+};
+//# sourceMappingURL=spacing.js.map

package/lib/commonjs/utils/warnUnknownProps.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.warnUnknownProps = void 0;
+var _mobileCore = require("@webority-technologies/mobile-core");
+/**
+ * Dev-time warning for props a component does not accept.
+ *
+ * This exists for a class of bug that nothing in a JS consumer's toolchain
+ * objects to. A component destructures the props it knows and ignores the rest,
+ * so a renamed or mistyped prop is simply dropped — silently, at every call
+ * site. The web library hit this three times in one day: `body` instead of
+ * `message` left nine destructive confirm dialogs with no explanatory text, and
+ * `name` instead of `icon` emptied an entire actions column across 23 call
+ * sites. Neither failed a build, a lint or a test.
+ *
+ * Our components are TypeScript, so a TS consumer is already protected at
+ * compile time. Several apps in the fleet are plain JS, and they get nothing —
+ * which is who this is for. The check therefore has to be a runtime one, and it
+ * has to run where the mistake is made: the consumer's dev server.
+ *
+ * DEV ONLY — the `__DEV__` guard means it costs a release build nothing.
+ */
+const warnUnknownProps = (componentName, rest) => {
+  if (!__DEV__ || !rest) {
+    return;
+  }
+  const unknown = Object.keys(rest).filter(key => !isAllowed(key));
+  if (unknown.length === 0) {
+    return;
+  }
+  _mobileCore.Logger.warn(`[${componentName}] received prop(s) it does not accept: ${unknown.join(', ')}. ` + "They were ignored — check for a rename or a typo against the component's props.");
+};
+
+/**
+ * Keys that legitimately arrive through `...rest` and must never warn. The list
+ * is deliberately generous: a false positive fires on correct code, and a
+ * warning people learn to ignore is worse than no warning at all.
+ */
+exports.warnUnknownProps = warnUnknownProps;
+const ALLOWED_EXACT = new Set(['children', 'key', 'ref', 'style', 'testID', 'collapsable', 'nativeID', 'pointerEvents', 'removeClippedSubviews', 'renderToHardwareTextureAndroid', 'shouldRasterizeIOS', 'needsOffscreenAlphaCompositing', 'hitSlop', 'onLayout', 'importantForAccessibility', 'role']);
+const ALLOWED_PREFIXES = ['accessibility', 'aria-', 'on', 'data-'];
+const isAllowed = key => ALLOWED_EXACT.has(key) || ALLOWED_PREFIXES.some(p => key.startsWith(p));
+//# sourceMappingURL=warnUnknownProps.js.map