Merge pull request #97 from overextended/npm-package

Npm package

.github/workflows/release.yml

@@ -36,6 +36,10 @@ jobs:
       - name: Install dependencies
         run: pnpm install
         working-directory: web
+        
+      - name: Bump package version
+        run: pnpm version ${{ github.ref_name }}
+        working-directory: package
 
       - name: Run build
         run: pnpm build
@@ -83,3 +87,10 @@ jobs:
         env:
           CI: false
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Publish npm package
+        uses: JS-DevTools/npm-publish@v1
+        with:
+          token: ${{ secrets.NPM_TOKEN }}
+          package: './packages/package.json'
+          access: 'public'

package/.gitignore

@@ -0,0 +1,6 @@
+node_modules
+pnpm-debug.log*
+
+*.js
+*.js.map
+*.d.ts

package/.npmignore

@@ -0,0 +1 @@
+.prettierrc

package/.prettierrc

@@ -0,0 +1,9 @@
+{
+  "printWidth": 120,
+  "singleQuote": true,
+  "useTabs": false,
+  "tabWidth": 2,
+  "semi": true,
+  "bracketSpacing": true,
+  "trailingComma": "es5"
+}

package/client/index.ts

@@ -0,0 +1,5 @@
+import * as lib from './resource';
+
+export * from './resource';
+export * from '../shared';
+export default lib;

package/client/resource/cache/index.ts

@@ -0,0 +1,6 @@
+import { cache, onCache } from '../../../shared';
+
+cache.playerId = PlayerId();
+cache.serverId = GetPlayerServerId(cache.playerId);
+
+export { cache, onCache };

package/client/resource/index.ts

@@ -0,0 +1,12 @@
+export * from './interface/alert';
+export * from './interface/clipboard';
+export * from './interface/context';
+export * from './interface/input';
+export * from './interface/menu';
+export * from './interface/notify';
+export * from './interface/progress';
+export * from './interface/textui';
+
+export * from './streaming';
+
+export * from './vehicleProperties';

package/client/resource/interface/alert.ts

@@ -0,0 +1,10 @@
+interface AlertDialogProps {
+  header: string;
+  content: string;
+  centered?: boolean;
+  cancel?: boolean;
+}
+
+type alertDialog = (data: AlertDialogProps) => Promise<'cancel' | 'confirm'>;
+
+export const alertDialog: alertDialog = async (data) => await exports.ox_lib.alertDialog(data);

package/client/resource/interface/clipboard.ts

@@ -0,0 +1 @@
+export const setClipboard = (value: string) => exports.ox_lib.setClipboard(value);

package/client/resource/interface/context.ts

@@ -0,0 +1,37 @@
+import { IconName, IconPrefix } from '@fortawesome/fontawesome-common-types';
+
+interface ContextMenuItem {
+  title?: string;
+  menu?: string;
+  icon?: IconName | [IconPrefix, IconName];
+  iconColor?: string;
+  onSelect?: (args: any) => void;
+  arrow?: boolean;
+  description?: string;
+  metadata?: string | { [key: string]: any } | string[];
+  event?: string;
+  serverEvent?: string;
+  args?: any;
+}
+
+interface ContextMenuArrayItem extends ContextMenuItem {
+  title: string;
+}
+
+interface ContextMenuProps {
+  id: string;
+  title: string;
+  menu?: string;
+  onExit?: () => void;
+  canClose?: boolean;
+  options: { [key: string]: ContextMenuItem } | ContextMenuArrayItem[];
+}
+
+type registerContext = (context: ContextMenuProps | ContextMenuProps[]) => void;
+export const registerContext: registerContext = (context) => exports.ox_lib.registerContext(context);
+
+export const showContext = (id: string): void => exports.ox_lib.showContext(id);
+
+export const hideContext = (onExit: boolean): void => exports.ox_lib.hideContext(onExit);
+
+export const getOpenContextMenu = (): string | null => exports.ox_lib.getOpenContextMenu();

package/client/resource/interface/input.ts

