purgetss 3.0.5 → 3.1.3

package/README.md

@@ -19,15 +19,16 @@
 ------
 
 ## Some key features of PurgeTSS
-- Provides more than 7600 [Tailwind-like utility classes](https://tailwindcss.com/) ready to use in your projects.
+- Provides more than 8400 [Tailwind-like utility classes](https://tailwindcss.com/) ready to use in your projects.
 - Creates a clean `app.tss` file with only the classes used in your project by parsing all your XML files.
 - You can customize any of the default classes through a simple configuration file, or you can create new *just-in-time* classes with arbitrary values within the `Views`.
-- You can easily use Font Awesome, Material Design, Lineicons, Boxicons, Tabler Icons and Framework7-Icons fonts in `Buttons` and `Labels`.
+- You can easily use Font Awesome, Material Design, Lineicons, Boxicons, Tabler Icons, Framework7-Icons and Bootstrap Icons fonts in `Buttons` and `Labels`.
 - Includes an Animation module to apply a 2D Matrix animation or transformation to any element or to an `Array` of elements.
 - Includes a simple two-dimensional Grid System to align and distribute elements in your views.
 
 ## List of available classes
 - [tailwind.tss](https://github.com/macCesar/purgeTSS/blob/master/dist/tailwind.tss)
+- [bootstrapicons.tss](https://github.com/macCesar/purgeTSS/blob/master/dist/bootstrapicons.tss)
 - [boxicons.tss](https://github.com/macCesar/purgeTSS/blob/master/dist/boxicons.tss)
 - [fontawesome.tss](https://github.com/macCesar/purgeTSS/blob/master/dist/fontawesome.tss)
 - [framework7icons.tss](https://github.com/macCesar/purgeTSS/blob/master/dist/framework7icons.tss)
@@ -270,10 +271,10 @@ Use **`purgetss module`** command to install the `purgetss.ui.js` module in your
 If you want to create a new Alloy Project with `purgetss` ready to go, use the `create` command.
 
 ```bash
-> purgetss create 'Name of the Project' [--vendor="fontawesome, materialdesign, lineicons, boxicons, framework7, tablericons"]
+> purgetss create 'Name of the Project' [--vendor="fontawesome, materialdesign, lineicons, boxicons, framework7, tablericons, bootstrapicons"]
 
 # alias:
-> purgetss c 'Name of the Project' [-v=fa,md,li,bx,f7]
+> purgetss c 'Name of the Project' [-v=fa,md,li,bx,f7,ti,bi]
 ```
 
 You need to have `app.idprefix` and `app.idprefix` already configured in `ti config`.
@@ -300,7 +301,7 @@ When you run `purgetss create 'Name of the Project'` it will execute the followi
 - **`alloy new`** To convert it to an Alloy Project.
 - **`purgetss w`** To autorun `purgetss` every time you compile your project.
 - **`purgetss b`** To build a new `./purgetss/tailwind.tss` and `./purgetss/config.js` files.
-- **`[-v=fa,md,li,bx,f7]`** Set the `--vendor` argument to copy the selected fonts into your project. Including the CommonJS module into `./app/lib/` folder.
+- **`[-v=fa,md,li,bx,f7,ti,bi]`** Set the `--vendor` argument to copy the selected fonts into your project. Including the CommonJS module into `./app/lib/` folder.
 - **`code .`**, **`subl .`** or **`open .`** It will use either one of these commands to open `VS Code`, `Sublime Text` or the project’s folder in that order.
 
 ## fonts
@@ -311,8 +312,10 @@ When you run `purgetss create 'Name of the Project'` it will execute the followi
 > purgetss f
 ```
 
-Use this command to copy the free versions of [Boxicons](https://boxicons.com), [Font Awesome](https://github.com/FortAwesome/Font-Awesome/tree/master/js-packages/%40fortawesome/fontawesome-free/webfonts), [Framework7 Icons](https://framework7.io/icons/), [LineIcons](https://lineicons.com/icons/?type=free), [Material Design Icons](https://github.com/google/material-design-icons) and [Tabler Icons](https://tabler-icons.io) Fonts into your `app/assets/fonts` folder. With their names fixed to work in iOS or Android.
+Use this command to copy the free versions of [Boxicons](https://boxicons.com), [Font Awesome](https://github.com/FortAwesome/Font-Awesome/tree/master/js-packages/%40fortawesome/fontawesome-free/webfonts), [Framework7 Icons](https://framework7.io/icons/), [LineIcons](https://lineicons.com/icons/?type=free), [Material Design Icons](https://github.com/google/material-design-icons), [Tabler Icons](https://tabler-icons.io) and [Bootstrap Icons](https://icons.getbootstrap.com) Fonts into your `app/assets/fonts` folder. With their names fixed to work in iOS or Android.
 
+> bootstrap-icons.ttf
+>
 > boxicons.ttf
 >
 > FontAwesome5Brands-Regular.ttf
@@ -351,38 +354,58 @@ After copying the desired fonts, you can use them in Buttons and Labels, just se
 ```xml
 <Alloy>
   <Window>
-    <View class="vertical">
-      <!-- FontAwesome -->
-      <Label class="mt-2 text-gray-700" text="FontAwesome" />
-      <Label class="text-xl text-blue-500 fa fa-home" />
-      <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded fa fa-home" />
-
-      <!-- Material Design -->
-      <Label class="mt-2 text-gray-700" text="Material Design" />
-      <Label class="text-xl text-blue-500 md md-home" />
-      <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded md md-home" />
-
-      <!-- LineIcons -->
-      <Label class="mt-2 text-gray-700" text="LineIcons" />
-
-      <Label class="text-xl text-blue-500 lni lni-delivery" />
-      <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded lni lni-delivery" />
-
-      <!-- Boxicons -->
-      <Label class="mt-2 text-gray-700" text="Boxicons" />
-      <Label class="text-xl text-blue-500 bx bx-home" />
-      <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded bx bx-home" />
-
-      <!-- Framework7-Icons -->
-      <Label class="mt-2 text-gray-700" text="Framework7-Icons" />
-      <Label class="text-xl text-blue-500 f7 f7-house" />
-      <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded f7 f7-house" />
-
-      <!-- Tabler-Icons -->
-      <Label class="mt-2 text-gray-700" text="Tabler-Icons" />
-      <Label class="text-xl text-blue-500 ti ti-home" />
-      <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded ti ti-home" />
-    </View>
+    <ScrollView>
+      <View class="grid">
+        <View class="grid-cols-2 mx-auto gap-y-2 vertical">
+          <!-- FontAwesome -->
+          <Label class="mt-2 text-gray-700" text="FontAwesome" />
+          <Label class="text-xl text-blue-500 fa fa-home" />
+          <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded fa fa-home" />
+        </View>
+
+        <View class="grid-cols-2 mx-auto gap-y-2 vertical">
+          <!-- Material Design -->
+          <Label class="mt-2 text-gray-700" text="Material Design" />
+          <Label class="text-xl text-blue-500 md md-home" />
+          <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded md md-home" />
+        </View>
+
+        <View class="grid-cols-2 mx-auto gap-y-2 vertical">
+          <!-- LineIcons -->
+          <Label class="mt-2 text-gray-700" text="LineIcons" />
+          <Label class="text-xl text-blue-500 lni lni-delivery" />
+          <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded lni lni-delivery" />
+        </View>
+
+        <View class="grid-cols-2 mx-auto gap-y-2 vertical">
+          <!-- Boxicons -->
+          <Label class="mt-2 text-gray-700" text="Boxicons" />
+          <Label class="text-xl text-blue-500 bx bx-home" />
+          <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded bx bx-home" />
+        </View>
+
+        <View class="grid-cols-2 mx-auto gap-y-2 vertical">
+          <!-- Framework7-Icons -->
+          <Label class="mt-2 text-gray-700" text="Framework7-Icons" />
+          <Label class="text-xl text-blue-500 f7 f7-house" />
+          <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded f7 f7-house" />
+        </View>
+
+        <View class="grid-cols-2 mx-auto gap-y-2 vertical">
+          <!-- Tabler-Icons -->
+          <Label class="mt-2 text-gray-700" text="Tabler-Icons" />
+          <Label class="text-xl text-blue-500 ti ti-home" />
+          <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded ti ti-home" />
+        </View>
+
+        <View class="grid-cols-2 mx-auto gap-y-2 vertical">
+          <!-- Bootstrap Icons -->
+          <Label class="mt-2 text-gray-700" text="Bootstrap Icons" />
+          <Label class="text-xl text-blue-500 bi bi-house-fill" />
+          <Button class="w-10 h-10 my-1 text-xl text-white bg-blue-500 rounded bi bi-house-fill" />
+        </View>
+      </View>
+    </ScrollView>
   </Window>
 </Alloy>
 ```
@@ -392,20 +415,23 @@ After copying the desired fonts, you can use them in Buttons and Labels, just se
 // Created by César Estrada
 // https://github.com/macCesar/purgeTSS
 
-// Tailwind styles
+// Main styles
 'View': { width: Ti.UI.SIZE, height: Ti.UI.SIZE }
 'Window': { backgroundColor: '#ffffff' }
 '.bg-blue-500': { backgroundColor: '#3b82f6' }
 '.rounded': { borderRadius: 4 }
 '.text-xl': { font: { fontSize: 20 } }
+'.gap-y-2': { top: 8, bottom: 8 }
+'.grid': { layout: 'horizontal' }
+'.grid-cols-2': { width: '50%' }
 '.h-10': { height: 40 }
-'.keep-screen-on[platform=android]': { keepScreenOn: true }
 '.vertical': { layout: 'vertical' }
 '.my-1': { top: 4, bottom: 4 }
+'.mx-auto': { right: null, left: null }
 '.mt-2': { top: 8 }
 '.text-white': { color: '#ffffff' }
+'.text-gray-700': { color: '#374151' }
 '.text-blue-500': { color: '#3b82f6' }
-'.text-gray-700': { color: '#3f3f46' }
 '.w-10': { width: 40 }
 
 // Default Font Awesome styles
@@ -422,7 +448,7 @@ After copying the desired fonts, you can use them in Buttons and Labels, just se
 
 // BoxIcons styles
 '.bx': { font: { fontFamily: 'boxicons' } }
-'.bx-home': { text: '\ued75', title: '\ued75' }
+'.bx-home': { text: '\ueb12', title: '\ueb12' }
 
 // Framework7 styles
 '.f7': { font: { fontFamily: 'Framework7-Icons' } }
@@ -431,27 +457,32 @@ After copying the desired fonts, you can use them in Buttons and Labels, just se
 // Tabler Icons styles
 '.ti': { font: { fontFamily: 'tabler-icons' } }
 '.ti-home': { text: '\ueac1', title: '\ueac1' }
+
+// Bootstrap Icons styles
+'.bi': { font: { fontFamily: 'bootstrap-icons' } }
+'.bi-house-fill': { text: '\uf424', title: '\uf424' }
 ```
 
 ## Result
-<img src="https://raw.githubusercontent.com/macCesar/purgeTSS/master/assets/images/icon-fonts-tabler.png" width="375" alt="iOS Screen - Icon Fonts">
+<img src="https://raw.githubusercontent.com/macCesar/purgeTSS/master/assets/images/icon-fonts-bootstrap-grid.png" width="375" alt="iOS Screen - Icon Fonts">
 
 ### Copying specific font vendors
 Use any of the following arguments to copy specific vendors:
 
 ```bash
-> purgetss fonts --vendor="fontawesome, materialdesign, lineicons, boxicons, framework7, tablericons"
+> purgetss fonts --vendor="fontawesome, materialdesign, lineicons, boxicons, framework7, tablericons, bootstrapicons"
 
 # alias:
-> purgetss f -v=fa,md,li,bx,f7,ti
+> purgetss f -v=fa,md,li,bx,f7,ti,bi
 ```
 
 Available aliases:
+- bi, bootstrap, bootstrapicons = Bootstrap Icons
 - bx, box, boxicons = BoxIcons
-- li, line, lineicons = LineIcons
+- f7, framework, framework7 = Framework7 Icons
 - fa, font, fontawesome = Font Awesome Icons
+- li, line, lineicons = LineIcons
 - md, material, materialdesign = Material Design Icons
-- f7, framework, framework7 = Framework7 Icons
 - ti, tablericons, tabler = Tabler Icons
 
 ### Copying corresponding CommonJS Modules
@@ -459,22 +490,23 @@ You can use the `--modules` flag to copy the corresponding CommonJS modules into
 
 ```bash
 > purgetss fonts --modules
-> purgetss fonts --modules --vendor="fontawesome, materialdesign, lineicons, boxicons, framework7, tablericons"
+> purgetss fonts --modules --vendor="fontawesome, materialdesign, lineicons, boxicons, framework7, tablericons, bootstrapicons"
 
 # alias:
 > purgetss f -m
-> purgetss f -m -v=fa,md,li,bx,f7,ti
+> purgetss f -m -v=fa,md,li,bx,f7,ti,bi
 ```
 
-Each library contains a CommonJS module exposing the UniCode strings for Font Awesome icons, Material Design Icons, Line Icons Boxicons and Framework7-Icons fonts.
+Each library contains a CommonJS module exposing the UniCode strings for Font Awesome Icons, Material Design Icons, Line Icons, Boxicons, Framework7-Icons and Bootstrap Icons fonts.
 
 All prefixes are stripped out from their class names and are camelCased, for example:
 
-- **Line Icons**: `lni-flag` becomes `flag`
+- **Bootstrap Icons** `bi-alarm-fill` becomes `alarmFill` or `bi-clock-fill` becomes `clockFill`.
 - **Font Awesome**: `fa-flag` becomes `flag`
+- **Framework7 Icons** `f7-alarm_fill` becomes `alarmFill` or `f7-clock_fill` becomes `clockFill`.
+- **Line Icons**: `lni-flag` becomes `flag`
 - **Material Design Icons**: `md-flag` becomes `flag`
 - **Tabler Icons** `ti-flag` becomes `flag` or `ti-cloud-download` becomes `cloudDownload`.
-- **Framework7 Icons** `f7-alarm_fill` becomes `alarmFill` or `f7-clock_fill` becomes `clockFill`.
 - **boxicons** have three sets of icons in the same font file: Regular, Solid and Logos, so we need to keep their prefixes:
 
   - **Regular**: `bx-flag` becomes `bxFlag`

package/bin/purgetss

@@ -24,7 +24,7 @@ program
 program
 	.command('init')
 	.alias('i')
-	.description('Create a `config.js` file for your project')
+	.description('Create a `config.js` file for your project.')
 	.help('Creates a minimal `./purgetss/config.js` file at the root of your project.')
 	.action((args, options, logger) => {
 		purgetss.init();
@@ -35,7 +35,8 @@ program
 	.alias('c')
 	.description('Creates a new Alloy Project with `purgetss` already configured.')
 	.help('Creates a new Alloy Project with `purgetss` already configured.')
-	.option('-v, --vendor <arguments>', 'Use any of the following arguments to copy specific vendors:\n   fa = Font Awesome Icons\n   md = Material Design Icons\n   li = LineIcons\n   bx = Boxicons\n   f7 = Framework7 Icons\n   ti = Tabler Icons')
+	.option('-t, --tailwind', 'To install Tailwind CSS in your project to work with `Tailwind CSS Intellisense`.')
+	.option('-v, --vendor <arguments>', 'Use any of the following arguments to copy specific vendors:\n   fa = Font Awesome Icons\n   md = Material Design Icons\n   li = LineIcons\n   bx = Boxicons\n   f7 = Framework7 Icons\n   ti = Tabler Icons\n   bi = Bootstrap Icons')
 	.argument('<name>', 'The name of the project')
 	.action((args, options, logger) => {
 		purgetss.create(args, options);
@@ -44,7 +45,7 @@ program
 program
 	.command('build')
 	.alias('b')
-	.description('Build a custom `tailwind.tss` file')
+	.description('Build a custom `tailwind.tss` file.')
 	.help('It will generate a new custom `tailwind.tss` file based on the attributes defined in `./purgetss/config.js`.')
 	.action((args, options, logger) => {
 		purgetss.buildCustom();
@@ -53,7 +54,7 @@ program
 program
 	.command('watch')
 	.alias('w')
-	.description('Autorun `purgetss` every time you compile your project')
+	.description('Autorun `purgetss` every time you compile your project.')
 	.help('Use this command if you want `purgetss` to autorun every time you compile your project. This is very useful in combination with `LiveView` because it will purge all your files every time you make a change, for example when adding or deleting styles in your Views.')
 	.option('-o, --off', 'To turn off watch mode.')
 	.action((args, options, logger) => {
@@ -63,9 +64,9 @@ program
 program
 	.command('fonts')
 	.alias('f')
-	.description('Copy Font Awesome icons, Material Design Icons, LineIcons, Boxicons and Framework7-Icons Font files into your project')
-	.help('Command to copy the Free versions of:\n\n   • Font Awesome Icons ( Brands, Regular, Solid )\n   • Material Design Icons\n   • LineIcons\n   • Boxicons\n   • Framework7 Icons\n   • Tabler Icons\n\nInto your projects’s app/assets/fonts/ folder.\n\nWith their names fixed to work with your app whether it is for iOS or for Android.')
-	.option('-v, --vendor <arguments>', 'Use any of the following arguments to copy specific vendors:\n   fa = Font Awesome Icons\n   md = Material Design Icons\n   li = LineIcons\n   bx = Boxicons\n   f7 = Framework7 Icons\n   ti = Tabler Icons')
+	.description('Copy Font Awesome icons, Material Design Icons, LineIcons, Boxicons, Framework7-Icons and Bootstrap Icons Font files into your project.')
+	.help('Command to copy the Free versions of:\n\n   • Font Awesome Icons ( Brands, Regular, Solid )\n   • Material Design Icons\n   • LineIcons\n   • Boxicons\n   • Framework7 Icons\n   • Tabler Icons\n   • Bootstrap Icons\n\nInto your projects’s app/assets/fonts/ folder.\n\nWith their names fixed to work with your app whether it is for iOS or for Android.')
+	.option('-v, --vendor <arguments>', 'Use any of the following arguments to copy specific vendors:\n   fa = Font Awesome Icons\n   md = Material Design Icons\n   li = LineIcons\n   bx = Boxicons\n   f7 = Framework7 Icons\n   ti = Tabler Icons\n   bi = Bootstrap Icons')
 	.option('-m, --modules', 'Use the `--modules` option to also copy the corresponding CommonJS module into `./app/lib/` folder.')
 	.action((args, options, logger) => {
 		purgetss.copyFonts(options);
@@ -83,7 +84,7 @@ program
 program
 	.command('update')
 	.alias('u')
-	.description('Update PurgeTSS to the latest version')
+	.description('Update PurgeTSS to the latest version.')
 	.help('Run auto-update regularly!\n\nWe constantly update PurgeTSS to add new features, to include the latest versions of Tailwind and for bug fixes.')
 	.action((args, options, logger) => {
 		logger.info(`${purgetss.colores.purgeLabel} Updating PurgeTSS to the latest version...`);