@orangesk/orange-design-system 2.0.0-beta.8 → 2.0.0

package/src/components/Icon/PictogramSearchWrapper.tsx

@@ -0,0 +1,31 @@
+"use client";
+
+import dynamic from "next/dynamic";
+
+// Dynamically import PictogramSearch with no SSR to prevent hydration issues
+const PictogramSearchClient = dynamic(
+  () =>
+    import("./PictogramSearch").then((mod) => ({
+      default: mod.PictogramSearch,
+    })),
+  {
+    ssr: false,
+    loading: () => (
+      <div
+        className="loading-placeholder"
+        style={{
+          minHeight: "200px",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+        }}
+      >
+        Loading pictograms...
+      </div>
+    ),
+  },
+);
+
+export const PictogramSearchWrapper = () => {
+  return <PictogramSearchClient />;
+};

package/src/components/Icon/SpritePathContext.tsx

@@ -16,7 +16,7 @@ export const SpritePathProvider: React.FC<SpritePathProviderProps> = ({
 }) => {
   return (
     <SpritePathContext.Provider value={value} {...other}>
-      {React.Children.only(children)}
+      {children}
     </SpritePathContext.Provider>
   );
 };

package/src/components/Icon/iconSearchTags.ts

@@ -4,83 +4,52 @@ export const iconsWithTags = {
   "accessibility-mobility": ["people"],
   "accessibility-motor": ["other"],
   "accessibility-vision": ["other"],
-  accessibility: ["people"],
-  add: ["common"],
-  advertising: ["other"],
-  aeroplane: ["vehicles"],
   "age-rating-3": ["other"],
   "airbox-auto": ["vehicles", "waves"],
   "alias-numbers": ["people"],
   "android-manage": ["other"],
-  antenna: ["waves"],
   "apartment-building": ["buildings"],
-  apps: ["other"],
-  article: ["reading"],
-  assistent: ["other"],
-  assistance: ["other"],
-  at: ["common"],
-  avatar: ["common", "people"],
   "backup-internet": ["waves"],
-  bank: ["buildings"],
   "battery-charging": ["other"],
   "battery-full": ["other"],
   "battery-status-1-3": ["other"],
   "battery-status-charging": ["other"],
   "battery-status-full": ["other"],
-  bed: ["other"],
-  birth: ["other"],
-  birthday: ["time"],
-  bluetooth: ["common"],
   "boarding-pass": ["vehicles"],
   "book-award": ["reading", "entertainment"],
-  book: ["reading", "entertainment"],
-  boxes: ["other"],
-  briefcase: ["other"],
   "browser-plug-in": ["other"],
   "business-advisor": ["people"],
   "business-consultant": ["people"],
   "business-lounge": ["people"],
-  buy: ["common"],
   "calendar-30": ["time"],
   "calendar-alarm": ["time"],
   "calendar-day": ["time"],
   "calendar-month": ["time"],
   "call-in": ["arrows", "handset"],
   "call-out": ["arrows", "handset"],
-  call: ["handset"],
-  camera: ["other"],
   "car-park": ["other"],
-  car: ["vehicles"],
   "card-reader": ["other"],
-  casting: ["entertainment"],
   "cest-ici": ["arrows"],
-  charger: ["other"],
-  chatbot: ["other"],
   "check-your-balance": ["arrows"],
-  checked: ["checks"],
   "chevron-down": ["common", "arrows"],
   "chevron-end": ["common", "arrows"],
   "chevron-left": ["common", "arrows"],
   "chevron-right": ["common", "arrows"],
   "chevron-start": ["common", "arrows"],
   "chevron-up": ["common", "arrows"],
-  child: ["people"],
   "children-channel": ["entertainment"],
   "childrens-content": ["entertainment"],
   "christmas-tree": ["other"],
   "cinema-ticket-2-for-1": ["entertainment"],
   "cle-pc": ["devices"],
-  clock: ["common", "time"],
   "closed-captions": ["other"],
   "cloud-backup": ["arrows"],
   "cloud-security": ["other"],
   "collective-class-training": ["people"],
   "community-sms": ["people"],
   "company-structure": ["other"],
-  connections: ["devices", "waves"],
   "control-centre": ["people"],
   "control-my-data": ["arrows"],
-  cpu: ["other"],
   "currency-euro": ["money"],
   "cyber-shield": ["shields"],
   "dashboard-display": ["devices"],
@@ -88,8 +57,6 @@ export const iconsWithTags = {
   "data-centre": ["other"],
   "data-services": ["arrows"],
   "data-traffic": ["arrows"],
-  data: ["arrows"],
-  delete: ["common"],
   "desk-phone": ["devices", "handset"],
   "desktop-pc": ["devices"],
   "device-fixed-line-phone": ["devices"],
@@ -98,33 +65,17 @@ export const iconsWithTags = {
   "device-smart-phone": ["devices"],
   "device-tablet": ["devices"],
   "device-tv": ["devices"],
-  diagnostic: ["reading"],
   "digital-frame": ["other"],
+  "discount-price": ["money"],
   "discussion-more": ["other"],
-  doctor: ["people"],
-  documentary: ["entertainment"],
-  donation: ["money"],
-  download: ["common", "arrows"],
   "e-reader": ["reading"],
   "e-shop": ["common"],
   "easy-internet": ["devices"],
   "eco-mode": ["other"],
-  edit: ["common"],
-  electrcar: ["vehicles"],
-  email: ["common"],
-  employees: ["people"],
   "empty-trash": ["common"],
-  entertainment: ["entertainment"],
-  epg: ["devices"],
   "error-severe": ["common"],
-  ethenet: ["other"],
-  euro: ["common", "money"],
-  exit: ["arrows"],
-  "facebook-2": ["common"],
-  facebook: ["common"],
-  factory: ["buildings"],
+  "facebook-2": ["common", "socials"],
   "family-place": ["people"],
-  fashion: ["entertainment"],
   "fast-delivery": ["vehicles"],
   "file-compressed": ["reading"],
   "file-copy": ["reading"],
@@ -133,91 +84,50 @@ export const iconsWithTags = {
   "file-draft-edit": ["reading"],
   "file-pdf": ["common", "reading"],
   "file-terms-and-conditions": ["reading"],
-  files: ["reading"],
-  film: ["entertainment"],
-  filter: ["common"],
-  finance: ["money"],
-  firewall: ["other"],
-  flag: ["other"],
-  flashlight: ["other"],
   "flexible-storage": ["other"],
-  folder: ["common"],
   "football-match": ["people", "entertainment"],
   "football-quiz": ["entertainment"],
-  football: ["entertainment"],
   "form-tick": ["common", "checks"],
   "front-end-dashboard": ["devices", "reading"],
-  funny: ["other"],
   "futher-education": ["other"],
-  games: ["entertainment"],
   "garage-closed": ["buildings"],
   "gauge-rate": ["arrows"],
-  gears: ["other"],
-  geolocation: ["arrows"],
   "guide-info": ["reading"],
-  hammer: ["other"],
   "hand-shake": ["hearts"],
   "hard-drive": ["other"],
   "hdmi-key": ["other"],
-  headphones: ["entertainment"],
   "health-app": ["devices", "hearts"],
   "health-monitor": ["hearts"],
   "health-patient": ["people", "hearts"],
-  heart: ["hearts"],
   "home-appliance": ["other"],
-  home: ["buildings"],
-  homelive: ["buildings"],
-  hourglass: ["time"],
-  house: ["buildings"],
   "id-card": ["people", "reading"],
-  image: ["common"],
-  important: ["common"],
-  improvement: ["arrows"],
-  inbox: ["common", "arrows"],
-  info: ["common"],
   "information-data": ["other"],
-  instagram: ["common"],
   "international-globe": ["other"],
   "internet-browser": ["arrows"],
   "internet-security-desktop": ["devices"],
   "internet-security-mobile": ["devices"],
   "internet-security-password": ["other"],
   "internet-usage": ["arrows"],
-  internet: ["common"],
   "invoice-euro": ["reading", "money"],
   "invoices-euro": ["reading", "money"],
-  iso: ["other"],
   "it-infrastructure": ["devices"],
-  keyboard: ["other"],
   "la-cle-tv": ["devices"],
   "laptop-connected": ["devices", "waves"],
-  laptop: ["devices"],
   "le-vote": ["checks"],
-  link: ["common"],
-  "linkedin-2": ["common"],
-  linkedin: ["common"],
+  "linkedin-2": ["common", "socials"],
   "location-on-map": ["other"],
   "location-pin": ["common", "arrows"],
   "lock-open": ["common"],
-  lock: ["common"],
-  logistics: ["vehicles"],
   "love-logo": ["other"],
-  mahali: ["buildings", "arrows"],
   "maintenance-man": ["people"],
   "map-pin": ["common", "arrows"],
-  map: ["other"],
-  medal: ["other"],
   "medical-app": ["devices", "hearts"],
   "medical-chart": ["reading"],
-  medicine: ["other"],
   "menu-arrow": ["common", "arrows"],
   "menu-grid": ["common"],
-  menu: ["common"],
   "message-alert": ["other"],
-  messages: ["reading"],
   "micro-sd-card": ["other"],
   "microphone-mute": ["common"],
-  microphone: ["common"],
   "mini-games": ["entertainment"],
   "mobile-applications": ["devices"],
   "mobile-data-toggle": ["arrows"],
@@ -226,7 +136,6 @@ export const iconsWithTags = {
   "mobile-payment": ["devices", "money"],
   "mobile-security": ["devices"],
   "mobile-setup": ["devices"],
-  modem: ["waves"],
   "modifier-delete": ["other"],
   "modifier-done": ["checks"],
   "modifier-download": ["arrows"],
@@ -234,7 +143,6 @@ export const iconsWithTags = {
   "money-box": ["money"],
   "more-dots": ["common"],
   "multi-sim": ["other"],
-  music: ["entertainment"],
   "my-account": ["people"],
   "my-orange": ["people"],
   "my-skills": ["people"],
@@ -245,11 +153,8 @@ export const iconsWithTags = {
   "network-optical-amplifier": ["arrows"],
   "network-optical-transport": ["arrows"],
   "network-wan-optimisation-engine": ["arrows"],
-  networks: ["waves"],
-  newspaper: ["reading"],
   "not-checked": ["common"],
   "notification-alert": ["common"],
-  office: ["buildings"],
   "online-help": ["devices"],
   "orange-assistant": ["other"],
   "orange-cash": ["devices", "waves", "money"],
@@ -269,72 +174,35 @@ export const iconsWithTags = {
   "orange-rewards": ["other"],
   "orange-tv": ["devices"],
   "orange-vr-experience": ["entertainment"],
-  outbox: ["arrows"],
   "package-content": ["entertainment", "people"],
   "package-services": ["other"],
-  package: ["arrows"],
   "packaging-icon-hd": ["other"],
   "parabole-tv": ["other"],
   "parental-control": ["people", "shields"],
-  pause: ["common"],
   "payment-card": ["money"],
   "payment-euro": ["money"],
-  pda: ["devices"],
-  pencil: ["other"],
   "personal-hotspot": ["devices", "waves"],
   "personal-smartphone-trainer": ["devices", "people"],
   "phone-advisor": ["devices"],
   "play-and-win": ["entertainment"],
-  play: ["common", "arrows"],
   "plug-socket": ["other"],
-  power: ["common"],
-  powerstation: ["buildings"],
-  presentation: ["devices"],
-  print: ["common"],
-  printer: ["other"],
   "real-time": ["time"],
   "recycle-device": ["devices", "arrows"],
-  recycle: ["common", "arrows"],
-  reduction: ["arrows"],
-  reload: ["common", "arrows"],
-  reminders: ["reading"],
   "remote-desktop-protocol": ["devices", "arrows"],
-  remove: ["common"],
-  repair: ["common"],
-  reseau: ["other"],
-  restaurant: ["entertainment"],
-  rewards: ["other"],
-  running: ["people", "entertainment"],
-  safety: ["shields", "checks"],
-  satallite: ["other"],
-  save: ["common"],
-  school: ["buildings"],
-  science: ["other"],
   "sd-card": ["other"],
-  search: ["common"],
   "security-status-good": ["shields"],
-  send: ["common", "arrows"],
   "senior-person": ["people"],
   "server-storage-array": ["other"],
   "server-tower": ["other"],
   "session-enter": ["arrows"],
   "session-leave": ["arrows"],
-  settings: ["common"],
-  share: ["other"],
   "shop-pin": ["arrows", "checks"],
-  shop: ["buildings"],
   "showroom-mobile-pro": ["devices"],
   "signal-5-5": ["common"],
-  silence: ["common"],
   "sim-e": ["other"],
-  sim: ["other"],
   "simple-mode": ["devices"],
-  simplicity: ["other"],
-  siren: ["other"],
-  skiing: ["people", "entertainment"],
   "skip-to-end": ["common", "arrows"],
   "skip-to-start": ["common", "arrows"],
-  sleep: ["other"],
   "smart-care": ["devices"],
   "smart-home": ["buildings", "waves"],
   "smart-tap": ["other"],
@@ -343,96 +211,236 @@ export const iconsWithTags = {
   "sms-message-compose": ["reading"],
   "sms-message": ["reading"],
   "social-network": ["people"],
-  sofa: ["other"],
-  sort: ["common", "arrows"],
-  stadium: ["buildings", "entertainment"],
-  "star-favourite-half": ["common"],
   "star-empty": ["common"],
+  "star-favourite-half": ["common"],
   "star-favourite": ["common"],
-  startover: ["common", "arrows"],
-  statistics: ["other"],
   "stop-secret": ["shields", "handset"],
   "storage-cloud": ["other"],
   "store-locator": ["arrows"],
-  street: ["buildings"],
   "subscription-package": ["other"],
-  suitcase: ["other"],
-  support: ["people"],
   "surveillance-camera": ["other"],
-  syncronise: ["arrows"],
   "tag-advertising": ["other"],
-  tag: ["other"],
   "target-location": ["common"],
-  tarif: ["other"],
   "task-list": ["reading"],
   "team-connect": ["people"],
   "thumb-up": ["other"],
-  tick: ["checks"],
-  ticket: ["entertainment"],
   "top-up-card-euro": ["money"],
   "top-up-euro": ["arrows", "money"],
   "top-up-time": ["arrows", "money", "time"],
-  town: ["buildings"],
-  townhall: ["buildings"],
-  train: ["vehicles"],
   "training-session": ["people"],
-  tranquility: ["other"],
   "transfer-data": ["devices", "arrows"],
-  transfers: ["common", "arrows"],
-  trash: ["common"],
   "tv-channel-list": ["devices"],
   "tv-commande": ["other"],
   "unlimited-calls": ["handset"],
-  upload: ["common", "arrows"],
   "usb-hard-drive": ["other"],
   "usb-key": ["other"],
   "user-manual": ["reading"],
-  user: ["common", "people"],
   "video-call": ["devices", "people"],
   "video-live": ["common"],
   "video-phone": ["devices"],
   "video-record": ["common"],
-  video: ["entertainment"],
   "vip-contact": ["people", "reading"],
   "virtual-gamepad": ["devices", "entertainment"],
   "vod-portrait": ["arrows"],
-  volte: ["waves", "handset"],
   "volume-status-4-4": ["common", "waves"],
-  vowifi: ["waves", "handset"],
-  wallet: ["money"],
   "warning-important": ["common"],
-  washroom: ["other"],
-  watch: ["time"],
-  water: ["other"],
-  weather: ["other"],
   "web-browser": ["other"],
   "web-camera": ["other"],
   "weighing-scales": ["other"],
-  widget: ["other"],
   "wifi-home": ["waves"],
-  wifi: ["waves", "common"],
-  x: ["common"],
   "your-balance": ["arrows"],
-  youtube: ["common"],
   "zoom-in": ["common"],
   "zoom-out": ["common"],
+  accessibility: ["people"],
+  add: ["common"],
+  advertising: ["other"],
+  aeroplane: ["vehicles"],
+  ai: ["other", "devices"],
+  antenna: ["waves"],
+  apps: ["other"],
+  article: ["reading"],
+  assistance: ["other"],
+  assistent: ["other"],
+  at: ["common"],
+  avatar: ["common", "people"],
+  bank: ["buildings"],
+  bed: ["other"],
+  birth: ["other"],
+  birthday: ["time"],
+  bluetooth: ["common"],
+  book: ["reading", "entertainment"],
+  boxes: ["other"],
+  briefcase: ["other"],
+  buy: ["common"],
+  call: ["handset"],
+  camera: ["other"],
+  car: ["vehicles"],
+  casting: ["entertainment"],
+  charger: ["other"],
+  chatbot: ["other"],
+  checked: ["checks"],
+  child: ["people"],
+  clock: ["common", "time"],
+  connections: ["devices", "waves"],
+  cpu: ["other"],
+  data: ["arrows"],
+  delete: ["common"],
+  diagnostic: ["reading"],
+  doctor: ["people"],
+  documentary: ["entertainment"],
+  donation: ["money"],
+  download: ["common", "arrows"],
+  edit: ["common"],
+  electrcar: ["vehicles"],
+  email: ["common"],
+  employees: ["people"],
+  entertainment: ["entertainment"],
+  epg: ["devices"],
+  ethenet: ["other"],
+  euro: ["common", "money"],
+  exit: ["arrows"],
+  facebook: ["common", "socials"],
+  factory: ["buildings"],
+  fashion: ["entertainment"],
+  files: ["reading"],
+  film: ["entertainment"],
+  filter: ["common"],
+  finance: ["money"],
+  firewall: ["other"],
+  flag: ["other"],
+  flashlight: ["other"],
+  folder: ["common"],
+  football: ["entertainment"],
+  funny: ["other"],
+  games: ["entertainment"],
+  gears: ["other"],
+  geolocation: ["arrows"],
+  hammer: ["other"],
+  headphones: ["entertainment"],
+  heart: ["hearts"],
+  home: ["buildings"],
+  homelive: ["buildings"],
+  hourglass: ["time"],
+  house: ["buildings"],
+  image: ["common"],
+  important: ["common"],
+  improvement: ["arrows"],
+  inbox: ["common", "arrows"],
+  info: ["common"],
+  instagram: ["common", "socials"],
+  internet: ["common"],
+  iso: ["other"],
+  keyboard: ["other"],
+  laptop: ["devices"],
+  link: ["common"],
+  linkedin: ["common", "socials"],
+  lock: ["common"],
+  logistics: ["vehicles"],
+  mahali: ["buildings", "arrows"],
+  map: ["other"],
+  medal: ["other"],
+  medicine: ["other"],
+  menu: ["common"],
+  messages: ["reading"],
+  microphone: ["common"],
+  modem: ["waves"],
+  music: ["entertainment"],
+  networks: ["waves"],
+  newspaper: ["reading"],
+  office: ["buildings"],
+  outbox: ["arrows"],
+  package: ["arrows"],
+  pause: ["common"],
+  pda: ["devices"],
+  pencil: ["other"],
+  pinterest: ["common", "socials"],
+  play: ["common", "arrows"],
+  power: ["common"],
+  powerstation: ["buildings"],
+  presentation: ["devices"],
+  print: ["common"],
+  printer: ["other"],
+  quote: ["reading"],
+  recycle: ["common", "arrows"],
+  reduction: ["arrows"],
+  reload: ["common", "arrows"],
+  reminders: ["reading"],
+  remove: ["common"],
+  repair: ["common"],
+  reseau: ["other"],
+  restaurant: ["entertainment"],
+  rewards: ["other"],
+  running: ["people", "entertainment"],
+  safety: ["shields", "checks"],
+  satallite: ["other"],
+  save: ["common"],
+  school: ["buildings"],
+  science: ["other"],
+  search: ["common"],
+  send: ["common", "arrows"],
+  settings: ["common"],
+  share: ["other"],
+  shop: ["buildings"],
+  silence: ["common"],
+  sim: ["other"],
+  simplicity: ["other"],
+  siren: ["other"],
+  skiing: ["people", "entertainment"],
+  sleep: ["other"],
+  snapchat: ["common", "socials"],
+  sofa: ["other"],
+  sort: ["common", "arrows"],
+  stadium: ["buildings", "entertainment"],
+  startover: ["common", "arrows"],
+  statistics: ["other"],
+  street: ["buildings"],
+  suitcase: ["other"],
+  support: ["people"],
+  syncronise: ["arrows"],
+  tag: ["other"],
+  tarif: ["other"],
+  tick: ["checks"],
+  ticket: ["entertainment"],
+  tiktok: ["common", "socials"],
+  town: ["buildings"],
+  townhall: ["buildings"],
+  train: ["vehicles"],
+  tranquility: ["other"],
+  transfers: ["common", "arrows"],
+  trash: ["common"],
+  upload: ["common", "arrows"],
+  user: ["common", "people"],
+  video: ["entertainment"],
+  volte: ["waves", "handset"],
+  vowifi: ["waves", "handset"],
+  wallet: ["money"],
+  washroom: ["other"],
+  watch: ["time"],
+  water: ["other"],
+  weather: ["other"],
+  whatsapp: ["common", "socials"],
+  widget: ["other"],
+  wifi: ["waves", "common"],
+  x: ["common", "socials"],
+  youtube: ["common", "socials"],
 };
 
 export const tags = [
   "arrows",
   "buildings",
   "checks",
+  "common",
   "devices",
+  "entertainment",
   "handset",
   "hearts",
   "money",
+  "other",
   "people",
+  "reading",
   "shields",
+  "socials",
   "time",
   "vehicles",
   "waves",
-  "reading",
-  "entertainment",
-  "common",
-  "other",
 ];