@@ -0,0 +1,22 @@
+import { IconName, IconPrefix } from '@fortawesome/fontawesome-common-types';
+
+interface InputDialogRowProps {
+  type: 'input' | 'number' | 'checkbox' | 'select' | 'slider';
+  label: string;
+  options?: { value: string; label: string; default?: string }[];
+  password?: boolean;
+  icon?: IconName | [IconPrefix, IconName];
+  iconColor?: string;
+  placeholder?: string;
+  default?: string | number;
+  checked?: boolean;
+  min?: number;
+  max?: number;
+  step?: number;
+}
+
+type inputDialog = (
+  heading: string,
+  rows: string[] | InputDialogRowProps[]
+) => Promise<Array<string | number | boolean> | undefined>;
+export const inputDialog: inputDialog = async (heading, rows) => await exports.ox_lib.inputDialog(heading, rows);

package/client/resource/interface/menu.ts

@@ -0,0 +1,36 @@
+import { IconName, IconPrefix } from '@fortawesome/fontawesome-common-types';
+
+type MenuPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+type ChangeFunction = (selected: number, scrollIndex: number | null, args: any | null) => void;
+
+interface MenuOptions {
+  label: string;
+  icon?: IconName | [IconPrefix, IconName];
+  values?: string[];
+  description?: string;
+  defaultIndex?: number;
+  args?: any;
+}
+
+interface MenuProps {
+  id: string;
+  title: string;
+  options: MenuOptions[];
+  position?: MenuPosition;
+  disableInput?: boolean;
+  onClose?: () => void;
+  onSelected?: ChangeFunction;
+  onSideScroll?: ChangeFunction;
+}
+
+type registerMenu = (data: MenuProps, cb: ChangeFunction) => void;
+export const registerMenu: registerMenu = (data, cb) => exports.ox_lib.registerMenu(data, cb);
+
+export const showMenu = (id: string): string => exports.ox_lib.showMenu(id);
+
+export const hideMenu = (onExit: boolean): void => exports.ox_lib.hideMenu(onExit);
+
+export const getOpenMenu = (): string | null => exports.ox_lib.getOpenMenu();
+
+type setMenuOptions = (id: string, options: MenuOptions | MenuOptions[], index?: number) => void;
+export const setMenuOptions: setMenuOptions = (id, options, index) => exports.ox_lib.setMenuOptions(id, options, index);

package/client/resource/interface/notify.ts

@@ -0,0 +1,30 @@
+import { CSSProperties } from 'react';
+import { IconName, IconPrefix } from '@fortawesome/fontawesome-common-types';
+
+type NotificationPosition = 'top' | 'top-right' | 'top-left' | 'bottom' | 'bottom-right' | 'bottom-left';
+type NotificationType = 'inform' | 'error' | 'success';
+
+interface NotifyProps {
+  id?: string;
+  title?: string;
+  description?: string;
+  duration?: number;
+  position?: NotificationPosition;
+  type?: NotificationType;
+  style?: CSSProperties;
+  icon?: IconName | [IconPrefix, IconName];
+  iconColor?: string;
+}
+
+export const notify = (data: NotifyProps): void => exports.ox_lib.notify(data);
+
+interface DefaultNotifyProps {
+  title?: string;
+  description?: string;
+  duration?: number;
+  position?: NotificationPosition;
+  status?: 'info' | 'warning' | 'success' | 'error';
+  id?: number;
+}
+
+export const defaultNotify = (data: DefaultNotifyProps): void => exports.ox_lib.defaultNotify(data);

package/client/resource/interface/progress.ts

@@ -0,0 +1,55 @@
+type Position = {
+  x: number;
+  y: number;
+  z: number;
+};
+
+interface PropProps {
+  model: string;
+  bone?: number;
+  pos: Position;
+  rot: Position;
+}
+
+interface ProgressProps {
+  duration: number;
+  position?: 'middle' | 'bottom';
+  useWhileDead?: boolean;
+  allowRagdoll?: boolean;
+  allowCuffed?: boolean;
+  allowFalling?: boolean;
+  canCancel?: boolean;
+  anim?: {
+    dict?: string;
+    clip: string;
+    flag?: number;
+    blendIn?: number;
+    blendOut?: number;
+    duration?: number;
+    playbackRate?: number;
+    lockX?: boolean;
+    lockY?: boolean;
+    lockZ?: boolean;
+    scenario?: string;
+    playEnter?: boolean;
+  };
+  prop?: PropProps | PropProps[];
+  disable?: {
+    move?: boolean;
+    car?: boolean;
+    combat?: boolean;
+    mouse?: boolean;
+  };
+}
+
+interface ProgressbarProps extends Omit<ProgressProps, 'position'> {
+  label: string;
+}
+
+export const progressBar = async (data: ProgressbarProps): Promise<boolean> => exports.ox_lib.progressBar(data);
+
+export const progressCircle = async (data: ProgressProps): Promise<boolean> => exports.ox_lib.progressCircle(data);
+
+export const progressActive = (): boolean => exports.ox_lib.progressActive();
+
+export const cancelProgress = (): void => exports.ox_lib.cancelProgress();

