@webflow/webflow-cli 1.6.6 → 1.6.7

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @webflow/webflow-cli
 
+## 1.6.7
+
+### Patch Changes
+
+- Fix global CSS selectors still present on DevLink files even if user opts out
+
 ## 1.6.6
 
 ### Patch Changes

package/dist/index.js

@@ -1011,7 +1011,7 @@ ${s.message}`,s}},Fsi={loadJs:Ssi,loadJsSync:Emt,loadJson:Tsi,loadYaml:ksi};V_e.
 .w-icon-file-upload-icon:before {
   content: "\\e903";
 }
-`;function lHn(e,r,i){if(e.type==="Rule"&&(e.prelude.type==="SelectorList"&&(e.prelude.children=new t2().fromArray(e.prelude.children.toArray().filter(s=>{var c;return["ClassSelector","AttributeSelector","IdSelector"].includes((c=s==null?void 0:s.children)==null?void 0:c.first.type)}))),e.prelude.children.toArray().length===0&&i)){i.remove(r);return}}var Sot=e=>({name:"global",css:{__bootflow:{rule:e}},module:!1});function kot(e){if(e8.log(epe("Detected skipTagSelectors flag is enabled. Skipping global CSS tags.")),!e)return Sot("");let r=M4e(e==null?void 0:e.css,!0);try{let i=Cot(r);Aot(i,{enter:lHn});let s=Tot.default.format([wot(i),cHn].join(`
+`;function lHn(e,r,i){let s=["ClassSelector","AttributeSelector","IdSelector"],c=["type"];if(e.type==="Rule"&&(e.prelude.type==="SelectorList"&&(e.prelude.children=new t2().fromArray(e.prelude.children.toArray().filter(l=>{var h;let p="children"in l?(h=l.children)==null?void 0:h.first:null;return!p||!s.includes(p.type)?!1:p.type==="AttributeSelector"?!c.includes(p.name.name):!0}))),e.prelude.children.toArray().length===0&&i)){i.remove(r);return}}var Sot=e=>({name:"global",css:{__bootflow:{rule:e}},module:!1});function kot(e){if(e8.log(epe("Detected skipTagSelectors flag is enabled. Skipping global CSS tags.")),!e)return Sot("");let r=M4e(e==null?void 0:e.css,!0);try{let i=Cot(r);Aot(i,{enter:lHn});let s=Tot.default.format([wot(i),cHn].join(`
 
 `).trim(),{parser:"css"});return Sot(s)}catch{return e8.log(PN("There was a problem skipping global tags from CSS. Falling back to normal global CSS.")),e}}function Fot(e){return e.reduce((r,i)=>(i.name==="global"?r.globalCss=i:r.rest.push(i),r),{rest:[]})}var MS=class extends Error{constructor(r){super(r)}},tCe=e=>e8.render({text:`${tpe("Something went wrong while trying to export your components:")} ${MA.red(e.message)}
   ${e==null?void 0:e.stack}`});function Pot(e){if(e.status>=200&&e.status<300){switch(e.status){case 206:e8.log(PN("You exceeded the limit of components and some components were not exported."));break;case 207:e8.log(PN("Certain components couldn't be exported due to an unexpected error."));break}return}switch(e.status){case 400:throw new MS("Something unexpected happened. Report a bug here: https://airtable.com/shr47EWPVsV9xCwOH");case 401:throw new MS("Your access token is invalid for the provided siteId. Double check your configs in your .webflowrc configuration file.");case 404:throw new MS("You're not currently enrolled in the DevLink beta. You can apply for access here: https://webflow.com/devlink");default:throw new MS("Something went wrong. Try again later or report a bug here: https://airtable.com/shr47EWPVsV9xCwOH")}}async function pHn(e){try{let{siteId:r,host:i,authToken:s,components:c,cssModules:l}=e,p=new URLSearchParams({cssModules:l?"true":"false"});c&&p.append("components",encodeURIComponent(c));let h=`?${p.toString()}`,g=await IN(`${i}/devlink/${r}${h}`,{headers:{Authorization:`Bearer ${s}`},timeout:6e4});Pot(g);let v=await g.json();return v.components||v}catch(r){if(r instanceof MS)tCe(r),process.exit(1);else throw r}}async function dHn(e){try{let{siteId:r,host:i,authToken:s}=e,c=await IN(`${i}/devlink/${r}/engine`,{headers:{Authorization:`Bearer ${s}`},timeout:6e4});return Pot(c),await c.json()}catch(r){if(r instanceof MS)tCe(r),process.exit(1);else throw r}}async function rCe(e){let{rootDir:r}=e;e8.render({text:`Exporting components into ${e.rootDir}.`,showSpinner:!0});try{let[i,s]=await Promise.all([pHn(e),dHn(e)]),c=s;if(e.skipTagSelectors===!0){let{rest:l,globalCss:p}=Fot(i),h=kot(p);c.push(...l,h)}else c.push(...i);await OUe(c,e),e8.render({text:epe(`Succesfully exported components into ${r} folder.`),flushLogs:!0})}catch(i){i instanceof Error&&(tCe(i),FK(i))}}async function Not(e){cit();let r={...e&&e.length>0?{components:_be(e),overwriteModule:!1}:{overwriteModule:!0}},i=await ape(r);if(!i)return Oot.default.exit();await rCe(i)}var l2t=ol(require("http"));var p2t=ol($ut()),d2t=require("fs"),f2t=ol(require("path")),h2t=require("commander");var Qmt=ol(Udt()),lTe=require("commander"),Q_e=require("fs");var zmt=ol(Vmt()),Kmt=require("commander"),J_e=async(e,r)=>{let i=await toi(r);return{filepath:i.filepath,config:{publicDir:e,...i.config}}},toi=async e=>{let i=await(0,zmt.cosmiconfig)("webflow",{searchPlaces:[e]}).search();return i||Kmt.program.error(`No ${e} file was found. Run this command within your extension folder.`),i};var Zmt=ol(Xmt()),X_e=ol(require("path")),coi=5*1024*1024,loi=new Set(["application/javascript","application/json","application/xml","image/png","image/jpeg","image/gif","image/svg+xml","image/webp","image/vnd.microsoft.icon","image/x-icon","video/webm","font/ttf","font/otf","font/woff","font/woff2","text/plain","text/markdown","text/html","text/css"]),e2t=async(e,r,i)=>{let{config:s,filepath:c}=await J_e(e,r),l=X_e.join(c,".."),p=!0,h=!1,g=b=>{let E=b.name,S=Zmt.default.lookup(E);return E==="index.html"&&(h=!0),E&&E.endsWith(".DS_Store")||!S?!1:loi.has(S)?b:(console.log(`Invalid file type: ${S} for file: ${E}`),p=!1,!1)},v=b=>{(0,Q_e.unlink)(i,E=>{E&&console.error(`Failed to delete file: ${E}`),lTe.program.error(b)})};return console.log(`Packaging the contents of the ${s.publicDir} folder into ${i}...`),new Promise(b=>{let E=(0,Qmt.default)("zip",{zlib:{level:9}}),S=(0,Q_e.createWriteStream)(X_e.join(l,i));S.on("close",()=>{b(void 0)}),E.directory(X_e.join(l,s.publicDir),!1,g),E.file(c,{name:r}),E.pipe(S),E.finalize(),E.on("warning",w=>{console.log(w)}),E.on("error",w=>{lTe.program.error(w.message)}),E.on("finish",()=>{if(!h){v("Could not find index.html in your `publicDir`, all Designer Extension code needs to be inside of `publicDir`");return}if(!p){v("Bundling failed due to invalid file types");return}if(!E.pointer()||E.pointer()===0){v("Bundling failed with no output");return}if(E.pointer()>=coi){v("Bundling failed due to the bundle exceeding 5MB");return}console.log(`${E.pointer()} total bytes written`),console.log(`Done! ${i} is ready for you to upload to your Webflow app.`)})})};var iT=ol(require("fs")),y8=ol(require("path"));var lae="webflow.json",t2t="index.html",r2t="bundle.zip",pTe="public",dTe="scaffolds",Z_e="default",n2t="./";var i2t="package.json",a2t="wf-placeholder-name",fTe=e=>JSON.stringify(e,null,2),s2t=e=>{let r="\u2500".repeat(e.length+2);return"\u256D"+r+`\u256E

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webflow/webflow-cli",
-  "version": "1.6.6",
+  "version": "1.6.7",
   "license": "SEE LICENSE IN LICENSE",
   "bin": {
     "webflow": "./dist/index.js"

package/dist/scaffolds/default/README.md

@@ -1,24 +0,0 @@
-# Designer Extension Starter: TypeScript
-
-This is an example Webflow Designer extension written in TypeScript that inserts a text emoji into an element selected within the Designer. Check out our [documentation](https://docs.developers.webflow.com/v2.0.0/docs/create-a-designer-extensions) for in-depth information about Designer Extension features and API.
-
-## Developing
-
-```
-$ npm run dev
-```
-
-The above command does a few things:
-* Installs dependencies
-* Watches for changes in the `src/` folder and recompiles your TypeScript files, outputting an `index.js` file under the `public/` folder
-* Spins up a process that serves your extension files from under `public/`
-
-The command outputs the URL under which your extension is being served. Use this as the “Development URL” for your app in the Webflow Designer’s Apps panel. You can then launch the extension from the same place.
-
-## Deploying
-
-```
-$ npm run build
-```
-
-This will take the contents of the `./public` folder and prepare a `bundle.zip` file ready for you to upload as a Designer extension for your App.

package/dist/scaffolds/default/package.json

@@ -1,15 +0,0 @@
-{
-  "name": "wf-placeholder-name",
-  "version": "1.0.0",
-  "private": true,
-  "main": "index.js",
-  "scripts": {
-    "build": "npm install && tsc -p tsconfig.json && webflow extension bundle",
-    "dev": "npm install && concurrently -r \"webflow extension serve\" \"tsc -p tsconfig.json --watch --preserveWatchOutput\""
-  },
-  "devDependencies": {
-    "@webflow/designer-extension-typings": "*",
-    "concurrently": "*",
-    "typescript": "*"
-  }
-}

package/dist/scaffolds/default/public/index.html

@@ -1,21 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link href="./styles.css" rel="stylesheet" />
-  </head>
-
-  <body>
-    <form id="extension-form">
-      <div>Choose a text element and select the emoji to insert</div>
-      <div id="emoji-container">
-        <button id="smile">😊</button>
-        <button id="wink">😉</button>
-        <button id="heart">😍</button>
-        <button id="cry">😭</button>
-      </div>
-    </form>
-
-    <script src="index.js" defer></script>
-  </body>
-</html>

package/dist/scaffolds/default/public/styles.css

@@ -1,35 +0,0 @@
-body {
-  margin: 0;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-}
-
-form {
-  padding: 16px;
-  font-family: sans-serif;
-  text-align: center;
-  color: #fff;
-}
-
-button {
-  color: #fff;
-  background: #0073e6;
-  padding: 4px 8px;
-  border: 2px solid #0073e6;
-  border-radius: 4px;
-}
-
-button:focus {
-  outline: none;
-  border-color: #1280ee;
-}
-
-label > input[type="radio"] {
-  visibility: hidden;
-}
-
-#emoji-container {
-  margin-top: 1.5rem;
-}

package/dist/scaffolds/default/src/index.ts

@@ -1,73 +0,0 @@
-const emojiMap = {
-  smile: "😊",
-  wink: "😉",
-  heart: "😍",
-  cry: "😭",
-};
-
-// default to smile
-let selectedEmoji = emojiMap.smile;
-addButtonListeners();
-
-document.getElementById("extension-form").onsubmit = async (event) => {
-  event.preventDefault();
-
-  // Get the current selected Element
-  const el = await webflow.getSelectedElement();
-
-  // If styles can be set on the Element
-  if (el && el.styles && el.configurable && el.children) {
-    //Get current element's style
-    const currentStyle = await el.getStyles();
-
-    // Get style
-    const emojiStyle = await createOrUseStyle("emoji-style");
-
-    // Create a new element that will display the text-emoji
-    const labelElement = await webflow.createDOM("span");
-    labelElement.setStyles([...currentStyle, emojiStyle]);
-    labelElement.setTextContent(selectedEmoji);
-
-    el.setChildren([...el.getChildren(), labelElement]);
-    await el.save();
-  } else {
-    alert("Please select a text element");
-  }
-};
-
-// Check if specified style exists. If not, create a new style
-async function createOrUseStyle(styleName) {
-  // Check if this style exists to avoid duplicate styles
-  const style = await webflow.getStyleByName(styleName);
-  if (style) {
-    // Return existing style
-    return style;
-  } else {
-    // Create a new style, return it
-    const emojiStyle = webflow.createStyle(styleName);
-    emojiStyle.setProperties({ "background-color": "#FF00FF" });
-    return emojiStyle;
-  }
-}
-
-function handleEmojiClick(emoji) {
-  selectedEmoji = emoji;
-}
-
-function addButtonListeners() {
-  document.getElementById("smile").onclick = () => {
-    handleEmojiClick(emojiMap.smile);
-  };
-
-  document.getElementById("wink").onclick = () => {
-    handleEmojiClick(emojiMap.wink);
-  };
-
-  document.getElementById("heart").onclick = () => {
-    handleEmojiClick(emojiMap.heart);
-  };
-
-  document.getElementById("cry").onclick = () => {
-    handleEmojiClick(emojiMap.cry);
-  };
-}

package/dist/scaffolds/default/tsconfig.json

@@ -1,8 +0,0 @@
-{
-  "compilerOptions": {
-    "outDir": "public",
-    "target": "es6",
-    "lib": ["es6", "dom"],
-    "typeRoots": ["./node_modules/@types", "./node_modules/@webflow"]
-  }
-}

package/dist/scaffolds/default/webflow.json

@@ -1,5 +0,0 @@
-{
-  "name": "wf-placeholder-name",
-  "publicDir": "public",
-  "size": "default"
-}

package/dist/scaffolds/react/README.md

@@ -1,19 +0,0 @@
-# Designer Extension Starter: React
-
-Explore the [documentation](https://docs.developers.webflow.com/v2.0.0/docs/create-a-designer-extensions) for detailed information on Designer Extension features and API.
-
-## Local Development
-
-```bash
-npm run dev
-```
-
-This command installs dependencies, watches for changes in the `src/` folder, and serves your extension files from `./dist/`. Use the displayed URL as the "Development URL" in Webflow Designer's Apps panel to launch your extension.
-
-## Build for Distribution
-
-```bash
-npm run build
-```
-
-This command prepares a `${bundleFile}` in the `./dist/` folder. Upload this `bundle.zip` file for distributing the App inside of your workspace or via the Marketplace.

package/dist/scaffolds/react/package.json

@@ -1,28 +0,0 @@
-{
-  "name": "wf-placeholder-name",
-  "version": "1.0.0",
-  "scripts": {
-    "dev": "npm install && concurrently \"webflow extension serve\" \"npm run watch-webpack\"",
-    "build": "npm run build-webpack && webflow extension bundle",
-    "watch-webpack": "webpack --config webpack.config.mjs --mode development --watch",
-    "build-webpack": "webpack --config webpack.config.mjs --mode production"
-  },
-  "devDependencies": {
-    "@babel/preset-env": "^7.23.2",
-    "@babel/preset-react": "^7.22.15",
-    "@webflow/designer-extension-typings": "*",
-    "concurrently": "*",
-    "babel-loader": "^9.1.3",
-    "webpack": "^5.89.0",
-    "webpack-cli": "^5.1.4"
-  },
-  "dependencies": {
-    "react-dom": "^18.2.0"
-  },
-  "babel": {
-    "presets": [
-      "@babel/preset-env",
-      "@babel/preset-react"
-    ]
-  }
-}

package/dist/scaffolds/react/public/index.html

@@ -1,13 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <title>My React App</title>
-    <link href="./styles.css" rel="stylesheet" />
-  </head>
-
-  <body>
-    <div id="root"></div>
-    <script src="./bundle.js"></script>
-  </body>
-</html>

package/dist/scaffolds/react/public/styles.css

@@ -1,23 +0,0 @@
-body {
-    margin: 0;
-    background: #333;
-    color: white;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-  }
-  
-  button {
-    color: #fff;
-    background: #0073e6;
-    padding: 4px 8px;
-    border: 2px solid #0073e6;
-    border-radius: 4px;
-  }
-  
-  button:focus {
-    outline: none;
-    border-color: #1280ee;
-  }
-  

package/dist/scaffolds/react/src/main.js

@@ -1,27 +0,0 @@
-import React from "react";
-import ReactDOM from "react-dom";
-
-const App = () => {
-  const addText = async () => {
-    // Get the current selected Element
-    let el = await webflow.getSelectedElement();
-
-    // If text content can be set, update it!
-    if (el && el.configurable && el.setTextContent) {
-      el.setTextContent("hello world!");
-      await el.save();
-    } else {
-      alert("Please select a text element");
-    }
-  };
-
-  return (
-    <div>
-      <h1>Welcome to My React App!</h1>
-      <p>This is a basic React application.</p>
-      <button onClick={addText}> Add text </button>
-    </div>
-  );
-};
-
-ReactDOM.render(<App />, document.getElementById("root"));

package/dist/scaffolds/react/webflow.json

@@ -1,5 +0,0 @@
-{
-  "name": "wf-placeholder-name",
-  "publicDir": "public",
-  "size": "default"
-}

package/dist/scaffolds/react/webpack.config.mjs

@@ -1,33 +0,0 @@
-import path from "path";
-import { fileURLToPath } from "url";
-
-const filename = fileURLToPath(import.meta.url);
-const dirname = path.dirname(filename);
-
-export default {
-  entry: "./src/main.js",
-  output: {
-    filename: "bundle.js",
-    path: path.resolve(dirname, "public"),
-  },
-  module: {
-    rules: [
-      {
-        test: /\.js$/,
-        exclude: /node_modules/,
-        use: {
-          loader: "babel-loader",
-        },
-      },
-      {
-        test: /\.css$/,
-        use: ["style-loader", "css-loader"],
-      },
-    ],
-  },
-  devServer: {
-    static: [{ directory: path.join(dirname, "public") }],
-    compress: true,
-    port: 3000,
-  },
-};

package/dist/scaffolds/typescript-alt/README.md

@@ -1,19 +0,0 @@
-# Designer Extension Starter: TypeScript (Alt)
-
-Explore the [documentation](https://docs.developers.webflow.com/v2.0.0/docs/create-a-designer-extensions) for in-depth information about Designer Extension features and API.
-
-## Development
-
-```bash
-npm run dev
-```
-
-This command installs dependencies, watches for changes in the `src/` folder, recompiles TypeScript files, and serves your extension files from `${defaultPublicDir}/`. Use the displayed URL as the "Development URL" in Webflow Designer's Apps panel to launch your extension.
-
-## Deployment
-
-```bash
-npm run build
-```
-
-This command prepares a `${bundleFile}` in the `./public` folder. Upload this `bundle.zip` file for distributing the App inside of your workspace or via the Marketplace.

package/dist/scaffolds/typescript-alt/package.json

@@ -1,15 +0,0 @@
-{
-  "name": "wf-placeholder-name",
-  "version": "1.0.0",
-  "private": true,
-  "main": "index.js",
-  "scripts": {
-    "build": "npm install && tsc -p tsconfig.json && webflow extension bundle",
-    "dev": "npm install && concurrently -r \"webflow extension serve\" \"tsc -p tsconfig.json --watch --preserveWatchOutput\""
-  },
-  "devDependencies": {
-    "@webflow/designer-extension-typings": "*",
-    "concurrently": "*",
-    "typescript": "*"
-  }
-}

package/dist/scaffolds/typescript-alt/public/index.html

@@ -1,9 +0,0 @@
-<link href="styles.css" rel="stylesheet" />
-<form id="lorem">
-  <div>
-    Select a textual element in the Designer and press the button below to give
-    it some placeholder content.
-  </div>
-  <button>Lorem ipsum</button>
-</form>
-<script src="index.js"></script>

package/dist/scaffolds/typescript-alt/public/styles.css

@@ -1,35 +0,0 @@
-body {
-  margin: 0;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-}
-
-form {
-  padding: 16px;
-  font-family: sans-serif;
-  text-align: center;
-  color: #fff;
-}
-
-button {
-  color: #fff;
-  background: #0073e6;
-  padding: 4px 8px;
-  border: 2px solid #0073e6;
-  border-radius: 4px;
-}
-
-button:focus {
-  outline: none;
-  border-color: #1280ee;
-}
-
-label > input[type="radio"] {
-  visibility: hidden;
-}
-
-#emoji-container {
-  margin-top: 1.5rem;
-}

package/dist/scaffolds/typescript-alt/src/index.ts

@@ -1,11 +0,0 @@
-document.getElementById("lorem")!.onsubmit = async (event) => {
-  event.preventDefault();
-  const el = await webflow.getSelectedElement();
-  if (el && el.textContent) {
-    el.setTextContent(
-      "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do " +
-        "eiusmod tempor incididunt ut labore et dolore magna aliqua.",
-    );
-    el.save();
-  }
-};

package/dist/scaffolds/typescript-alt/tsconfig.json

@@ -1,8 +0,0 @@
-{
-  "compilerOptions": {
-    "outDir": "public",
-    "target": "es6",
-    "lib": ["es6", "dom"],
-    "typeRoots": ["./node_modules/@types", "./node_modules/@webflow"]
-  }
-}

package/dist/scaffolds/typescript-alt/webflow.json

@@ -1,5 +0,0 @@
-{
-    "name": "wf-placeholder-name",
-    "publicDir": "public",
-    "size": "comfortable"
-}