@freightos/icons 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Freightos
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,387 @@
+# Freightos Icons
+
+A comprehensive icon library with 213 SVG icons designed for Freightos applications. Built with React, TypeScript, and developer experience in mind.
+
+## Features
+
+- 🎨 **213 Icons** - Complete set of professionally designed icons
+- 📦 **Tree-shakeable** - Import only what you need
+- 🔷 **TypeScript First** - Full type definitions included
+- ⚡ **Dual Format** - Both ESM and CJS builds included
+- 🎯 **Flexible Sizing** - Size with numbers, strings, or CSS classes
+- 🎨 **Themeable** - Uses `currentColor` by default for easy theming
+- ♿ **Accessible** - Proper ARIA support via SVG props
+- 🪶 **Lightweight** - Individual icons are tiny
+- ⚛️ **React 16.8+** - Works with hooks and modern React
+
+## Installation
+
+```bash
+npm install @freightos/icons
+# or
+yarn add @freightos/icons
+# or
+pnpm add @freightos/icons
+```
+
+## Usage Guide
+
+### Basic Usage
+
+Import icons directly from the package:
+
+```tsx
+import { IconSearch, IconUser, IconDashboard } from '@freightos/icons';
+
+function MyComponent() {
+  return (
+    <div>
+      <IconSearch size={24} />
+      <IconUser color="blue" />
+      <IconDashboard className="my-icon" />
+    </div>
+  );
+}
+```
+
+### Props
+
+All icons accept the following props:
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `size` | `number \| string` | `'1em'` | Width and height of the icon |
+| `color` | `string` | `'currentColor'` | Color of the icon (CSS color value) |
+| `strokeWidth` | `number \| string` | - | Stroke width for stroke-based icons |
+| `className` | `string` | - | Additional CSS classes |
+| `...props` | `SVGProps<SVGSVGElement>` | - | Any valid SVG attributes |
+
+### Sizing
+
+Icons are responsive by default and scale with the parent font size. You can customize the size in multiple ways:
+
+```tsx
+// Default size (1em - scales with font-size)
+<IconSearch />
+
+// Numeric size (pixels)
+<IconSearch size={24} />
+<IconSearch size={32} />
+
+// String size (CSS units)
+<IconSearch size="2rem" />
+<IconSearch size="24px" />
+
+// Responsive with parent font-size
+<div className="text-lg">
+  <IconSearch /> {/* Icon automatically scales */}
+</div>
+
+// Using CSS classes (Tailwind example)
+<IconSearch className="w-6 h-6" />
+```
+
+### Coloring
+
+Icons use `currentColor` by default, making them easy to theme:
+
+```tsx
+// Inherits parent text color
+<div className="text-blue-500">
+  <IconSearch />
+</div>
+
+// Explicit color prop
+<IconSearch color="#1890ff" />
+<IconSearch color="var(--primary-color)" />
+
+// Using CSS classes
+<IconSearch className="text-blue-500" />
+<IconSearch className="text-gray-900 dark:text-white" />
+```
+
+### Interactive Icons
+
+```tsx
+// With click handler
+<IconSearch 
+  onClick={() => console.log('Search clicked')} 
+  className="cursor-pointer"
+/>
+
+// With hover effects
+<IconSearch className="hover:text-blue-500 transition-colors" />
+
+// As a button
+<button>
+  <IconSearch size={20} />
+  Search
+</button>
+```
+
+### Using Refs
+
+```tsx
+import { useRef } from 'react';
+import { IconSearch } from '@freightos/icons';
+
+function Component() {
+  const iconRef = useRef<SVGSVGElement>(null);
+
+  return <IconSearch ref={iconRef} />;
+}
+```
+
+## TypeScript Support
+
+### Using the Icon Type
+
+The `Icon` type allows you to create type-safe variables that hold icon components:
+
+```typescript
+import { Icon, IconSearch, IconUser, IconDashboard } from '@freightos/icons';
+
+// Define an interface with an icon property
+interface NavItem {
+  title: string;
+  icon: Icon;  // Type for icon components
+  path: string;
+}
+
+// Assign icon components (not JSX elements)
+const navItems: NavItem[] = [
+  { title: 'Search', icon: IconSearch, path: '/search' },
+  { title: 'Profile', icon: IconUser, path: '/profile' },
+  { title: 'Dashboard', icon: IconDashboard, path: '/dashboard' },
+];
+
+// Use in your component
+function Navigation() {
+  return (
+    <nav>
+      {navItems.map(item => {
+        const IconComponent = item.icon;
+        return (
+          <a key={item.title} href={item.path}>
+            <IconComponent size={20} />
+            <span>{item.title}</span>
+          </a>
+        );
+      })}
+    </nav>
+  );
+}
+```
+
+### Type-Safe Component Props
+
+```typescript
+import { Icon } from '@freightos/icons';
+
+interface ButtonProps {
+  label: string;
+  icon: Icon;
+  onClick: () => void;
+}
+
+function IconButton({ label, icon: IconComponent, onClick }: ButtonProps) {
+  return (
+    <button onClick={onClick}>
+      <IconComponent size={20} />
+      {label}
+    </button>
+  );
+}
+
+// Usage
+<IconButton 
+  icon={IconSearch} 
+  label="Search" 
+  onClick={() => console.log('clicked')} 
+/>
+```
+
+### Configuration Objects
+
+```typescript
+import { Icon, IconDashboard, IconSettings, IconUser } from '@freightos/icons';
+
+interface MenuItem {
+  id: string;
+  label: string;
+  icon: Icon;
+  badge?: number;
+}
+
+const menuConfig: MenuItem[] = [
+  { id: '1', label: 'Dashboard', icon: IconDashboard },
+  { id: '2', label: 'Settings', icon: IconSettings },
+  { id: '3', label: 'Profile', icon: IconUser, badge: 5 },
+];
+```
+
+### Dynamic Icon Selection
+
+```typescript
+import { Icon, IconSearch, IconUser, IconDashboard } from '@freightos/icons';
+
+const iconMap: Record<string, Icon> = {
+  search: IconSearch,
+  user: IconUser,
+  dashboard: IconDashboard,
+};
+
+function DynamicIcon({ name }: { name: string }) {
+  const IconComponent = iconMap[name];
+  
+  if (!IconComponent) {
+    console.warn(`Icon "${name}" not found`);
+    return null;
+  }
+  
+  return <IconComponent size={24} />;
+}
+
+// Usage
+<DynamicIcon name="search" />
+<DynamicIcon name="user" />
+```
+
+## Styling with CSS Frameworks
+
+### Tailwind CSS
+
+```tsx
+// Size with Tailwind
+<IconSearch className="w-6 h-6" />
+<IconSearch className="w-8 h-8" />
+
+// Color with Tailwind
+<IconSearch className="text-blue-500" />
+<IconSearch className="text-red-600" />
+
+// Responsive
+<IconSearch className="w-4 h-4 md:w-6 md:h-6 lg:w-8 lg:h-8" />
+
+// Dark mode
+<IconSearch className="text-gray-900 dark:text-gray-100" />
+
+// Interactive states
+<IconSearch className="text-gray-600 hover:text-blue-500 active:text-blue-700 transition-colors" />
+
+// In a button
+<button className="flex items-center gap-2 px-4 py-2 bg-blue-500 text-white rounded">
+  <IconSearch className="w-5 h-5" />
+  <span>Search</span>
+</button>
+```
+
+### Custom CSS
+
+```css
+.icon-primary {
+  width: 24px;
+  height: 24px;
+  color: var(--color-primary);
+}
+
+.icon-large {
+  width: 48px;
+  height: 48px;
+}
+
+.icon-interactive {
+  cursor: pointer;
+  transition: color 0.2s;
+}
+
+.icon-interactive:hover {
+  color: var(--color-primary);
+}
+```
+
+```tsx
+<IconSearch className="icon-primary" />
+<IconUser className="icon-large" />
+<IconDashboard className="icon-interactive" />
+```
+
+## Available Icons
+
+All 213 icons are available, organized by category:
+
+- **Navigation**: Search, MenuOpen, MenuClose, ArrowBack, ArrowForward, CaretUp, CaretDown, etc.
+- **Actions**: Edit, Trash, Save, Copy, Check, Close, Plus, Minus, Refresh, etc.
+- **Transport**: ModeAir, ModeShip, ModeTruck, ModeTrain, ModeAirExpress, etc.
+- **Business**: Company, Factory, Warehouse, Office, Billing, Pay, MoneyCase, etc.
+- **Communication**: Message, Call, Envelope, ChatProgress, NotificationBell, etc.
+- **User**: User, UserCircled, People, AddPerson, etc.
+- **Status**: AlertCircled, InfoCircled, CheckCircled, Verified, Pending, etc.
+- **Documents**: Document, Documents, Download, Upload, Archive, Attachment, etc.
+- **Interface**: Dashboard, Settings, Filter, List, Grid, Table, Tile, etc.
+- **Logistics**: Container, Box, Pallet, Crate, Customs, Insurance, Port, etc.
+
+See your IDE's autocomplete for the complete list of all 213 icons.
+
+## Icon Naming Convention
+
+Icons follow a consistent naming pattern:
+
+- SVG filename: `search.svg` → Component: `IconSearch`
+- SVG filename: `menu-open.svg` → Component: `IconMenuOpen`
+- SVG filename: `mode-air-express.svg` → Component: `IconModeAirExpress`
+
+## Development
+
+### Adding New Icons
+
+1. Add your SVG file to the `svg/` directory (use kebab-case naming: `my-icon.svg`)
+2. Generate React components:
+
+```bash
+npm run generate
+```
+
+This will:
+- Generate React components in `src/icons/`
+- Update the index file with exports
+- Replace hardcoded colors with `currentColor`
+
+3. Build the package:
+
+```bash
+npm run build
+```
+
+### Available Scripts
+
+```bash
+# Generate icons from SVG files
+npm run generate
+
+# Build all formats (ESM + CJS + Types)
+npm run build
+
+# Build ESM only
+npm run build:esm
+
+# Build CJS only
+npm run build:cjs
+
+# Build type definitions only
+npm run build:types
+
+# Clean build output
+npm run clean
+
+# Generate and build in one command
+npm run dev
+```
+
+## Maintainer
+
+Maintained by **Jiries Nasrawi** (jiries@freightos.com)
+
+## License
+
+MIT © Freightos