package/client/resource/interface/textui.ts

@@ -0,0 +1,12 @@
+import { IconLookup, IconName, IconPrefix } from '@fortawesome/fontawesome-common-types';
+import { CSSProperties } from 'react';
+
+interface OptionsProps {
+  position?: 'right-center' | 'left-center' | 'top-center';
+  icon?: IconName | [IconPrefix, IconName];
+  iconColor?: string;
+  style?: CSSProperties;
+}
+export const showTextUI = (text: string, options?: OptionsProps): void => exports.ox_lib.showTextUI(text, options);
+
+export const hideTextUI = (): void => exports.ox_lib.hideTextUI();

package/client/resource/streaming/index.ts

@@ -0,0 +1,14 @@
+export const requestAnimDict = (animDict: string, timeout?: number): string =>
+  exports.ox_lib.requestAnimDict(animDict, timeout);
+
+export const requestAnimSet = (animSet: string, timeout?: number): string =>
+  exports.ox_lib.requestAnimSet(animSet, timeout);
+
+export const requestModel = (model: string | number, timeout?: number): string =>
+  exports.ox_lib.requestModel(model, timeout);
+
+export const requestStreamedTextureDict = (dict: string, timeout?: number): string =>
+  exports.ox_lib.requestStreamedTextureDict(dict, timeout);
+
+export const requestNamedPtfxAsset = (fxName: string, timeout?: number): string =>
+  exports.ox_lib.requestNamedPtfxAsset(fxName, timeout);

package/client/resource/vehicleProperties/index.ts

@@ -0,0 +1,90 @@
+interface VehicleProperties {
+  model: string;
+  plate: string;
+  plateIndex: number;
+  bodyHealth: number;
+  engineHealth: number;
+  tankHealth: number;
+  fuelLevel: number;
+  dirtLevel: number;
+  color1: number;
+  color2: number;
+  pearlescentColor: number;
+  interiorColor: number;
+  dashboardColor: number;
+  wheelColor: number;
+  wheelWidth: number;
+  wheelSize: number;
+  wheels: number;
+  windowTint: number;
+  xenonColor: number;
+  neonEnabled: boolean[];
+  neonColor: [number, number, number];
+  extras: boolean[];
+  tyreSmokeColor: [number, number, number];
+  modSpoilers: number;
+  modFrontBumper: number;
+  modRearBumper: number;
+  modSideSkirt: number;
+  modExhaust: number;
+  modFrame: number;
+  modGrille: number;
+  modHood: number;
+  modFender: number;
+  modRightFender: number;
+  modRoof: number;
+  modEngine: number;
+  modBrakes: number;
+  modTransmission: number;
+  modHorns: number;
+  modSuspension: number;
+  modArmor: number;
+  modNitrous: number;
+  modTurbo: number;
+  modSubwoofer: number;
+  modSmokeEnabled: number;
+  modHydraulics: number;
+  modXenon: number;
+  modFrontWheels: number;
+  modBackWheels: number;
+  modCustomTiresF: number;
+  modCustomTiresR: number;
+  modPlateHolder: number;
+  modVanityPlate: number;
+  modTrimA: number;
+  modOrnaments: number;
+  modDashboard: number;
+  modDial: number;
+  modDoorSpeaker: number;
+  modSeats: number;
+  modSteeringWheel: number;
+  modShifterLeavers: number;
+  modAPlate: number;
+  modSpeakers: number;
+  modTrunk: number;
+  modHydrolic: number;
+  modEngineBlock: number;
+  modAirFilter: number;
+  modStruts: number;
+  modArchCover: number;
+  modAerials: number;
+  modTrimB: number;
+  modTank: number;
+  modWindows: number;
+  modDoorR: number;
+  modLivery: number;
+  modRoofLivery: number;
+  modLightbar: number;
+  windows: number[];
+  doors: number[];
+  tyres: number[];
+  leftHeadlight: boolean;
+  rightHeadlight: boolean;
+  frontBumper: boolean;
+  rearBumper: boolean;
+}
+
+export const getVehicleProperties = (vehicle: number): VehicleProperties => exports.ox_lib.getVehicleProperties(vehicle);
+
+export const setVehicleProperties = (vehicle: number, props: Partial<VehicleProperties>): boolean =>
+  exports.ox_lib.setVehicleProperties(vehicle, props);

