@markprompt/web - npm Package Compare versions

Comparing version 0.3.5 to 0.4.0

dist/index.d.ts

@@ -1,3 +0,8 @@
-import 'client-only';
-import './markprompt-content';
+import { type MarkpromptOptions } from './types.js';
+/**
+ * @param projectKey Your Markprompt project key
+ * @param container The element or selector to render Markprompt into
+ * @param options Options for customizing Markprompt
+ */
+export declare function markprompt(projectKey: string, container: HTMLElement | string, options?: MarkpromptOptions): void;
 //# sourceMappingURL=index.d.ts.map

package.json

 {
   "name": "@markprompt/web",
-  "version": "0.3.5",
+  "version": "0.4.0",
   "description": "A web component for adding GPT-4 powered search using the Markprompt API.",
@@ -13,27 +13,32 @@ "repository": {
   "type": "module",
-  "exports": "./dist/index.js",
+  "exports": {
+    ".": "./dist/index.js",
+    "./init": "./dist/init.js"
+  },
   "main": "dist/index.js",
   "files": [
-    "README.md",
-    "dist"
+    "dist/globals.*",
+    "dist/index.*",
+    "dist/init.*",
+    "dist/types.*"
   ],
   "scripts": {
-    "build": "tsc --build --clean && tsc --build",
-    "dev": "tsc --build --watch",
-    "prepack": "tsc --build",
-    "vite": "vite"
+    "analyze": "node scripts/analyze.js",
+    "build": "node scripts/build.js",
+    "dev": "node scripts/dev.js",
+    "prepack": "node scripts/build.js"
   },
   "dependencies": {
-    "@markprompt/core": "0.4.1",
-    "lit": "^2.7.2",
-    "rehype-sanitize": "^5.0.1",
-    "rehype-stringify": "^9.0.3",
-    "remark-gfm": "^3.0.1",
-    "remark-parse": "^10.0.1",
-    "remark-rehype": "^10.1.0",
-    "unified": "^10.1.2"
+    "@markprompt/core": "0.4.6"
   },
   "devDependencies": {
-    "typescript": "^5.0.4",
-    "vite": "^4.2.0"
+    "@markprompt/react": "0.4.0",
+    "@radix-ui/react-accessible-icon": "^1.0.3",
+    "@types/react": "^18.2.6",
+    "@types/react-dom": "^18.2.4",
+    "esbuild": "^0.17.19",
+    "preact": "^10.15.1",
+    "react": "npm:@preact/compat",
+    "react-dom": "npm:@preact/compat",
+    "typescript": "^5.0.4"
   },
@@ -40,0 +45,0 @@ "publishConfig": {

README.md

@@ -1,4 +0,4 @@
-# Markprompt Web
+# `@markprompt/web`
 
-A Web Component component for building a prompt interface, based on the [Markprompt](https://markprompt.com) API.
+A prebuilt version of the Markprompt dialog, based on `@markprompt/react`, built with Preact for bundle-size savings. Viable for use from vanilla JavaScript or any framework.
 
@@ -17,6 +17,6 @@ <br />
 
-Add the following script tag to your HTML page:
+Install the package from NPM:
 
-```html
-<script type="module" src="https://esm.sh/@markprompt/web@0.2.2-beta18" />
+```sh
+npm add @markprompt/web @markprompt/css
 ```
@@ -26,13 +26,109 @@
 
-Then add the `markprompt-web` component anywhere on your page:
+Include the CSS on your page, via a link tag or by importing it in your JavaScript:
 
 ```html
-<markprompt-content projectKey="<project-key>" />
+<!-- load from a CDN: -->
+<link rel="stylesheet" href="https://esm.sh/@markprompt/css?css" />
 ```
 
-where `project-key` can be obtained in your project settings.
+```js
+import '@markprompt/css';
+```
 
+Call the `markprompt` function with your project key:
+
+```js
+import { markprompt } from '@markprompt/web';
+
+const markpromptEl = document.querySelector('#markprompt');
+
+markprompt('<project-key>', markpromptEl, {
+  references: {
+    transformReferenceId: (referenceId) => ({
+      text: referenceId.replace('-', ' '),
+      href: `/docs/${referenceId}`,
+    }),
+  },
+});
+```
+
+where `project-key` can be obtained in your project settings on [Markprompt.com](https://markprompt.com/).
+
+Options are optional and allow you to configure texts the component to some extent. You will most likely want to pass `transformReferenceId` to transform your reference ids into links to your corresponding documentation.
+
+```ts
+type Options = {
+  /** Props for the close modal button */
+  close?: {
+    /** Aria-label for the close modal button */
+    label?: string;
+  };
+  /** Props for the description */
+  description?: {
+    /** Whether to hide the description, default: `true` */
+    hide?: boolean;
+    /** Text for the description */
+    text?: string;
+  };
+  /** Props for the prompt */
+  prompt?: {
+    /** Label for the prompt input, default: `Your prompt` */
+    label?: string;
+    /** Placeholder for the prompt input, default: `Ask me anything…` */
+    placeholder?: string;
+  };
+  references?: {
+    /** Callback to transform a reference id into an href and text */
+    transformReferenceId?: (referenceId: string) => {
+      href: string;
+      text: string;
+    };
+    /** Loading text, default: `Fetching relevant pages…` */
+    loadingText?: string;
+    /** References title, default: `Answer generated from the following sources:` */
+    referencesText?: string;
+  };
+  /** Props for the trigger */
+  trigger?: {
+    /** Aria-label for the trigger button */
+    label?: string;
+  };
+  /** Props for the title */
+  title?: {
+    /** Whether to hide the title, default: `true` */
+    hide?: boolean;
+    /** Text for the title: default `Ask me anything` */
+    text?: string;
+  };
+};
+```
+
+Styles are easily overridable for customization via targeting classes. Additionally, see the [styling section](https://markprompt.com/docs#styling) in our documentation for a full list of variables.
+
+## Usage via `<script>` tag
+
+Besides initializing the Markprompt component yourselves from JavaScript, you can load the script from a CDN. You can attach the options for the Markprompt component to the window prior to loading our script:
+
+```html
+<link rel="stylesheet" href="https://esm.sh/@markprompt/css?css" />
+<script>
+  window.markprompt = {
+    projectKey: `<your-project-key>`,
+    container: `#markprompt`,
+    options: {
+      references: {
+        transformReferenceId: (referenceId) => ({
+          text: referenceId.replace('-', ' '),
+          href: `/docs/${referenceId}`,
+        }),
+      },
+    },
+  };
+</script>
+<script async src="https://esm.sh/@markprompt/web"></script>
+```
+
 ## Documentation
 
-The full documentation for the component can be found on the [Markprompt docs](https://markprompt.com/docs#web-component).
+The full documentation for `@markprompt/web` can be found on the [Markprompt docs](https://markprompt.com/docs#%40markprompt%2Fweb).
 
@@ -39,0 +135,0 @@ ## Community

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Network access

Supply chain risk

This module accesses the network.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2821786

increased by7748.1%

Dependency count

1

decreased by-87.5%

Number of package files

13

increased by30%

Lines of code

1806

increased by144.72%

Number of lines in readme file

143

increased by204.26%

Worsened metrics

Dev dependency count

9

increased by350%

Number of medium supply chain risk alerts

3

increased byInfinity%

Dependency changes

• + Added@markprompt/core@0.4.6(transitive)

• - Removedlit@^2.7.2

• - Removedrehype-sanitize@^5.0.1

• - Removedrehype-stringify@^9.0.3

• - Removedremark-gfm@^3.0.1

• - Removedremark-parse@^10.0.1

• - Removedremark-rehype@^10.1.0

• - Removedunified@^10.1.2

• - Removed@lit-labs/ssr-dom-shim@1.2.1(transitive)

• - Removed@lit/reactive-element@1.6.3(transitive)

• - Removed@markprompt/core@0.4.1(transitive)

• - Removed@types/debug@4.1.12(transitive)

• - Removed@types/hast@2.3.10(transitive)

• - Removed@types/mdast@3.0.15(transitive)

• - Removed@types/ms@0.7.34(transitive)

• - Removed@types/parse5@6.0.3(transitive)

• - Removed@types/trusted-types@2.0.7(transitive)

• - Removed@types/unist@2.0.11(transitive)

• - Removedbail@2.0.2(transitive)

• - Removedccount@2.0.1(transitive)

• - Removedcharacter-entities@2.0.2(transitive)

• - Removedcharacter-entities-html4@2.1.0(transitive)

• - Removedcharacter-entities-legacy@3.0.0(transitive)

• - Removedcomma-separated-tokens@2.0.3(transitive)

• - Removeddebug@4.4.0(transitive)

• - Removeddecode-named-character-reference@1.0.2(transitive)

• - Removeddequal@2.0.3(transitive)

• - Removeddiff@5.2.0(transitive)

• - Removedescape-string-regexp@5.0.0(transitive)

• - Removedextend@3.0.2(transitive)

• - Removedhast-util-from-parse5@7.1.2(transitive)

• - Removedhast-util-parse-selector@3.1.1(transitive)

• - Removedhast-util-raw@7.2.3(transitive)

• - Removedhast-util-sanitize@4.1.0(transitive)

• - Removedhast-util-to-html@8.0.4(transitive)

• - Removedhast-util-to-parse5@7.1.0(transitive)

• - Removedhast-util-whitespace@2.0.1(transitive)

• - Removedhastscript@7.2.0(transitive)

• - Removedhtml-void-elements@2.0.1(transitive)

• - Removedis-buffer@2.0.5(transitive)

• - Removedis-plain-obj@4.1.0(transitive)

• - Removedkleur@4.1.5(transitive)

• - Removedlit@2.8.0(transitive)

• - Removedlit-element@3.3.3(transitive)

• - Removedlit-html@2.8.0(transitive)

• - Removedlongest-streak@3.1.0(transitive)

• - Removedmarkdown-table@3.0.4(transitive)

• - Removedmdast-util-definitions@5.1.2(transitive)

• - Removedmdast-util-find-and-replace@2.2.2(transitive)

• - Removedmdast-util-from-markdown@1.3.1(transitive)

• - Removedmdast-util-gfm@2.0.2(transitive)

• - Removedmdast-util-gfm-autolink-literal@1.0.3(transitive)

• - Removedmdast-util-gfm-footnote@1.0.2(transitive)

• - Removedmdast-util-gfm-strikethrough@1.0.3(transitive)

• - Removedmdast-util-gfm-table@1.0.7(transitive)

• - Removedmdast-util-gfm-task-list-item@1.0.2(transitive)

• - Removedmdast-util-phrasing@3.0.1(transitive)

• - Removedmdast-util-to-hast@12.3.0(transitive)

• - Removedmdast-util-to-markdown@1.5.0(transitive)

• - Removedmdast-util-to-string@3.2.0(transitive)

• - Removedmicromark@3.2.0(transitive)

• - Removedmicromark-core-commonmark@1.1.0(transitive)

• - Removedmicromark-extension-gfm@2.0.3(transitive)

• - Removedmicromark-extension-gfm-autolink-literal@1.0.5(transitive)

• - Removedmicromark-extension-gfm-footnote@1.1.2(transitive)

• - Removedmicromark-extension-gfm-strikethrough@1.0.7(transitive)

• - Removedmicromark-extension-gfm-table@1.0.7(transitive)

• - Removedmicromark-extension-gfm-tagfilter@1.0.2(transitive)

• - Removedmicromark-extension-gfm-task-list-item@1.0.5(transitive)

• - Removedmicromark-factory-destination@1.1.0(transitive)

• - Removedmicromark-factory-label@1.1.0(transitive)

• - Removedmicromark-factory-space@1.1.0(transitive)

• - Removedmicromark-factory-title@1.1.0(transitive)

• - Removedmicromark-factory-whitespace@1.1.0(transitive)

• - Removedmicromark-util-character@1.2.0(transitive)

• - Removedmicromark-util-chunked@1.1.0(transitive)

• - Removedmicromark-util-classify-character@1.1.0(transitive)

• - Removedmicromark-util-combine-extensions@1.1.0(transitive)

• - Removedmicromark-util-decode-numeric-character-reference@1.1.0(transitive)

• - Removedmicromark-util-decode-string@1.1.0(transitive)

• - Removedmicromark-util-encode@1.1.0(transitive)

• - Removedmicromark-util-html-tag-name@1.2.0(transitive)

• - Removedmicromark-util-normalize-identifier@1.1.0(transitive)

• - Removedmicromark-util-resolve-all@1.1.0(transitive)

• - Removedmicromark-util-sanitize-uri@1.2.0(transitive)

• - Removedmicromark-util-subtokenize@1.1.0(transitive)

• - Removedmicromark-util-symbol@1.1.0(transitive)

• - Removedmicromark-util-types@1.1.0(transitive)

• - Removedmri@1.2.0(transitive)

• - Removedms@2.1.3(transitive)

• - Removedparse5@6.0.1(transitive)

• - Removedproperty-information@6.5.0(transitive)

• - Removedrehype-sanitize@5.0.1(transitive)

• - Removedrehype-stringify@9.0.4(transitive)

• - Removedremark-gfm@3.0.1(transitive)

• - Removedremark-parse@10.0.2(transitive)

• - Removedremark-rehype@10.1.0(transitive)

• - Removedsade@1.8.1(transitive)

• - Removedspace-separated-tokens@2.0.2(transitive)

• - Removedstringify-entities@4.0.4(transitive)

• - Removedtrim-lines@3.0.1(transitive)

• - Removedtrough@2.2.0(transitive)

• - Removedunified@10.1.2(transitive)

• - Removedunist-util-generated@2.0.1(transitive)

• - Removedunist-util-is@5.2.1(transitive)

• - Removedunist-util-position@4.0.4(transitive)

• - Removedunist-util-stringify-position@3.0.3(transitive)

• - Removedunist-util-visit@4.1.2(transitive)

• - Removedunist-util-visit-parents@5.1.3(transitive)

• - Removeduvu@0.5.6(transitive)

• - Removedvfile@5.3.7(transitive)

• - Removedvfile-location@4.1.0(transitive)

• - Removedvfile-message@3.1.4(transitive)

• - Removedweb-namespaces@2.0.1(transitive)

• - Removedzwitch@2.0.4(transitive)

• Updated@markprompt/core@0.4.6