package/dist/cjs/icons/IconAddPerson.js

@@ -0,0 +1,49 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IconAddPerson = void 0;
+const react_1 = __importStar(require("react"));
+exports.IconAddPerson = (0, react_1.forwardRef)(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (react_1.default.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
+        width: size,
+        height: size,
+        minWidth: size,
+        minHeight: size,
+        flexShrink: 0,
+        display: 'inline-block',
+        verticalAlign: 'middle',
+        ...style,
+    }, ...props },
+    react_1.default.createElement("path", { d: "M19.273 9.546V6.818h-1.819v2.728h-2.727v1.818h2.727v2.727h1.819v-2.727H22V9.545h-2.727zm-10 2.727a3.635 3.635 0 003.636-3.637A3.635 3.635 0 009.273 5a3.635 3.635 0 00-3.637 3.636 3.635 3.635 0 003.637 3.637zm0-5.455c1 0 1.818.818 1.818 1.818s-.818 1.819-1.818 1.819-1.818-.819-1.818-1.819.818-1.818 1.818-1.818zm5.809 7.782a12.758 12.758 0 00-5.81-1.418c-2.3 0-4.281.636-5.808 1.418A2.7 2.7 0 002 17.018v2.528h14.546v-2.528a2.7 2.7 0 00-1.464-2.418zm-.355 3.127H3.818v-.709c0-.345.182-.654.473-.8A11.007 11.007 0 019.273 15c2.154 0 3.9.664 4.982 1.218a.883.883 0 01.472.8v.71z", fill: "currentColor" }))));
+exports.IconAddPerson.displayName = 'IconAddPerson';