package/client/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": ".",
+    "types": ["@citizenfx/client"]
+  },
+  "include": ["./**/*"],
+  "exclude": ["**/node_modules"]
+}

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@overextended/ox_lib",
+  "author": "Overextended",
+  "version": "1.0.0",
+  "description": "JS/TS wrapper for ox_lib exports",
+  "types": "./client/index.d.ts",
+  "main": "index.js",
+  "scripts": {
+    "prepublish": "tsc"
+  },
+  "keywords": [
+    "fivem",
+    "ox_lib",
+    "ox",
+    "overextended"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/overextended/ox_lib.git"
+  },
+  "bugs": {
+    "url": "https://github.com/overextended/ox_lib/issues"
+  },
+  "license": "LGPL-3.0",
+  "dependencies": {
+    "@citizenfx/client": "2.0.5885-1",
+    "@citizenfx/server": "2.0.5885-1",
+    "@fortawesome/fontawesome-common-types": "6.1.1",
+    "@types/node": "16.9.1",
+    "@types/react": "^18.0.20",
+    "typescript": "^4.8.3"
+  },
+  "devDependencies": {
+    "prettier": "^2.7.1"
+  }
+}

package/pnpm-lock.yaml

@@ -0,0 +1,73 @@
+lockfileVersion: 5.4
+
+specifiers:
+  '@citizenfx/client': 2.0.5885-1
+  '@citizenfx/server': 2.0.5885-1
+  '@fortawesome/fontawesome-common-types': 6.1.1
+  '@types/node': 16.9.1
+  '@types/react': ^18.0.20
+  prettier: ^2.7.1
+  typescript: ^4.8.3
+
+dependencies:
+  '@citizenfx/client': 2.0.5885-1
+  '@citizenfx/server': 2.0.5885-1
+  '@fortawesome/fontawesome-common-types': 6.1.1
+  '@types/node': 16.9.1
+  '@types/react': 18.0.20
+  typescript: 4.8.3
+
+devDependencies:
+  prettier: 2.7.1
+
+packages:
+
+  /@citizenfx/client/2.0.5885-1:
+    resolution: {integrity: sha512-Ba5YYfxhZ82PcOY+2rjqDElTzPt7NrN6/o2U+wYPKK2VU/wRdCsMonpMsr7dYob2ToN5Qe96w5VNI3m5OrouJQ==}
+    dev: false
+
+  /@citizenfx/server/2.0.5885-1:
+    resolution: {integrity: sha512-q8KRecfjJ3RjCfBT/3CSHNTr2efUs9uq8pIoPF4TGkn5X7jgTBprrp3VMayaee3Xekay3RTufpzsOaeHUntQeA==}
+    dev: false
+
+  /@fortawesome/fontawesome-common-types/6.1.1:
+    resolution: {integrity: sha512-wVn5WJPirFTnzN6tR95abCx+ocH+3IFLXAgyavnf9hUmN0CfWoDjPT/BAWsUVwSlYYVBeCLJxaqi7ZGe4uSjBA==}
+    engines: {node: '>=6'}
+    requiresBuild: true
+    dev: false
+
+  /@types/node/16.9.1:
+    resolution: {integrity: sha512-QpLcX9ZSsq3YYUUnD3nFDY8H7wctAhQj/TFKL8Ya8v5fMm3CFXxo8zStsLAl780ltoYoo1WvKUVGBQK+1ifr7g==}
+    dev: false
+
+  /@types/prop-types/15.7.5:
+    resolution: {integrity: sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==}
+    dev: false
+
+  /@types/react/18.0.20:
+    resolution: {integrity: sha512-MWul1teSPxujEHVwZl4a5HxQ9vVNsjTchVA+xRqv/VYGCuKGAU6UhfrTdF5aBefwD1BHUD8i/zq+O/vyCm/FrA==}
+    dependencies:
+      '@types/prop-types': 15.7.5
+      '@types/scheduler': 0.16.2
+      csstype: 3.1.1
+    dev: false
+
+  /@types/scheduler/0.16.2:
+    resolution: {integrity: sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==}
+    dev: false
+
+  /csstype/3.1.1:
+    resolution: {integrity: sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==}
+    dev: false
+
+  /prettier/2.7.1:
+    resolution: {integrity: sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g==}
+    engines: {node: '>=10.13.0'}
+    hasBin: true
+    dev: true
+
+  /typescript/4.8.3:
+    resolution: {integrity: sha512-goMHfm00nWPa8UvR/CPSvykqf6dVV8x/dp0c5mFTMTIu0u0FlGWRioyy7Nn0PGAdHxpJZnuO/ut+PpQ8UiHAig==}
+    engines: {node: '>=4.2.0'}
+    hasBin: true
+    dev: false

package/server/index.ts

@@ -0,0 +1,5 @@
+import * as lib from './resource';
+
+export * from './resource';
+export * from '../shared';
+export default lib;

package/server/resource/acl/index.ts

@@ -0,0 +1,8 @@
+type aceFunction = (principal: string | number, ace: string, allow: boolean) => void;
+type principalFunction = (child: string, parent: string) => void;
+
+export const addAce: aceFunction = (principal, ace, allow) => exports.ox_lib.addAce(principal, ace, allow);
+export const removeAce: aceFunction = (principal, ace, allow) => exports.ox_lib.addAce(principal, ace, allow);
+
+export const addPrincipal: principalFunction = (child, parent) => exports.ox_lib.addPrincipal(child, parent);
+export const removePrincipal: principalFunction = (child, parent) => exports.ox_lib.removePrincipal(child, parent);

package/server/resource/cache/index.ts

@@ -0,0 +1,3 @@
+import { cache, onCache } from '../../../shared';
+
+export { cache, onCache };

package/server/resource/index.ts

@@ -0,0 +1,2 @@
+export * from './acl';
+export * from './locale';

package/server/resource/locale/index.ts

@@ -0,0 +1 @@
+export const getServerLocale = (): string => exports.ox_lib.getServerLocale();

package/server/resource/version/index.ts

@@ -0,0 +1 @@
+export const versionCheck = (repository: string) => exports.ox_lib.versionCheck(repository);

package/server/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": ".",
+    "types": ["@citizenfx/server"]
+  },
+  "include": ["./**/*"],
+  "exclude": ["**/node_modules"]
+}

package/shared/index.ts

@@ -0,0 +1 @@
+export * from './resource';

package/shared/resource/cache/index.ts

@@ -0,0 +1,22 @@
+export const cache: Record<string, any> = new Proxy(
+  {
+    resource: GetCurrentResourceName(),
+  },
+  {
+    get(target, key: string) {
+      const result = key ? target[key] : target;
+      if (result) return result;
+
+      AddEventHandler(`ox_lib:cache:${key}`, (value: any) => {
+        target[key] = value;
+      });
+
+      target[key] = exports.ox_lib.cache(key);
+      return target[key];
+    },
+  }
+);
+
+export const onCache = <T = any>(key: string, cb: (value: T) => void) => {
+  AddEventHandler(`ox_lib:cache:${key}`, cb);
+};

package/shared/resource/index.ts

@@ -0,0 +1,2 @@
+export * from './version';
+export * from './cache';

package/shared/resource/version/index.ts

@@ -0,0 +1,2 @@
+export const checkDependency = (resource: string, minimumVersion: string, printMessage?: boolean) =>
+  exports.ox_lib.checkDependency(resource, minimumVersion, printMessage);

package/shared/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": ".",
+    "types": ["@citizenfx/client", "@citizenfx/server"]
+  },
+  "include": ["./**/*"],
+  "exclude": ["**/node_modules"]
+}

package/tsconfig.json

@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "strict": true,
+    "module": "CommonJS",
+    "types": ["@types/node", "@citizenfx/client", "@citizenfx/server"],
+    "declaration": true,
+    "sourceMap": true,
+    "target": "ESNext",
+    "allowJs": false,
+    "lib": ["ESNext"],
+    "noEmitOnError": false,
+    "resolveJsonModule": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "moduleResolution": "node",
+    "experimentalDecorators": true,
+    "noImplicitAny": false,
+    "noEmit": false
+  },
+  "include": ["client", "server", "shared"],
+  "exclude": ["**/node_modules"]
+}