package/dist/cjs/icons/IconAddressBook.js

@@ -0,0 +1,49 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IconAddressBook = void 0;
+const react_1 = __importStar(require("react"));
+exports.IconAddressBook = (0, react_1.forwardRef)(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (react_1.default.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
+        width: size,
+        height: size,
+        minWidth: size,
+        minHeight: size,
+        flexShrink: 0,
+        display: 'inline-block',
+        verticalAlign: 'middle',
+        ...style,
+    }, ...props },
+    react_1.default.createElement("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M17.626 6.376v12.936a.474.474 0 01-.138.341.499.499 0 01-.345.147H5.714a.498.498 0 01-.345-.146.474.474 0 01-.138-.341V4.687a.474.474 0 01.138-.34.498.498 0 01.345-.147h11.43c.13.003.253.055.344.146.09.092.14.214.138.341v1.689zM20 8.202a.415.415 0 01-.125.297.436.436 0 01-.303.124h-.714v2.25h.714a.44.44 0 01.304.125.419.419 0 01.124.298v1.406a.41.41 0 01-.124.298.432.432 0 01-.304.124h-.714v2.25h.714a.44.44 0 01.304.124.419.419 0 01.124.298v1.406a.415.415 0 01-.125.297.436.436 0 01-.303.124h-.714v1.689a1.642 1.642 0 01-.5 1.19 1.745 1.745 0 01-1.216.498H5.714a1.745 1.745 0 01-1.215-.498A1.658 1.658 0 014 19.312V4.688a1.659 1.659 0 01.499-1.19A1.745 1.745 0 015.714 3h11.43c.456.003.893.182 1.214.498.321.316.5.744.499 1.19v1.688h.713a.44.44 0 01.305.123.42.42 0 01.125.298v1.406-.001zm-7.462 2.148c0-.62-.518-1.126-1.153-1.126-.636 0-1.155.507-1.155 1.126 0 .62.52 1.126 1.155 1.126s1.154-.507 1.154-1.126h-.001zm2.307 5.063c-.113-.401-1.902-1.126-3.46-1.126-1.559 0-3.347.726-3.463 1.13v.557h6.925v-.561h-.002zM9.078 10.35a2.211 2.211 0 01.675-1.59c.214-.21.469-.375.749-.489a2.358 2.358 0 012.514.487c.214.21.384.457.5.73a2.201 2.201 0 01-.5 2.452 2.338 2.338 0 01-1.63.659 2.337 2.337 0 01-1.632-.659 2.221 2.221 0 01-.676-1.59zM6.77 15.413c0-1.497 3.075-2.25 4.616-2.25 1.54 0 4.615.753 4.615 2.25V17.1H6.77v-1.687z", fill: "currentColor" }))));
+exports.IconAddressBook.displayName = 'IconAddressBook';

package/dist/cjs/icons/IconAi.js

@@ -0,0 +1,49 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IconAi = void 0;
+const react_1 = __importStar(require("react"));
+exports.IconAi = (0, react_1.forwardRef)(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (react_1.default.createElement("svg", { ref: ref, viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
+        width: size,
+        height: size,
+        minWidth: size,
+        minHeight: size,
+        flexShrink: 0,
+        display: 'inline-block',
+        verticalAlign: 'middle',
+        ...style,
+    }, ...props },
+    react_1.default.createElement("path", { d: "M11.2426 0.333496L10.479 2.00016L8.81835 2.75774L10.479 3.52138L11.2426 5.18198L12.0002 3.52138L13.6668 2.75774L12.0002 2.00016M5.18198 2.15168L3.66683 5.48501L0.333496 7.00016L3.66683 8.51531L5.18198 11.8486L6.69713 8.51531L10.0305 7.00016L6.69713 5.48501M11.2426 8.81835L10.479 10.479L8.81835 11.2426L10.479 12.0002L11.2426 13.6668L12.0002 12.0002L13.6668 11.2426L12.0002 10.479", fill: "currentColor" }))));
+exports.IconAi.displayName = 'IconAi';

package/dist/cjs/icons/IconAiGradient.js

@@ -0,0 +1,53 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IconAiGradient = void 0;
+const react_1 = __importStar(require("react"));
+exports.IconAiGradient = (0, react_1.forwardRef)(({ size = '1em', strokeWidth, style, ...props }, ref) => (react_1.default.createElement("svg", { ref: ref, viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", style: {
+        width: size,
+        height: size,
+        minWidth: size,
+        minHeight: size,
+        flexShrink: 0,
+        display: 'inline-block',
+        verticalAlign: 'middle',
+        ...style,
+    }, ...props },
+    react_1.default.createElement("defs", null,
+        react_1.default.createElement("linearGradient", { id: "ai-gradient", x1: "0%", y1: "0%", x2: "100%", y2: "0%" },
+            react_1.default.createElement("stop", { offset: "0%", stopColor: "#006EB2" }),
+            react_1.default.createElement("stop", { offset: "100%", stopColor: "#8300B2" }))),
+    react_1.default.createElement("path", { d: "M11.2426 0.333496L10.479 2.00016L8.81835 2.75774L10.479 3.52138L11.2426 5.18198L12.0002 3.52138L13.6668 2.75774L12.0002 2.00016M5.18198 2.15168L3.66683 5.48501L0.333496 7.00016L3.66683 8.51531L5.18198 11.8486L6.69713 8.51531L10.0305 7.00016L6.69713 5.48501M11.2426 8.81835L10.479 10.479L8.81835 11.2426L10.479 12.0002L11.2426 13.6668L12.0002 12.0002L13.6668 11.2426L12.0002 10.479", fill: "url(#ai-gradient)" }))));
+exports.IconAiGradient.displayName = 'IconAiGradient';

package/dist/cjs/icons/IconAirplaneLanding.js

@@ -0,0 +1,49 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IconAirplaneLanding = void 0;
+const react_1 = __importStar(require("react"));
+exports.IconAirplaneLanding = (0, react_1.forwardRef)(({ size = '1em', color = 'currentColor', strokeWidth, style, ...props }, ref) => (react_1.default.createElement("svg", { ref: ref, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", color: color, style: {
+        width: size,
+        height: size,
+        minWidth: size,
+        minHeight: size,
+        flexShrink: 0,
+        display: 'inline-block',
+        verticalAlign: 'middle',
+        ...style,
+    }, ...props },
+    react_1.default.createElement("path", { d: "M2 19.895h20V22H2v-2.105zm7.558-6.032l4.579 1.221 5.59 1.495a1.588 1.588 0 001.936-1.116 1.593 1.593 0 00-1.116-1.937l-5.59-1.494-2.904-9.506L10.02 2v8.716l-5.232-1.4-.978-2.442-1.527-.41v5.441l1.684.453 5.59 1.505z", fill: "currentColor" }))));
+exports.IconAirplaneLanding.displayName = 'IconAirplaneLanding';